0

我正在使用ASP.NET MVC4和。jQuery ValidatejQuery Validate unobtrusive

我的表单上有各种元素,但我只需要验证一个元素。其他元素不需要验证。基本上发生的事情是我有一个接受数字的文本框和一个按钮(提交表单),该按钮接受此文本框中的数字并进行远程调用以检查该数字是否存在,如果不存在则它必须显示错误信息。

我的观点代码:

<td class="edit-label">Change Control ID/Incident Number: <span class="required">**</span></td>
<td>
     @Html.TextBoxFor(x => x.ChangeIncidentNumber)
     <button id="verifyButton" type="button">Verify</button>
     @Html.ValidationMessageFor(x => x.ChangeIncidentNumber)
</td>

我的视图模型:

public class SearchServerViewModel
{
     // Partial view model

     public string ChangeIncidentNumber { get; set; }
}

我的文本框的 HTML 输出:

<td class="edit-label">Change Control ID/Incident Number: <span class="required">**</span></td>
<td>
     <input data-val="true" data-val-required="Required" id="ChangeIncidentNumber" name="ChangeIncidentNumber" type="text" value="792952" />
     <button id="verifyButton" type="button">Verify</button>
     <span class="field-validation-valid" data-valmsg-for="ChangeIncidentNumber" data-valmsg-replace="true"></span>
</td>

我的 jQuery 代码:

<script src="/Assets/JavaScripts/jquery-validate/jquery.validate.min.js"></script>
<script src="/Assets/JavaScripts/jquery-validate/jquery.validate.unobtrusive.min.js"></script>

<script>

     $(document).ready(function () {
          $("#ChangeIncidentNumber").validate({
               rules: {
                    ChangeIncidentNumber: {
                         required: true,
                         remote: '/Server/ValidateChangeIncidentNumber'
                    }
                },
                messages: {
                     ChangeIncidentNumber: {
                          required: "Required",
                          remote: "custom message:"
                     }
                }
          });

          $('#verifyButton').click(function () {
               var isValid = $('#ChangeIncidentNumber').valid();
          });
     });

</script>

我的操作方法:

public ActionResult ValidateChangeIncidentNumber(string ChangeIncidentNumber)
{
     // Do whatever needs to be done

     return Json("Test error text", JsonRequestBehavior.AllowGet);
}

在我的 web.config 中:

<add key="ClientValidationEnabled" value="true" />
<add key="UnobtrusiveJavaScriptEnabled" value="true" />

必需的部分有效,如果文本框为空,它会显示必需的消息。但是,如果有一个值,它就不会达到我的操作方法。不知道为什么?

4

2 回答 2

0

我的表单上有各种元素,但我只需要验证一个元素。其他元素不需要验证

然后仅为那些需要验证的字段设置必需或自定义属性。

HTML

<div id="formContainer" 
     data-url="@Url.Action("Action Name", "Controller Name", 
     new { area = "Area Name" })"></div>

<input id="BTN" type="button" value="Button" />

JQuery(下面的请求可以有get /post /getJSON。所以相应地改变它)

$('#BTN').click(function () {
    var $formContainer = $('#formContainer');
    var url = $formContainer.attr('data-url');
    $formContainer.load(url, function () {
        var $form = $('#myForm');
        $.validator.unobtrusive.parse($form);
        $form.submit(function () { //Here modification can be buton click                
            var $form = $(this);
            if ($form.valid()) {
                $.post(this.action, $(this).serialize(), function (data) {
                    $form.html(data);
                    $form.removeData('validator');
                    $form.removeData('unobtrusiveValidation');
                    $.validator.unobtrusive.parse($form);
                });
            }
            return false;
        });
    });
    return false;
});
于 2013-04-10T09:11:00.480 回答
0

在包含不显眼的插件脚本后调用 validate() 什么都不做,它只是返回由不显眼的插件创建的验证器实例。所需规则起作用的唯一原因是您在ChangeIncidentNumber字段上有一个 [Required] 属性。您可以通过呈现的文本框中的data-val-required="Required"看到这一点。

是否有 [Remote] 数据注释属性?我认为您需要对此进行调查。

于 2013-04-10T09:04:27.167 回答