使用jQuery在表单中仅序列化type = file

时间:2014-11-23 15:14:53

标签: javascript jquery

我在表单中有一堆控件,其中包含几个input type ='file'框。我想验证所有文件输入并确保选中文件。由于其他一些问题,我不能使用'required'属性。

我虽然序列化了所有文件框的数据并转换为数组,然后验证了数组。如果任何文件框没有值,我可以指示用户选择文件。我试图把代码放在下面,它返回空。

var dataString = $("#adminForm").find('input[type="file"]').serialize();

有人可以建议如何仅序列化文件框

更新1

通过查看答案我理解序列化不是验证表单的正确方法。我为每个文件框添加了一个单独的类'filebox',并且能够进行如下验证。

$('.filebox').each(function(i, obj) {
  if($('#'+obj.id).val() == 0) {
    /*raise error*/
    return;
  }
});

2 个答案:

答案 0 :(得分:0)

.serialize()会跳过未命名的输入。在输入中添加name属性以包含它们,或者删除以排除。

答案 1 :(得分:0)

jQuery.serialize()未序列化文件输入:http://api.jquery.com/serialize/#entry-longdesc

您可以使用FormData对象。

$('#test').submit(function(e) {        
    e.preventDefault();
    var $copy = $(this).clone();
    // remove everything except file inputs
    $copy.find('select, input:not([type=file])').remove();
    var data = new FormData($copy.get(0));
    $.ajax({
        type: 'POST',
        url: 'upload.php', 
        data: data,
        //Options to tell jQuery not to process data or worry about content-type.
        cache: false,
        contentType: false,
        processData: false
    }).always(function(xhr, data) { console.log(data) });
});

在这个小提琴中观察请求:http://jsfiddle.net/zka9k8Lf/