title: Ajax File Upload With Form Data Laravel 5.3
body: <p>i want to upload a profile <code>image</code> of a <code>user</code> to the server and i'm stuck at ajax upload of image</p>
  
  <p>all my form data are posting to <code>database</code> including the <code>image name</code> but the file is not uploading to the server</p>
  
  <p>my view is</p>
  
  <pre><code>//form
  &lt;form id="example-form" method="post" enctype="multipart/form-data"&gt;
      {!! csrf_field() !!}
      &lt;div class="row"&gt;
          &lt;div class="col m12"&gt;
              &lt;div class="row"&gt;
                  &lt;div class="input-field col m12 s12"&gt;
                      &lt;input id="name" name="name" type="text" placeholder="Full Name" class="required validate"&gt;
                  &lt;/div&gt;
                  &lt;div class="input-field col s12"&gt;
                      &lt;input id="email" name="email" type="email" placeholder="Email" class="required validate"&gt;
                  &lt;/div&gt;
                  &lt;div class="input-field col s12"&gt;
                      &lt;input id="phone_number" name="phone_number" type="tel" placeholder="Phone Number" class="required validate"&gt;
                  &lt;/div&gt;                                                        
                  &lt;div class="input-field col m6 s12"&gt;
                      &lt;input id="address" name="address_city_village" type="text" placeholder="Address City Village"&gt;
                  &lt;/div&gt;
                  &lt;div class="input-field col m6 s12"&gt;
                      &lt;input id="state" name="address_state" type="text" placeholder="State"&gt;
                  &lt;/div&gt;                                                        
                  &lt;div class="input-field col s12"&gt;
                      &lt;input id="password" name="password" type="password" placeholder="Password" class="required validate"&gt;
                  &lt;/div&gt;
                  &lt;div class="input-field col s12"&gt;
                      &lt;input id="confirm" name="confirm" type="password" placeholder="Confirm Password" class="required validate"&gt;
                  &lt;/div&gt;
                  &lt;div class="file-field input-field col s12"&gt;
                      &lt;div class="btn teal lighten-1"&gt;
                          &lt;span&gt;Image&lt;/span&gt;
                          &lt;input type="file" name="image"&gt;
                      &lt;/div&gt;
                      &lt;div class="file-path-wrapper"&gt;
                          &lt;input class="file-path validate" type="text" &gt;
                      &lt;/div&gt;
                  &lt;/div&gt;                                                        
              &lt;/div&gt;
          &lt;/div&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  &lt;/div&gt;
  &lt;div class="modal-footer"&gt;
  &lt;button type="submit" class="waves-effect waves-green btn blue"&gt;Submit&lt;/button&gt;
  &lt;/div&gt;
  &lt;/form&gt;
  
  //ajax
  $(document).on("click", ".agent-add", function () {
  
      var agent_id = $(this).data('id');
  
      $('form').submit(function(event) {
          event.preventDefault();
          $.ajax
          ({
              url: '{{ url('/agents') }}',
              type: 'POST',              
              data: {
                  "_method": 'POST',
                  "name": $('input[name=name]').val(),
                  "email": $('input[name=email]').val(),
                  "phone_number": $('input[name=phone_number]').val(),
                  "address_city_village": $('input[name=address_city_village]').val(),
                  "address_state": $('input[name=address_state]').val(),
                  "image": $('input[name=image]').val(),
                  "password": $('input[name=password]').val()
              },
              success: function(result)
              {
                  location.reload();
              },
              error: function(data)
              {
                  console.log(data);
              }
          });
  
      });
  }); 
  </code></pre>
  
  <p>my controller is</p>
  
  <pre><code>public function store(Request $request)
  {
      if (User::where('phone_number', '=', Input::get('phone_number'))-&gt;exists()) {
         return $this-&gt;respondBadRequest('Phone Number Exists');
      }
      else 
      {
          User::create($request-&gt;all());
  
          return redirect('agents')-&gt;with('Success', 'Agent Added');
  
          if($request-&gt;hasFile('image')) {
              $file = $request-&gt;file('image');
  
              //you also need to keep file extension as well
              $name = $file-&gt;getClientOriginalName().'.'.$file-&gt;getClientOriginalExtension();
  
              //using array instead of object
              $image['filePath'] = $name;
              $file-&gt;move(public_path().'/uploads/', $name);
  
          }
      }
  }
  </code></pre>
  
  <p>i guess i'm missing something in <code>ajax posting</code>, but i couldn't figure it out</p>
  
  <p>i <code>dd($request-&gt;all());</code></p>
  
  <p>the result is</p>
  
  <pre><code>array:9 [▼
    "_token" =&gt; "heSkwHd8uSIotbqV1TxtAoG95frcRTATgeGL0aPM"
    "name" =&gt; "fwe"
    "email" =&gt; "sanjiarya2112@gmail.com"
    "phone_number" =&gt; "4444422555"
    "address_city_village" =&gt; "sgf"
    "address_state" =&gt; "gfdgsdf"
    "password" =&gt; "ffffff"
    "confirm" =&gt; "ffffff"
    "image" =&gt; UploadedFile {#208 ▼
      -test: false
      -originalName: "Screenshot (8).png"
      -mimeType: "image/png"
      -size: 135920
      -error: 0
      path: "C:\wamp\tmp"
      filename: "php47F2.tmp"
      basename: "php47F2.tmp"
      pathname: "C:\wamp\tmp\php47F2.tmp"
      extension: "tmp"
      realPath: "C:\wamp\tmp\php47F2.tmp"
      aTime: 2017-01-24 06:14:40
      mTime: 2017-01-24 06:14:40
      cTime: 2017-01-24 06:14:40
      inode: 0
      size: 135920
      perms: 0100666
      owner: 0
      group: 0
      type: "file"
      writable: true
      readable: true
      executable: false
      file: true
      dir: false
      link: false
      linkTarget: "C:\wamp\tmp\php47F2.tmp"
    }
  ]
  </code></pre>
  
  <p>i checked the <code>C:\wamp\tmp\php47F2.tmp</code> enen there i din't find the image</p>
  
  <p>looking forward for much needed help</p>
  
  <p>thank you</p>