通过 jquery submit() 提交表单后的 Laravel 文件验证;

Posted

技术标签:

【中文标题】通过 jquery submit() 提交表单后的 Laravel 文件验证;【英文标题】:Laravel file validation after submitting form via jquery submit(); 【发布时间】:2015-08-20 00:06:09 【问题描述】:

当我通过 jquery 提交表单后尝试验证图像文件时

$('#logo').submit(); 

我总是收到验证错误

The img field is required

这是我用来验证文件的验证

$input = array('img' => Input::file('img'));
$rules = array(
        'img' => 'required',
);
// Now pass the input and rules into the validator
$validator = Validator::make($input, $rules);

// check if the validator failed -----------------------
if ($validator->fails()) 
    // get the error messages from the validator
    $messages = $validator->messages();
    // redirect our user back to the form with the errors from the validator
    print_r($messages);

我无法确定脚本有什么问题, 帮助我克服这个问题。 提前致谢。

【问题讨论】:

响应 print_r($_FILE); [img] => 数组 ([name] => PlottShana_1.jpg [type] => [tmp_name] => [error] => 1 [size] => 0) 你能发布你的javascript吗? 【参考方案1】:

如果您提交的表单包含<input type="file">ajax/jquery,这几乎是不可能的,除非您使用Jquery file uploaddropzone.js 之类的东西。但是您仍然可以选择自己做,使用XMLHttpRequest。下面是一个例子:

var forms = document.querySelector('form#yourFormId');

   var request = new XMLHttpRequest();

   var formDatas = new FormData(forms);
   request.open('post','upload');
   //Here "upload" is your post route
   request.send(formDatas);

   request.onreadystatechange = function() 
    if (request.readyState === 4) 
      if (request.status === 200) 
       //The request was successful

     else

    //Request wasn't OK

那么你应该可以在你的控制器中调用你输入的文件名:

Input::get('inputFileName')

【讨论】:

【参考方案2】:

要使用 jQuery + ajax 向 Laravel 提交文件,我遵循以下方法:

示例表单:

<form class="form-horizontal" role="form" method="POST" id="imageUpload" action="some/backend/method" enctype="multipart/form-data">
    <div class="form-group">
        <div class="alert alert-danger" style="display: none;"></div>
        <label class="col-sm-3 control-label no-padding-right"> <i class="fa fa-asterisk light-red"></i> Image</label>
        <div class="col-sm-9">
            <input type="file" name="image" class="form-control" required/>
        </div>
    </div>
</form>

注意:为表单设置一个 ID。

一个示例 ajax 请求:

$.ajax(
    type: 'POST',
    data: new FormData($("#imageUpload")[0]),
    url: 'some/backend/method',
    processData: false,
    contentType: false
).done(function (result) 
    if ($.isEmptyObject(result.error)) 
        window.location.reload();
     else 
        var messages = '';
        for (var key in result.error) 
            if (result.error.hasOwnProperty(key)) 
                messages += result.error[key] + '<br />';
            
        
        $("#imageUpload .alert").html(messages).css('display', 'block');
    
, "json");

注意: processData: false & contentType: false 非常重要。

在后端(Laravel):

$validator = Validator::make(Input::all(), [
    'image' =>'required'
]);

if ($validator->fails()) 
    return Response::json(['error' => $validator->messages()]);
 else 
    return Response::json(['success' => true]);

【讨论】:

通过关注@ivankatodorova,我添加了 statusCode: 413: function(xhr) alert('413');

以上是关于通过 jquery submit() 提交表单后的 Laravel 文件验证;的主要内容,如果未能解决你的问题,请参考以下文章

JavaScript 学习-42.jQuery 提交表单 submit() 方法

jquery submit和ajax提交表单的区别

ajaxSubmit()提交表单

jquery submit()不能提交表单的解决方法

Ajax 提交之快速获取表单值

在代码中提交 mvc 表单时,jQuery on('submit'...) 方法不起作用