Question

我在下拉字段中使用JQuery远程验证来检查所选字段是否已存在。整体代码工作正常，并且正确验证。但问题是在onChange事件后发送ajax调用的远程验证，意味着它在点击页面上的任何位置后显示唯一的密钥验证错误。

我想在用户点击下拉选项后验证它。我试过onclick:true，但它不起作用。请检查我的代码：

$("#myform").validate({
  //   onclick:true,
  //   onkeyup:true,
  rules: {
    "customer[customer_personal_details_id]": {
        required: true,
        remote: {
            url: "/validation/check",
            type: "post",
            data: {
                columnVal: function () {
                    return $("#customer_customer_personal_details_id").val();
                }
            }
        }
    }
  },
  messages: {
    "customer[customer_personal_details_id]": {
         required: "Please Select Account Holder", 
        remote: "One active account already exists. Duplicate accounts are not allowed."}
  }
});

感谢。任何帮助将不胜感激。

Answer 1

select的更改事件更好地指示何时验证，但没有onchange选项。以下应该有效：

$(function() {
    $('select').on('change', function() {
        $(this).trigger('focusout');
    })
    .on('focusout',function(e) {
        e.preventDefault();
    });
});

触发focusout应触发对select元素触发的验证，除非onfocusout选项设置为false。您可能希望阻止focusout的默认行为，以便它不会两次触发remote验证。

在下面的演示中，您将看到只要在select元素中选择新值，就会尝试进行ajax调用 - 请参阅开发工具的网络选项卡 - 并在{ {1}}没有请求尝试。

JSFIDDLE DEMO

onfocusout 类型：Boolean或Function（）验证元素（除外）复选框/单选按钮）上模糊。如果没有输入，则为所有规则被跳过，除非该字段已被标记为无效。

focusout

Answer 2

试试这个 - 假设你有＆lt; SELECT ID =＆＃34; DROPDOWN_ID＆＃34;＆gt;

$('#DROPDOWN_ID').on('click', function() { 
    $("#myform").validate();
});

Answer 3

我不使用：＆＃34; JQuery Remote Validation＆＃34;，但此代码可能会对您有所帮助：

JavaScript代码：

window . onload = function ()
{
    "use strict";
    document . querySelector ( "form#myform > select" ) . selectedIndex = -1;
}

function test ()
{
    "use strict";
    if ( typeof customOption === "undefined" ) { alert ( "FATAL SYSTEM ERROR !" ); return; }
    alert ( "Valid option selected ! Congratulations !\nYour selected value is: \"" + customOption + "\"" );
}

和HTML5代码：

<select onchange="customOption = this . options [ this . selectedIndex ] . value;">
<!-- ( ... ) -->
</select>

这只是示范。您可以调用您的函数，这样您就可以：＆＃34;一旦用户点击下拉选项＆＃34;就可以验证它。通过更改HTML5代码（选择元素onchange属性）。

工作小提琴：JSFiddle

ondown远程验证下拉字段

3 个答案: