ASP.NET MVC 3中的手动远程验证

时间:2012-03-25 21:55:34

标签: jquery asp.net-mvc-3 jquery-ui

在我的其中一个场景中,需要进行远程验证以确保不再输入字段。

这可以使用ASP.NET MVC 3远程验证来完成,但是,这在用于创建记录的形式中非常完美,而不是用于编辑一条记录,否则,它总会给我一个记录已存在的错误。

所以我需要这个编辑表单是发送Id / Name列来验证另一个具有相同名称的记录的存在,换句话说,我是否有任何其他记录'除了具有ID的那个'具有同名“姓名”?

服务器端逻辑工作正常,问题在于jQuery在jQuery UI对话框中显示错误。我遵循jquery.validate.unobstrusive.js使用的相同方式。

在View本身上,我运行以下内容:


    $(document).ready(function () {
        RemoteValidate({
            formName: "CultureEditForm",
            inputName: "Name",
            inputId: "CultureId",
            url: "/Culture/CultureEditNameExists",
            dupTmpl: "dupTmpl"
        });
    });
    

RemoteValidate()函数如下:

RemoteValidate = function (options) {    
    $('#' + options.formName + ' input[name=\"' + options.inputName + '\"]').live('blur', function () {
        var params = {
            name: $('#' + options.formName + ' input[name=\"' + options.inputName + '\"]').val(),
            id: $('#' + options.formName + ' input[id$=\"' + options.inputId + '\"]').val()
        }

        $.ajax({
            url: options.url,
            type: "POST",
            data: JSON.stringify(params, null, 2),
            contentType: "application/json; charset=utf8",
            dataType: "json",
            success: function (response) {
                if (!response) {
                    _onError(options.formName, options.inputName);
                }
                else {
                    _onSuccess(options.formName, options.inputName);
                }
            }
        });        
    });

    function _onError(formId, inputElement) {
        var container = $('#' + formId).find("[data-valmsg-for='" + inputElement + "']"),
            replace = $.parseJSON(container.attr("data-valmsg-replace")) !== false;

        container.removeClass("field-validation-valid").addClass("field-validation-error");

        if (replace) {
            container.empty();
            $('Name already exists').appendTo(container);
        }
    }

    function _onSuccess(formId, inputElement) {
        var container = $('#' + formId).find("[data-valmsg-for='" + inputElement + "']"),
            replace = $.parseJSON(container.attr("data-valmsg-replace"));

        if (container) {
            container.addClass("field-validation-valid").removeClass("field-validation-error");

            if (replace) {
                container.empty();
            }
        }
    }
}

只要对话窗口打开,我就会继续尝试值,并且它会显示“显示/隐藏”错误信息。

但是,当我关闭对话框,然后单击另一个要编辑的记录时,它会再次使用新值打开对话框,但是,当它尝试向服务器发送请求以检查数据库中是否存在记录时, IT'S发送以前编辑的数据

我在上面用粗线表示准备要发送给服务器的对象。

任何帮助?

由于

1 个答案:

答案 0 :(得分:0)

处理动态视图或任何其他HTML内容始终被视为特殊情况且敏感。我不得不改变我访问事件处理程序中的数据字段的方式,以使其工作。

看起来,jQuery总是在读取加载的第一个HTML视图的旧值。为了使其动态化并读取与正在显示的视图相关的数据,我必须编写以下内容:

        $('.rm-field').live('blur', function () {
        if ($(this).next()) {
            var params = {
                name: $(this).val(), id: $('input:last-child', $(this).parents('form')).val()
            }

            var element = $(this);
            var container = $(this).next();
            var url = element.parents('form').attr('data-rm-url');

            $.ajax({
                url: url,
                type: "POST",
                data: JSON.stringify(params, null, 2),
                contentType: "application/json; charset=utf8",
                dataType: "json",
                success: function (response) {
                    if (!response) {
                        if (container) {
                            container.removeClass("field-validation-valid").addClass("field-validation-error");
                            container.empty();
                            $('Name already exists').appendTo(container);
                        }
                    }
                    else {
                        if (container) {
                            container.addClass("field-validation-valid").removeClass("field-validation-error");
                            container.empty();
                        }
                    }
                }
            });
        }
    });

我必须在每个输入字段中添加类.rm-field ,然后将模糊事件附加到其上,之后我才能获取值输入字段。

我还需要访问隐藏字段 cultureId ,但jQuery仍然访问第一个View HTML,所以这并不好。我所做的是使用 parents()导航选择器,到达表单然后抓住最后一个孩子,在我的情况下,隐藏字段持有ID正在编辑的记录。

之后,简单的DOM操作来添加/删除错误消息。

HTH, 此致