Laravel 5 Ajax File/Image Upload

Question

I have an issue in my laravel ajax application,

I cant upload images/files through ajax POST.

here is my code.

Ajax..

/*Add new catagory Event*/
$(".addbtn").click(function(){
$.ajax({
      url:'add-catagory',
      data:{
        logo:new FormData($("#upload_form")[0]),
        },
      dataType:'json',
      async:false,
      type:'post',
      processData: false,
      contentType: false,
      success:function(response){
        console.log(response);
      },
    });
 });
/*Add new catagory Event*/

Blade template ...

 <form enctype="multipart/form-data" id="upload_form" role="form" method="POST" action="" >
      <div class="form-group">
        <label for="catagry_name">Name</label>
         <input type="hidden" name="_token" value="{{ csrf_token()}}">
        <input type="text" class="form-control" id="catagry_name" placeholder="Name">
        <p class="invalid">Enter Catagory Name.</p>
      </div>
      <div class="form-group">
        <label for="catagry_name">Logo</label>
        <input type="file" class="form-control" id="catagry_logo">
        <p class="invalid">Enter Catagory Logo.</p>
    </div>

    </form>
    </div>
    <div class="modelFootr">
      <button type="button" class="addbtn">Add</button>
      <button type="button" class="cnclbtn">Reset</button>
    </div>
  </div>

Controller ..

public function catadd(){
    if (Input::hasFile('logo'))
    {
       return "file present";
    }
    else{
        return "file not present";
    }
}

Route ..

 Route::post('add-catagory',['as'=>'catagory_add','uses'=>'MastersController@catadd']);

What is the error in my code ???

I cant get the file information in laravel controller..

How can i solve this issue...?

any ideas here stackoverflow.com/questions/38893450/…

user6002037
– user6002037

2016-08-11 13:18:59 +00:00
Commented Aug 11, 2016 at 13:18 — user6002037
– user6002037, Commented Aug 11, 2016 at 13:18

Iamzozo · Accepted Answer · 2015-09-03 07:54:07Z

27

Two things to change:

Change your js file from:

 data:{
    logo:new FormData($("#upload_form")[0]),
 },

To:

 data:new FormData($("#upload_form")[0]),

Because you would like to send the whole form.

In your html:

Add a name to your file input field

<input type="file" class="form-control" id="catagry_logo">

To:

<input type="file" name="logo" class="form-control" id="catagry_logo">

answered Sep 3, 2015 at 7:54

Iamzozo

2,35618 silver badges21 bronze badges

Sign up to request clarification or add additional context in comments.

5 Comments

Jishad P Over a year ago

Woooooooooooooow.. Thanks dude... Its working perfect.

Hardy Mathew Over a year ago

it's say TypeError: Illegal invocation

Iamzozo Over a year ago

It's say lets find the answer on google, good guy, helpful ;)

user6002037 Over a year ago

@lamzozo any ideas here stackoverflow.com/questions/38893450/…

Hardy Mathew Over a year ago

@Karthiga not yet

Marko · Accepted Answer · 2015-09-03 06:53:44Z

1

Check in your controller what you get when you post:

echo dd(Input::all());

Check files object in php. This in PHP:

$_FILES

Request::file("logo");

Yeah, you're not really posting any data? Is the form really posting?

edited Sep 3, 2015 at 6:53

answered Sep 3, 2015 at 5:12

Marko

11.1k17 gold badges74 silver badges94 bronze badges

2 Comments

Marko Over a year ago

What about files object in php?

user6002037 Over a year ago

@marko any ideas here stackoverflow.com/questions/38893450/… I don't think I'm posting any data!

Başar Söker · Accepted Answer · 2016-04-04 09:56:38Z

1

it doesn't work for me because of dataType:'json'. If anyone gets error just remove dataType:'json'.

answered Apr 4, 2016 at 9:56

Başar Söker

72710 silver badges18 bronze badges

1 Comment

LuizEduardoMPF Over a year ago

The above post of @lamzozo was almost perfect, but it only worked when remove dataType. So, it works great.

Collectives™ on Stack Overflow

Laravel 5 Ajax File/Image Upload

3 Answers 3

5 Comments

2 Comments

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

5 Comments

2 Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related