6

我正在尝试在提交表单之前对表单的某些字段进行一些额外的检查和格式化。因此我使用了 bassistance jquery 验证插件。它运行良好，因为它可以正确显示所有强制性错误消息，但是一旦我提供了必要的值，表单就会简单地提交。在这一点上，我什至不确定是否submitHandler被触发。有任何想法吗？

表格html：http: //jsfiddle.net/7PAZU/

$(function() {
    $("#commentForm").validate({
        rules: {
            bill_first_name: {
                required: true
            },
            bill_last_name: {
                required: true
            },
            email: {
                required: true,
                email: true
            },
            Phone: {
                required: true,
                number: true
            },

            bill_address_one: {
                required: true
            },
            bill_city: {
                required: true
            },
            bill_state_or_province: {
                required: true
            },
            charge_total: {
                required: true,
                float: true
            },
        },
        messages: {
            bill_first_name: {
                required: "Please put in First Name"
            },
            bill_last_name: {
                required: "Please put in last Name"
            },
            email: {
                required: "Please enter a valid email"
            },
            phone: {
                required: "Please enter a valid Phone Number"

            },

            bill_address_one: {
                required: "Please put in Address"
            },
            bill_city: {
                required: "Please put in  City"
            },
            bill_state_or_province: {
                required: "Please put in state"
            },
            charge_total: {
                required: "Please put Amount In Whole number such as 10.00",
                number: "Please put in Amount In Whole number such as 10.00"
            },
        },
        submitHandler: function(frm) {
            $("#charge_total").val(parseFloat($("#charge_total").val()).toFixed(2));
            alert("Dukhche Na");
            return false;
        }
    });
})​
4

2 回答 2

8

您的代码失败，因为您使用的验证规则不存在。

charge_total: {
                required: true,
                float: true // there's no validator named `float`
            } // Comma removed here

float但是该插件中没有命名验证器。删除它，它会正常工作。如果需要，您可以创建自定义float验证器。

工作小提琴

在此处查看可用规则列表http://docs.jquery.com/Plugins/Validation#Validator

我是怎么找到这个的？

我检查了控制台，发现这个错误被抛出

Uncaught TypeError: Cannot call method 'call' of undefined

从插件源文件中的以下行

var result = $.validator.methods[method]
      .call( this, element.value.replace(/\r/g, ""), element, rule.parameters );

含义$.validator.methods[method]未定义，这证明您正在使用不存在的验证器。

所以我检查了可用的验证方法列表，your rules发现您正在使用float不可用的规则。

所以 JS 抛出这个错误并停止执行，所以你submit handler没有被调用并且表单被提交（这是默认行为，除非你阻止使用JS）。

于 2012-06-22T08:46:16.417 回答
2

IE 对额外的逗号特别挑剔......首先删除它们：

$(function() {
    $("#commentForm").validate({
        rules: {
            bill_first_name: {
                required: true
            },
            bill_last_name: {
                required: true
            },
            email: {
                required: true,
                email: true
            },
            Phone: {
                required: true,
                number: true
            },

            bill_address_one: {
                required: true
            },
            bill_city: {
                required: true
            },
            bill_state_or_province: {
                required: true
            },
            charge_total: {
                required: true,
                float: true
            } // Comma removed here
        },
        messages: {
            bill_first_name: {
                required: "Please put in First Name"
            },
            bill_last_name: {
                required: "Please put in last Name"
            },
            email: {
                required: "Please enter a valid email"
            },
            phone: {
                required: "Please enter a valid Phone Number"

            },

            bill_address_one: {
                required: "Please put in Address"
            },
            bill_city: {
                required: "Please put in  City"
            },
            bill_state_or_province: {
                required: "Please put in state"
            },
            charge_total: {
                required: "Please put Amount In Whole number such as 10.00",
                number: "Please put in Amount In Whole number such as 10.00"
            } // Comma removed here
        },
        submitHandler: function(frm) {
            $("#charge_total").val(parseFloat($("#charge_total").val()).toFixed(2));
            alert("Dukhche Na");
            return false;
        }
    });
})​
于 2012-06-22T08:22:50.223 回答