Question

我目前正在开发一个MVC应用程序，我使用了大量的jQuery和html表单。然而，最近我注意到这些似乎有点矛盾......

例如，我必须阻止表单默认提交来处理我的AJAX调用，否则服务器会被调用两次，这导致我质疑使用AJAX提交表单的想法。将$.ajax来电挂钩到<input type="button" />而不是<input type="submit" />会不会更好？

那么，拥有一个通过ajax提交的表单是否自相矛盾？

Answer 1

您将ajax调用放在提交按钮上的原因是，如果用户禁用了javascript，则会有自然的回退。您应该让后端逻辑检测请求是ajax请求还是直接提交，并且如果是ajax则能够发回数据，或者如果没有，则以“旧学校”的方式处理请求。

编辑：对于上下文。

<form action="/processForm.php" method="POST">
   <input type="submit" value="submit" />
</form>

然后你的jQuery看起来像这样

$('form').bind('submit', function(e){
    e.preventDefault();
    //do your stuff
});

如果用户已禁用javascript，则表单将像正常一样提交到/processForm.php。

您可以使用以下php检测表单是否通过ajax发送（我不知道您使用的是什么，但这是我所拥有的）。

if(!empty($_SERVER['HTTP_X_REQUESTED_WITH']) && strtolower($_SERVER['HTTP_X_REQUESTED_WITH']) == 'xmlhttprequest') {
  /* handle ajax here */
}else{
  /* handle normal submit here */
}

Answer 2

我不会说这是“矛盾的”。在通过ajax提交表单时，当然没有必要使用<form>元素，但您仍然可能希望将其用于语义目的。

是的，我只使用<input type="button" />而不是type="submit"，因为您想要的方式必须阻止默认表单提交。

Answer 3

我不这么认为。

当用户没有启用javascript时，您可以将其作为后备，以便将表单提交给服务器，用户仍然可以使用您的网页。

为此，你的后端需要知道它是否是一个ajax调用。我看到你正在使用jQuery，jQuery ajax发送标题x_request_with: xmlhttprequest，如果你在后端使用PHP，你可以在$_SERVER['http_x_request_with']中捕获它。

Answer 4

这取决于你想做什么。一般来说，我尝试使用，然后处理使用$ .ajax（）调用...但有时候不能使用asp.net mvc。例如，如果您正在上传文件，那么asp.net验证会扼杀。为了解决这个问题，我使用ajaxForm插件并使用它来包装标准表单。

提交带有$ .ajax的表单是否自相矛盾？

4 个答案: