1

我有一个剑道窗口,用户可以在其中输入名称。我正在使用远程验证来检查数据库中是否存在名称,并且仅在名称不存在时才提交表单。

我正在使用 jQuery 验证插件 v1.10.0。在普通视图中使用相同的远程验证操作没有任何问题。但是,在剑道窗口(部分视图)中,我遇到了以下问题:

1) 远程验证不会在表单提交时触发。它仅适用于按键事件和焦点输出。这在 IE (IE 8) 和 Chrome 中都会发生。

2) 在 IE (IE 8) 中,验证仅在按键启动时触发,并且仅在我在名称后点击空格时触发。因此,假设名称“John”无效。当我输入“John”时,我不会收到验证消息,但是当我在“John”之后点击空格时。此外,当我使用退格键时,远程验证不会触发。

关于是什么导致这个问题的任何想法?

视图模型:

public class MyViewModel
{
    public int ID { get; set; }
    [Required]
    [Remote("IsNameAvailable", "MyController", ErrorMessage = "The Name already exists.")]
    public string Name { get; set; }
}

控制器:

public ActionResult IsNameAvailable(Portfolio portfolio)
{
    var exists = // code to check if Name exists;

    return Json(!exists, JsonRequestBehavior.AllowGet);
}

public ActionResult ShowDialog(int id)
{
    var viewModel = new MyViewModel { ID = id };

    return PartialView("_Dialog", viewModel);                    
}

局部视图(在剑道窗口中渲染):

@using (Html.BeginForm())
{
    @Html.AntiForgeryToken()

    @Html.HiddenFor(model => model.ID)

    <div class="editor-label">
        @Html.LabelFor(model => model.Name)
    </div>
    <div class="editor-field">
        @Html.TextBoxFor(model => model.Name)            
    </div>
    <div class="editor-field">
        @Html.ValidationMessageFor(model => model.Name)        
    </div>

    <p>
        <input type="submit" value="Save" />
    </p>
}

主视图:

@(Html.Kendo().Window().Name("dialog")
    .Title("Dialog")
    .Visible(false)
    .Modal(true)
    .Draggable(true)
    .Width(300)
    .Events(events => events.Refresh("onRefresh"))
)

<script type="text/javascript">
    function showDialog(id) {
        var wnd = $("#dialog").data("kendoWindow");
        var url = '@Url.Action("ShowDialog", "MyController")'; 

        wnd.refresh(
        {
            url: url,
            data: { id: id}
        });

        wnd.center().open();
    }

    function onRefresh(e) {
        $.validator.unobtrusive.parse($("#dialog"));
        $.validator.setDefaults({
            onkeyup: true,
            onfocusout: true,
            onsubmit: true
        });

        var form = $("#dialog").find('form');
        form.submit(function () {
            if (form.validate().valid()) {
                var wnd = $("#dialog").data("kendoWindow");
                wnd.close();
            }
        });
    }
</script>
4

1 回答 1

1

您的代码正在破坏插件...

$.validator.setDefaults({
    onkeyup: true,
    onfocusout: true,
    onsubmit: true
});

trueonkeyup不是、onfocusoutonsubmit选项的有效值。这些只能设置false为禁用或覆盖功能。如果您想激活这些选项,您只需将它们排除在外……这些已经是默认设置。

请参阅文档...

onkeyup
类型:Boolean 或 Function()
验证 keyup 上的元素。只要该字段未被标记为无效,就不会发生任何事情。否则,将检查每个按键事件的所有规则。设置false为禁用。设置为 Function 以自行决定何时运行验证。 布尔值true不是有效值。

onfocusout
类型:Boolean 或 Function(
) 在模糊时验证元素(复选框/单选按钮除外)。如果未输入任何内容,则跳过所有规则,除非该字段已被标记为无效。设置为 Function 以自行决定何时运行验证。布尔值true不是有效值。

onsubmit (默认: true)
类型: Boolean
在提交时验证表单。设置为false仅使用其他事件进行验证。设置为 Function 以自行决定何时运行验证。布尔值true不是有效值。

于 2013-11-14T22:08:25.450 回答