Laravel Image upload Ajax Way

Laravel image Upload

Background Carousel Map Upload $ ("#img-upload"). On (' Submit ', function (e) {e.preventdefault (); var formData = new FormData ($ (". Banner-upload ")); $.ajax ({headers: {        ' X-csrf-token ': $ (' meta[name= ' Csrf-token"] '). attr (' content ')    },    type: ' POST ',    URL: '/admin/banner/create ',  data:formdata,  processdata:false,  //mimetype: "Multipart/form-data ",  Contenttype:false,            cache:false,  success:function (data) {    console.log (data);    if (data.status) {    console.log (data.message);    }    },    error:function (err) {    Console.log (err );    }});  

　　

Form form Mode

<form class= "Form-horizontal" action= "{{URL ('/admin/banner/create ')}}" method= "POST" enctype= "multipart/ Form-data "class=" Banner-upload "> {{Csrf_field ()}} <div class=" Box-body "> <div class=" for M-group "> <label for=" inputEmail3 "class=" Col-sm-2 Control-label "> Topics </label> <div clas          s= "col-sm-10" > <input type= "text" class= "Form-control" value= "" name= "Theme" placeholder= "Set Carousel Theme" > </div> </div> <div class= "Form-group" > <label for= "InputPassword3" class = "Col-sm-2 Control-label" > Status </label> <div class= "col-sm-10" > <input type= "Radio" Val Ue= "1" name= "status" > Enable <input type= "Radio" value= "0" name= "status" > Disable </div> &L t;/div> <div class= "Form-group" > <label for= "inputPassword3" class= "Col-sm-2 Control-label" ; Upload pictures </label> <divclass= "col-sm-10" > <input type= "file" name= "photo" value= "" placeholder= "" > <div class= " Img-wrap ">  </div> </div> </div> &l T;/div> <!--/.box-body-<div class= "Box-footer clearfix" > <button type= "Submit" CLA ss= "btn btn-info pull-right" id= "Img-upload" > Submit </button> </div> </form>

Background functions

Public Function bannercreate (Request $request) {$file = $request->file (' photo ');//Get Picture $theme = $requ        est->theme;//Theme $status = $request->status;//status $allowed _extensions = ["png", "JPG", "gif"]; if ($file->getclientoriginalextension () &&!in_array ($file->getclientoriginalextension (), $allowed _  Extensions) {return response ()->json ([' status ' = = False, ' message ' = = ' Upload png only | JPG |        Images in GIF format ']);        } if ($request->hasfile (' photo ')) {} $destinationPath = ' storage/uploads/';        $extension = $file->getclientoriginalextension (); $fileName = Str_random (10). '. '.        $extension;        $file->move ($destinationPath, $fileName); Return Response ()->json ([' status ' = = True, ' pic ' = Asset ($destination             Path. $fileName), ' ismake ' = $status,   ' Message ' + ' added success!    ‘ ] ); }

　　$destinationPath= ‘storage/uploads/‘;    后面必须要有 / 负责上传后路径访问有问题

<form class= "Form-horizontal" action= "{{URL ('/admin/banner/create ')}}" method= "POST" enctype= "multipart/ Form-data "class=" Banner-upload ">

{{Csrf_field ()}}

<div class= "Box-body" >
<div class= "Form-group" >
<label for= "InputEmail3" class= "Col-sm-2 Control-label" > Themes </label>
<div class= "Col-sm-10" >
<input type= "text" class= "Form-control" value= "name=" theme "placeholder=" Set Carousel Theme ">
</div>
</div>

<div class= "Form-group" >
<label for= "InputPassword3" class= "Col-sm-2 Control-label" > Status </label>
<div class= "Col-sm-10" >
<input type= "Radio" value= "1" name= "status" > Enabled
<input type= "Radio" value= "0" name= "status" > Disabled
</div>
</div>

<div class= "Form-group" >
<label for= "InputPassword3" class= "col-sm-2 Control-label" > Uploading images </label>
<div class= "Col-sm-10" >
<input type= "file" name= "photo" value= "placeholder=" ">

<div class= "Img-wrap" >

</div>
</div>
</div>

</div>
<!--/.box-body--
<div class= "Box-footer clearfix" >
<button type= "Submit" class= "btn btn-info pull-right" id= "Img-upload" > Submit </button>
</div>
</form>

　　

Laravel Image upload Ajax Way