kavyababu17's avatar

Upload images using AJAX Jquery in laravel

Hi Everyone, I am getting 419 unknown status error. I tried to upload 5 images via ajax jquery to controllers.I tried some solutions like ajax header setup and formdata pass. But its not even getting through URL. url: "{{route('collage.store')}}", Route::post('/', 'CollagePrimController@post')->name('collage.store'); Please anyone help me to fix thiss.

0 likes
8 replies
cre3z's avatar

show us your ajax code and request headers, are you posting it through a form? if so make sure you have your enctype="multipart/form-data" set

kavyababu17's avatar
  <form method="POST" id="needs" novalidate enctype="multipart/form-data">
        {{csrf_field()}}
            <input name="image1" id="image1" type="file" class="form-control" required="" />
            <br>
            <input type="file" name="image2" id="image2" class="form-control" required/>
            <br>
            <input type="file" name="image3" id="image3" class="form-control" required/>
            <br>
            <input type="file" name="image4" id="image4" class="form-control" required/>
            <br>
            <input type="file" name="image5" id="image5" class="form-control" required />
            <br>
            <button type="button" id="upload_image" name="upload_image" class="btn btn-lg btn-success" onclick="image_up();">Upload</button>
          </form>

function image_up() { alert("Uploading start"); $.ajax({ headers: { 'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content') }, url: "{{route('collage.store')}}", type: 'POST', data : new FormData($(this)[0]), dataType: "json", cache : false, processData: false, success: function () { alert("response"); } }); }

cre3z's avatar

have you tried referencing your form correctly? make sure your $(this) is referreing to the form.

var form = $('form')[0];
var formData = new FormData(form);

$.ajax({ 
            headers: { 'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content') }, 
            url: "route", 
            type: 'POST', 
            data : formData, 
            cache : false, 
            processData: false, 
            success: function () { alert("response"); } 
        }); 

if this doesn't check your request headers in your network tab to see that it is posting the data.

kavyababu17's avatar

"Illuminate\Database\QueryException" file : "C:\laragon\www\collage\vendor\laravel\framework\src\Illuminate\Database\Connection.php" line : 664 message : "SQLSTATE[HY000]: General error: 1364 Field 'image1' doesn't have a default value (SQL: insert into collages (user_id, updated_at, created_at) values (5, 2017-11-09 17:21:19, 2017-11-09 17:21:19))" trace : [{file: "C:\laragon\www\collage\vendor\laravel\framework\src\Illuminate\Database\Connection.php",…},…]

As well no data passed

kavyababu17's avatar

Values is not passing through actually all filenames are empty

kavyababu17's avatar

Yes u can. But from ajax itself its not passing value

kavyababu17's avatar

public function post(Request $request){ $collage = new Collage();

    if ($request->hasFile('image1')){
        $image = $request->file('image1');
        $filename = str_random(12) . '.' . $image->getClientOriginalExtension();
        $location = public_path('collage/' . $filename);
        Image::make($image)->save($location);
        $collage->image1 = $filename;
        // $collage->save();
    }

Please or to participate in this conversation.