使用 Laravel 5.1 和 ajax 上传后重定向答案

【问题标题】：Redirecting after upload with Laravel 5.1 and ajax使用 Laravel 5.1 和 ajax 上传后重定向
【发布时间】：2016-02-16 02:35:10
【问题描述】：

我正在使用 laravel 几天，我正在尝试制作上传表单。当您上传文件时，用户不应该被重定向到任何页面，但它应该显示在同一页面上，例如：成功。所以这是表格：

            <form enctype="multipart/form-data" id="upload_form" role="form" method="POST" action="{{ URL::to('upload') }}" >
                <label>Upload</label>
                <input type="file" name="file" /><br/>
                <input class="upload_button" name="submit" type="submit" value="submit" />
                <input type="hidden" value="{{ csrf_token() }}" name="_token" />
            </form>

这是控制器

if(Input::hasFile('file')){
        $file = Input::file('file');
        $user = Auth::id();// !!!!вземи ID на потребителя и му го подай, за да бъде номер на главната му папка!!!!!!!!!!!!
        $file->move('uploads/'.$user, $file->getClientOriginalName());
        echo 'Success';

    }
    else {
        echo 'Please select a file first'; 
    }

JS：

$(document).ready(function(){
$(".upload_button").click(function(){
    $.ajax({
      url:'upload',
      data:new FormData($("#upload_form")[0]),
      dataType:"json",
      async:false,
      type:"post",
      processData: false,
      contentType: false,
      success:function(response){
        alert(response);
      }
    });
}); });

还有路线：

Route::post('upload', 'UploadController@upload');

我只是不想被重定向到 /upload 页面。我不知道该怎么做。你能帮忙吗

【问题讨论】：

也许你的表单是在点击upload_button 时提交的（因为它是submit 类型的输入），所以表单会尝试执行其action 属性中指定的操作？跨度>
当我将 action 属性留空时，它会给我一个错误MethodNotAllowedHttpException in RouteCollection.php in RouteCollection.php at RouteCollection->methodNotAllowed(array('GET', 'HEAD')) in RouteCollection.php at RouteCollection->getRouteForMethods(object(Request), array('GET', 'HEAD')) in RouteCollection.php at RouteCollection->match(object(Request)) in Router.php at Router->findRoute(object(Request)) in Router.php at Router->dispatchToRoute(object(Request)) in Router.php at Router->dispatch(object(Request)) in Kernel.php
查看 DoanTran 的回答。这个想法不将action 留空（这会使您的表单只是重新加载当前页面，就好像您已经写了action="./"），而是为了防止表单执行正常操作。一旦阻止了正常操作，就可以将其留空。
@ghybs 我不知道为什么，但它仍然将我重定向到该网址：/

标签： php jquery ajax laravel file-upload

【解决方案1】：

默认情况下，form 将在您单击类型 = submit 的 button 时将您重定向到操作的 url。但是您可以通过将event.preventDefault() 添加到您的js 脚本中来阻止此事件。

$(".upload_button").click(function(event){

    event.preventDefault();

    $.ajax({
      url:'upload',
      data:new FormData($("#upload_form")[0]),
      dataType:"json",
      async:false,
      type:"post",
      processData: false,
      contentType: false,
      success:function(response){
        alert(response);
      }
    });
});

完成！

【讨论】：

不幸的是，它仍然将我重定向到：localhost/bluedrive/drive/public/upload
在表单提交事件上附加事件而不是提交按钮点击怎么样？ jQuery("#upload_form").submit(function…) 其他都一样吗？它有什么改变吗？（当然，请确保保留event.preventDefault();）。
@ghybs jQuery("#upload_form").submit(function() { event.preventDefault(); $.ajax({ url:'upload', data:new FormData($("#upload_form")[0]), dataType:"json", async:false, type:"post", processData: false, contentType: false, success:function(response){ alert(response); } }); }); 我试过了，但它再次重定向我
错字或缺少event 参数？ jQuery("#upload_form").submit(function(event)…
@ghybs 哦，它仍然会重定向我...：/我想我应该放弃