Question

我必须在jquery中进行自定义验证，我有一个名称文本框和提交按钮。我必须验证唯一名称。我在下面的现有名称数组是我创建的规则。

var  tempArray = ['john','rob','smith'];

$.validator.addMethod('uniqueName', function (value, element) {
    return $.inArray(value, tempArray) > -1;
}, "Name already exists, Please Enter a Unqiue Name.");

以下是表格

<form id='frmValidate'>
<input type='text' name='username'>
<input type='button' value='submit'>

</form>

Jquery的

$(document).ready(function () {

$('#frmValidate').validate({ // initialize the plugin
    rules: {
        username: {
           required : true
        }
    },
    submitHandler: function (form) { // for demo
        alert('valid form submitted'); // for demo
        return false; // for demo
    }
});

}）;

我不确定如何将规则应用于我的表单。任何帮助，将不胜感激。抱歉，如果这是一个愚蠢的问题..

Answer 1

您可以在printf submitHandler()中以username作为参数发送ajax请求。此ajax请求命中服务器上的URL，该服务器可以验证是否已使用该用户名。如果已经采取，请显示相应的消息，否则提交表格。

$('#frmValidate').validate({ // initialize the plugin
    rules: {
        username: {
           required : true
        }
    },
    submitHandler: function (form) { // for demo
        alert('valid form submitted. Now checking for unique username'); // for demo
       var username = $("#username").val();
       $("#pageloader").fadeIn();
       $.ajax({
         url: '/admin/ajax_check_username_availability',
         data: {'username': username},
         dataType: 'json',
         success: function(response)}{
            if( response.status == 1 )
            {
              form.submit();
            }
            else
            {
              $("#pageloader").fadeOut();
              alert("'" + username+ "' is already taken. Please try something else.");
            }
         }
    }
});

Answer 2

I found it thank you. 

    var  tempArray = ['john','rob','smith'];

    $.validator.addMethod('uniqueName', function (value, element) {
        return !$.inArray(value, tempArray) > -1;
     }, "Name already exists, Please Enter a Unqiue Name.");


     $(document).ready(function () {

    $('#frmValidate').validate({ // initialize the plugin
    rules: {
        username: {
           required : true,
           uniqueName : true
        }
    },
    submitHandler: function (form) { // for demo
        alert('valid form submitted'); // for demo
        return false; // for demo
    }
    });

自定义验证Jquery

2 个答案: