如何使用jQuery和Validate插件调用表单提交函数？

我有一个上传表单，应该在文件上传时显示进度条。该表单使用jQuery Validate插件来限制文件类型。如何使用jQuery和Validate插件调用表单提交函数？

使用我当前的代码，在提交按钮被按下后即时显示进度栏，即使没有选择文件或文件类型不匹配。

任何想法为什么会发生这种情况？

$(document).ready(function() { 

    $('#document_upload').validate({ 

     rules: { 
      uploaded_file: { 
       required: true, 
       accept: "pdf|jpg|gif|png" 
      } 
     }, 
     errorPlacement: function(error, element) { 
      return true; 
     } 
    }); 

    $('#document_upload').submit(function() { 

     $('#upload_progress').show(); 

    }); 

})

来源

2011-12-17 Michael

你确定你应该对错误返回true吗？试试假。 – Hidde 2011-12-18 00:04:09

@Hidde，这不相关，那只是'errorPlacement' – Richard 2011-12-18 00:12:40

您在提交时是否收到正确的错误消息？我认为是这样，因为进度条正在显示，因此表单不会发送。

如何上传文件？它只是一个标准的<input type="file">？

这将始终显示在提交上传，所以你需要添加一些检查

$('#document_upload').submit(function() { 
    $('#upload_progress').show(); 
});

什么你可以尝试补充的是：

if($("#document_upload input[name=uploaded_file]").length >= 1){ 
    $('#upload_progress').show(); 
}

你能建立一个jsfiddle.net上的例子？

来源

2011-12-18 00:09:55 Richard

感谢您的帮助！这里是一个例子：http://jsfiddle.net/Bzayt/ – Michael 2011-12-18 00:19:41

我其实不太清楚这个问题的最佳解决方案是什么，但看看这个：http://jsfiddle.net/Bzayt/1 /。这基本上检查在显示进度之前是否选择了文件。你可以为'select'做同样的事情。我必须警告你，你不能期待漂亮的东西，因为页面会重定向。对于一个漂亮的上传者（有进展），你可以使用一个单独的工具，如http://valums.com/ajax-upload/或http://www.plupload.com/ – Richard 2011-12-18 00:32:53

这工作......谢谢！ :) – Michael 2011-12-18 00:36:52

如何使用jQuery和Validate插件调用表单提交函数？

回答

相关问题