【问题标题】:form submission with image upload using jquery ajax in laravel5在 laravel5 中使用 jquery ajax 上传图片的表单提交
【发布时间】:2016-03-18 21:59:58
【问题描述】:

我正在尝试使用 jquery ajax 提交带有图片上传的表单,但每次我选择一张图片并点击提交按钮时都会显示 alert($(this).serialize()) -

_token=TCWpR3n9Uf2FpKMXi639Dcvzhc7t4fVDWDopjZ8V .

这是我的表格 -

{!! Form::open(['action'=>'ImageController@store', 'name'=>'form1', 'id'=>'formId1', 'files'=>true]) !!}

<div class="form-group">
{!! Form::file('image') !!}                         
</div>
<div class="form-group">
{!! Form::submit('Upload', array( 'class'=>'btn btn-danger', 'name'=>'image_form_submit'  )) !!}                        
</div>
{!! Form::close() !!}

这里是js-

<script src="http://ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js"></script>

<script type="text/javascript">
    $(document).ready(function() {
        $("form").submit(function(e){ //
           e.preventDefault();


        alert($(this).serialize()); //always alerts the tocken- _token=TCWpR3n9Uf2FpKMXi639Dcvzhc7t4fVDWDopjZ8V 
        $.ajax({

            type:"POST",
            url: $(this).attr('action'),
            data: $(this).serialize(),
            dataType: 'json',
            success: function(data){
                console.log(data);
            },
            error: function(data){

            }
        })
            return false;
        });
    });
</script>

我想获取表单的序列化数据并通过 ajax 发布到我的控制器。 为什么 alert 总是显示令牌?

【问题讨论】:

  • 那么表单序列化应该得到什么数据?
  • 在您的代码中,它们不是表单元素,而是标记。如果你想上传 img 然后stackoverflow.com/questions/19447435/… 这应该是代码。

标签: php jquery ajax laravel


【解决方案1】:

如果 ajax 图片上传“$(this).serialize()”不起作用。

你必须传递 (data:formData,) 如下 -

 $.ajax({
        type:"POST",
        url: $(this).attr('action'),
        data:formData,
        cache:false,
        contentType: false,
        processData: false,
        success: function(data){
            console.log(data);
        },
        error: function(data){

        }
    })

【讨论】:

  • 是的,这行得通!但是如何在 laravel 控制器中检索 formData 的值?
  • 这将传递与 serialize() 传递相同的值,您可以使用 Input::all(); 方法查看输出
猜你喜欢
  • 2013-06-22
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2015-01-03
  • 2020-08-03
  • 1970-01-01
  • 2017-03-03
  • 2013-07-04
相关资源
最近更新 更多