Ajax загрузки файлов с формой данных Laravel 5,3

Question

я хочу, чтобы загрузить профиль image из user на сервер и я застрял на АЯКС загрузки изображения

все мои данные формы проводки в database включая image name но файл не загружая на сервер

мой взгляд

//form 
<form id="example-form" method="post" enctype="multipart/form-data"> 
    {!! csrf_field() !!} 
    <div class="row"> 
     <div class="col m12"> 
      <div class="row"> 
       <div class="input-field col m12 s12"> 
        <input id="name" name="name" type="text" placeholder="Full Name" class="required validate"> 
       </div> 
       <div class="input-field col s12"> 
        <input id="email" name="email" type="email" placeholder="Email" class="required validate"> 
       </div> 
       <div class="input-field col s12"> 
        <input id="phone_number" name="phone_number" type="tel" placeholder="Phone Number" class="required validate"> 
       </div>               
       <div class="input-field col m6 s12"> 
        <input id="address" name="address_city_village" type="text" placeholder="Address City Village"> 
       </div> 
       <div class="input-field col m6 s12"> 
        <input id="state" name="address_state" type="text" placeholder="State"> 
       </div>               
       <div class="input-field col s12"> 
        <input id="password" name="password" type="password" placeholder="Password" class="required validate"> 
       </div> 
       <div class="input-field col s12"> 
        <input id="confirm" name="confirm" type="password" placeholder="Confirm Password" class="required validate"> 
       </div> 
       <div class="file-field input-field col s12"> 
        <div class="btn teal lighten-1"> 
         <span>Image</span> 
         <input type="file" name="image"> 
        </div> 
        <div class="file-path-wrapper"> 
         <input class="file-path validate" type="text" > 
        </div> 
       </div>               
      </div> 
     </div> 
    </div> 
</div> 
</div> 
<div class="modal-footer"> 
<button type="submit" class="waves-effect waves-green btn blue">Submit</button> 
</div> 
</form> 

//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); 
      } 
     }); 

    }); 
}); 

мой контроллер

public function store(Request $request) 
{ 
    if (User::where('phone_number', '=', Input::get('phone_number'))->exists()) { 
     return $this->respondBadRequest('Phone Number Exists'); 
    } 
    else 
    { 
     User::create($request->all()); 

     return redirect('agents')->with('Success', 'Agent Added'); 

     if($request->hasFile('image')) { 
      $file = $request->file('image'); 

      //you also need to keep file extension as well 
      $name = $file->getClientOriginalName().'.'.$file->getClientOriginalExtension(); 

      //using array instead of object 
      $image['filePath'] = $name; 
      $file->move(public_path().'/uploads/', $name); 

     } 
    } 
} 

я думаю, что я что-то в ajax posting не хватает, но я не мог понять

я dd($request->all());

результат

array:9 [▼ 
    "_token" => "heSkwHd8uSIotbqV1TxtAoG95frcRTATgeGL0aPM" 
    "name" => "fwe" 
    "email" => "sanjiarya2112@gmail.com" 
    "phone_number" => "4444422555" 
    "address_city_village" => "sgf" 
    "address_state" => "gfdgsdf" 
    "password" => "ffffff" 
    "confirm" => "ffffff" 
    "image" => 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" 
    } 
] 

я проверил C:\wamp\tmp\php47F2.tmp EnEn там я дина 't найти изображение

с нетерпением жду очень необходимой помощи

спасибо

Answer 1

Попробуйте использовать FormData в ajax во время загрузки файла.

Просто попробуйте этот

$('form').submit(function(event) { 
    event.preventDefault(); 
    var formData = new FormData($(this)[0]); 
    $.ajax({ 
     url: '{{ url('/agents') }}', 
     type: 'POST',    
     data: formData, 
     success: function(result) 
     { 
      location.reload(); 
     }, 
     error: function(data) 
     { 
      console.log(data); 
     } 
    }); 

}); 

ИЛИ

Вы можете попробовать с этим jQuerylibrary

https://github.com/malsup/form

EDIT

public function store(Request $request) 
{ 
    if (User::where('phone_number', '=', Input::get('phone_number'))->exists()) { 
     return $this->respondBadRequest('Phone Number Exists'); 
    } 
    else 
    { 
     $user=User::create($request->all()); 

     if($request->hasFile('image')) { 
      $file = $request->file('image'); 

      //you also need to keep file extension as well 
      $name = $file->getClientOriginalName().'.'.$file->getClientOriginalExtension(); 

      //using array instead of object 
      $image['filePath'] = $name; 
      $file->move(public_path().'/uploads/', $name); 
      $user->image= public_path().'/uploads/', $name; 
      $user->save(); 
     } 
     return redirect('agents')->with('Success', 'Agent Added'); 
    } 
} 

Answer 2

попробовать что-то вроде этого:

$('#upload').on('click', function() { 
     var file_data = $('#pic').prop('files')[0]; 
     var form_data = new FormData(); 
     form_data.append('file', file_data); 

     $.ajax({ 
       url   : 'route_url', 
       dataType : 'text',   // what to expect back from the PHP script, if anything 
       cache  : false, 
       contentType : false, 
       processData : false, 
       data  : form_data,       
       type  : 'post', 
       success  : function(output){ 
        alert(output);    // display response from the PHP script, if any 
       } 
     }); 
    }); 

Answer 3

Просто я, или ваша <input type="file"> не имеют "имя" атрибут? Поэтому сервер не получает данные файла из сообщения?

EDIT:

После вставки записи в базу данных, вы затем обрабатывать загрузки файла - но вы никогда не обновит запись с именем файлов.

* Просто подтвердите, что файл был загружен.

Answer 4

атрибут имени не установлен для ввода типа файла. Может быть?