Question

我想提交一个没有重定向/刷新页面但使用jquery.validate的表单。我尝试做类似

的事情

$("#myForm").validate({
    errorLabelContainer: "#errorContainer",
    wrapper: "div",
    submitHandler: function (form) {
        form.submit(function () {
            return false;
        });
        $('#form-container').fadeOut(function () {
            $('#afterSubmit').fadeIn()
        });
        return false;
    }
});

我尝试将form.submit更改为

form.ajaxSubmit(function () { return false; });

或者

form.submit(function () {
    var options = {};
    $(this).ajaxSubmit(options);
    return false;
});

以及许多其他变体。

当我执行以下代码时，表单不会被提交。

submitHandler: function (form) {
        return false;
}

在验证后，我应该怎么做才能提交表单？

Answer 1

这是你应该怎么做的。请在此处找到工作示例http://jsfiddle.net/rQu9W/
并确保在我的jsFiddle示例中添加jquery.min.js，jquery.validate.js，jquery.form.js

$(function(){
  $("#myForm").validate({

    submitHandler: function(form) {
      $(form).ajaxSubmit({
        clearForm: true,//To clear form after ajax submitting
        success: function(){alert('done');}
      });
      return false;
    },

    invalidHandler: function(form) {
      alert('error');
    }

  });  
});

Answer 2

以下是我用来进行ajax调用的内容：

var sendData = "action=do_action";
sendData += "&value=" + $("input.value").val();

$.ajax({
    url: "post.php",//Page to send our data to
    global: false,
    type: "POST",
    data: sendData,
    dataType: "html",
    async:false,
    success: function(data){
        //We could return JSON and then just parse that, but I usually just return values like this

        //create jquery object from the response html
        var $response=$(data);

        var results = $response.filter('div.results').text();//Or .html() if we want to return HTML to show                     

        if (results == "true") {
            alert("it works");
        }else{
            var reason= $response.filter('div.reason').text();
            alert(reason);
        }
    }
});

PHP看起来像：

<?php
    $action = $_POST['action'];

    if ($action == "do_action") {
        if (true) {
            echo "<div class='result'>true</div>";
        }else{
            echo "<div class='result'>false</div>";
            echo "<div class='reason'>Houston, we have a problem!</div>";
        }
    }
?>

Answer 3

如果您需要在不重新加载页面的情况下提交表单，则必须使用ajax提交。是的，为此您需要将form.submit更改为form.ajaxSubmit。但除了验证插件外，还需要包含jQuery Form Plugin。你可以在这里找到关于jQuery Form Plugin的ajaxSubmit函数的更多细节。 http://jquery.malsup.com/form/#api

提交时不需要重定向

3 个答案: