Question

我已经应用了jquery远程验证。成功的我已经在我的文本框中添加了一个图像。但是我希望在其他验证适用后删除该图像，因为我已经应用了多个验证。请建议。以下是我在电子邮件文本框中验证的代码。 Jquery的：

/*--Validations for registeration step-1 - starts here ---*/    
    var school_url = "/" + PROJECT_NAME + "registration/get-schools-list";
    var company_url = "/" + PROJECT_NAME + "registration/get-all-ref-companies";
    autoComplete( 'input[type=text]#college', school_url);
    autoComplete( 'input[type=text]#employed_company', company_url);

    $( "#registeration_step1" ).validate({
        rules: {
            first_name: {
                required: true,
                noSpace: true,
                alphaOnly:true,
                minlength: 3,
                maxlength: 30
            },
            last_name: {
                required: true,
                noSpace: true,
                alphaOnly:true,
                minlength: 3,
                maxlength: 30
            },
            email: {
                required: true,
                email: true,
                noSpace: true,
                remote: {
                    url: "/"+PROJECT_NAME+"index/check-email-exist",
                    type: "post",
                    beforeSend: function() {
                        $("div#tick-box-image").html("<img style = 'margin-top: 5px;' src = '"+IMAGE_PATH+"/loading_small_black_purple.gif'>");
                    },
                    complete: function(data) {
                        if(data.responseText == "true")
                        {
                            $("div#tick-box-image").html("<img src = '"+IMAGE_PATH+"/tick-white.png' alt='Ok' title='Ok'>");
                        }
                        else
                        {
                            $("div#tick-box-image").html("");                           
                        }
                    },
                    data: {
                            email: function() {
                                return $( "#email" ).val();
                            }
                    }
                }
            },
            password: {
                required: true,
                ilook_password: true,
                 minlength: 8,
                 maxlength: 20,
                 noSpace: true

            }
        },
        messages: {
            first_name:{
                noSpace:"Please enter valid first name"
            },
            last_name:{
                noSpace:"Please enter valid last name"
            },
            email: {
                remote: "Not available!",
            }
        }
    });

HTML：

<!-- Create Account Starts -->
<div class="create-account">
    <h3>CREATE YOUR ACCOUNT</h3>
    <form name="registeration_step1" id="registeration_step1"
        method="POST" action="registration">
        <div class="create-account-col1">
            <div class="create-account-col1-left">First Name:</div>
            <div class="create-account-col1-right">
                <input id="first_name" name="first_name" type="text" value="" />
            </div>
        </div>
        <div class="create-account-col1">
            <div class="create-account-col1-left">Last Name:</div>
            <div class="create-account-col1-right">
                <input id="last_name" name="last_name" type="text" />
            </div>
        </div>
        <div class="create-account-col1">
            <div class="create-account-col1-left">Email:</div>
            <div class="create-account-col1-right">
                <input id="email" name="email" type="text" /> 
            </div>
            <div class="tick-box" id="tick-box-image">
            </div>
        </div>
        <div class="create-account-col1">
            <div class="create-account-col1-left">Password:</div>
            <div class="create-account-col1-right">
                <input id="password" name="password" type="password" />
            </div>
        </div>
        <div class="join-now">
            <div class="join-now-left">
                By clicking Join Now, you agree to our <a class="text-purple-link"
                    href="javascript:;">Terms</a> and that you have read our <a
                    class="text-purple-link" href="javascript:;">Data Use Policy</a>,
                including our <a class="text-purple-link" href="javascript:;">Cookie
                    Use</a>.
            </div>
            <div class="join-now-right">
                <input type="hidden" name="created_from" value="ilook"
                    id="created_from"> <input name="signup_submit" type="submit"
                    value="JOIN NOW" />
            </div>
        </div>
    </form>
</div>

服务器端脚本：

public function checkEmailExistAction()
{
    $params = $this->getRequest()->getParams();
    $email_check = \Extended\ilook_user::isEmailExist($params['email']);

    if($email_check){
        echo Zend_Json::encode(false);
    }else{
        echo Zend_Json::encode(true);
    }
    die();
}

Answer 1

remote方法用于将表单输入数据与服务器上的数据进行比较。服务器端脚本返回一个响应，该响应指示jQuery Validation字段有效或无效，如果无效，则可选择返回自定义错误消息。 remote方法应该做的全部。

如果您想在评估任何规则时做某事，那么您不应该将此逻辑放在remote方法中。您需要使用在评估任何规则时触发的许多可用回调函数之一，这就是我要求查看其余代码的原因。

典型地，

errorPlacement - 用于在您的布局中放置错误消息。默认情况下，它位于输入元素之后。

highlight - 默认情况下，用于从正在验证的元素中添加/删除无效/有效class。与unhighlight一起使用。

unhighlight - 默认情况下，用于从正在验证的元素中删除/添加无效/有效class。与highlight一起使用。

success - 默认情况下，不使用此功能。可选地，这用于将错误消息元素放置在有效字段上...例如，当您想要“ok”消息或有效字段上的绿色复选标记时。

See the documentation for all available callbacks and options

Look at the source code to see the default functions for these callbacks。 您可以将默认功能复制为自定义回调功能的模板。

备注：

在这种情况下，您绝对不需要data选项。你可以删除所有这些......

data: { email: function() { return $( "#email" ).val(); } }

remote方法正在应用于名为email的字段，因此默认情况下，email字段的值已经发送到服务器

data选项仅用于需要发送其他数据和默认数据的情况。就像你需要发送密码字段的值以及电子邮件地址一样。

jquery远程验证修改

1 个答案: