JQuery Validation Plugin：远程方法数据问题答案

【问题标题】：JQuery Validation Plugin: remote method data issueJQuery Validation Plugin：远程方法数据问题
【发布时间】：2010-07-03 08:07:27
【问题描述】：

我正在使用 jquery 验证控制远程方法来测试数据库中是否已经存在电子邮件地址。第一次验证触发时一切正常。但是，在后续验证中，传递给 Web 服务的数据是旧数据，而不是输入到文本框中的新数据。

例如在电子邮件文本框中输入电子邮件地址，验证触发，结果符合预期。更改了电子邮件地址，再次触发验证，但在检查 FireBug 时，ajax 数据是旧数据而不是新数据。

因此，无论文本框中的内容是什么，都会始终传递以下数据。 {'email':'test@test.com'}

例如这些是规则设置。

rules: {
        <%=txtGuestEmail.UniqueID%>: {
            email: true,
            remote: {
                type: 'POST',
                contentType: 'application/json; charset=utf-8',
                cache: false,
                async: false,
                url: 'ajaxCheckout1.asmx/IsEmailAvailable',
                // Use data filter to strip .d explained here http://encosia.com/2009/06/29/never-worry-about-asp-net-ajaxs-d-again/
                dataFilter: function(data) {
                    var msg = eval('(' + data + ')');
                    // If the response has a ".d" top-level property, return what's below that instead.
                    if (msg.hasOwnProperty('d'))
                        return msg.d;
                    else
                        return msg;
                },
                dataType: 'json',
                data: "{'email':'" + $('#ctl00_PageContent_txtGuestEmail').val() + "'}"
            }
        },

【问题讨论】：

标签： jquery plugins validation

【解决方案1】：

发生这种情况的原因是电子邮件字段的值在页面加载时被捕获，并且不再刷新。一种解决方案是将远程规则单独添加到该字段：

$('#myform').validate(
{
    ...
});

$('#ctl00_PageContent_txtGuestEmail').rules('add', {
    remote: function () {
        return {
            type: 'POST',
            contentType: 'application/json; charset=utf-8',
            url: 'ajaxCheckout1.asmx/IsEmailAvailable',
            dataFilter: function(data) {
                var msg = eval('(' + data + ')');
                if (msg.hasOwnProperty('d'))
                    return msg.d;
                else
                    return msg;
            },
            dataType: 'json',
            data: "{'email':'" + $('#ctl00_PageContent_txtGuestEmail').val() + "'}"
        };
    }
});

【讨论】：

谢谢 - 这解决了问题。不知道我会不会想过这样做！
@Darin Dimitrov：我遇到了同样的问题，但我想我做错了什么。我所有的验证码都在$(document).ready(function() 中，我从$('#myform').validate 中删除了remote 规则的代码，并按照您的建议将其隔离。但是，在 Firebug 中，我可以看到我的服务将不再被调用。你的sn-p完成了吗？这就像.rules('add' 被完全忽略了。（我已经更改了网址以匹配我之前使用的网址）

【解决方案2】：

这是经过少许清理的最终代码。

$('input[name=<%=txtGuestEmail.UniqueID%>]').rules('add', {
    remote: function () {
        return {
            type: 'POST',
            contentType: 'application/json; charset=utf-8',
            url: 'ajaxCheckout1.asmx/IsEmailAvailable',
            dataFilter: function(data) {
                var msg = eval('(' + data + ')');
                if (msg.hasOwnProperty('d'))
                    return msg.d;
                else
                    return msg;
            },
            dataType: 'json',
            data: "{'email':'" + $('input[name=<%=txtGuestEmail.UniqueID%>]').val() + "'}"
        };
    }
});

【讨论】：