problem with e.preventDefault () using Ajax in Laravel 5.7

Question

problem with e.preventDefault () using Ajax in Laravel 5.7

Navigation

#1 by (0 votes)
#2 by (0 votes)
#3 by (0 votes)

1

I have a form sent by ajax but it does not save the information in the DB when I activate e.preventDefault (); if I mention it if you save it.

EL Ajax is:

$.ajaxSetup({
        headers: {
            'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
        }
    }); 

    $("#enviar").click(function(e){
        e.preventDefault();
        var codigo = $('#codigo').val();
        var tipo = $('#tipo').val();
        var ip = $('#ip').val();
        $.ajax({
           type:'POST',
           url: 'control',
           data:{
               codigo: codigo, 
               tipo: tipo, 
               ip: ip},
           success: function(data){
            console.log(data);
           }
        });
    });

The driver is:

public function store(Request $request)
{
    //dd($request->All());

    $control = new Control();
    $control->identification = $request->codigo;
    $control->type = $request->tipo;
    $control->date = date("Y/m/d");
    $control->time = date("h:i:s");
    $control->ip = $request->ip;
    $control->save();
    return response()->json(['success'=>'Got Simple Ajax Request.']);
}

The routes are:

Route::get('/control', 'ControlController@index');
Route::post('/control/store', 'ControlController@store');

I am using version 5.7 of laravel, I do not know if any books are missing, try the tutorials that I see on youtube and they are the same ones that I have always used.

php ajax laravel laravel-5.7

asked by Juan Jose Flores Cuadros 27.12.2018 в 22:48

source

3 answers

PROBLEM WITH COLLATION (NULL) CREATING A DATABASE SQL SERVER Doubt MySQL INT, SMALLINT, etc

score 0 · Answer 1

0

in the model have you added those fields? something like that

protected $fillable = ['identification', 'type','date','time','ip',];

Then check if you have fields that do not accept null

answered by 28.12.2018 в 01:11

score 0 · Answer 2

Probably at the moment of making the request with ajax the csrf-token is not being sent, so at the moment of commenting the e.preventDefault (); you are indicating that the page is reloaded, with which the token if sent to the backend, in addition the url must be indicated as you declared in the web file control / store, the code would be something like this:

$("#enviar").click(function(e){
    e.preventDefault();
    var codigo = $('#codigo').val();
    var tipo = $('#tipo').val();
    var ip = $('#ip').val();
    $.ajax({
      headers: {
        //Prueba cual de las dos formas te funcionan
        'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
        'X-CSRF-TOKEN': $('input[name="_token"]').val()
      },
       type:'POST',
       url: 'control/store',
       data:{
           codigo: codigo, 
           tipo: tipo, 
           ip: ip},
       success: function(data){
        console.log(data);
       }
    });
});

score 0 · Answer 3

If the button with the id "#enviate" is of the submit type, by removing the preventDefault () it is possible that the form html is running and not the ajax, change it to type="button"

The URL of your ajax is wrong, it should be 'control / store'.

Make sure you have the tag inside the csrf token properly configured in your layout (main view)

<meta name="csrf-token" content="{{ csrf_token() }}">