jQuery表单验证插件和tooltipster插件验证选择菜单?

时间:2013-06-08 12:14:13

标签: javascript jquery

我制作了一个简单的脚本,使用jQuery Validation脚本和工具提示器来验证我的表单元素,以显示错误消息。
脚本工作正常,但没有选择菜单

$(document).ready(function(){
    $.validator.addMethod("valueNotEquals", function(value, element, arg){
        return arg != value;
       }, "Value must not equal arg.");
    $('#eway input[type="text"]').tooltipster({
        trigger: 'custom',
        onlyOne: false,
        position: 'right'
    });
    $('.inputfield select').tooltipster({
        trigger: 'custom',
        onlyOne: false,
        position: 'right'
    });
    (function($,W,D)
{

    var JQUERY4U = {};

    JQUERY4U.UTIL =
    {
        setupFormValidation: function()
        {
            //form validation rules
            $("#eway").validate({
                 errorPlacement: function (error, element) {
                    $(element).tooltipster('update', $(error).text());
                    $(element).tooltipster('show');
                },
                rules: {
                    txtFirstName: "required",
                    txtLastName: "required",
                    txtEmail: {
                        required: true,
                        email: true
                    },
                    txtMobileNumber: "required",
                    Type: { 
                        valueNotEquals: "Default" 
                    }
                },
                messages: {
                    txtFirstName: "Please enter your firstname",
                    txtLastName: "Please enter your lastname",
                    txtEmail: "Please enter a valid email address",
                    txtMobileNumber: "please enter a valid mobile number",
                    Type: "Please select Donation Type"
                },
                submitHandler: function(form) {
                    form.submit();
                }
            });
        }
    }

    //when the dom has loaded setup form validation rules
    $(D).ready(function($) {
        JQUERY4U.UTIL.setupFormValidation();
    });

})(jQuery, window, document);
    $('#eway').submit(function(e) {
        e.preventDefault();
    });
});

我不知道是什么问题。
可能是因为工具提示功能显示选择菜单的错误信息我错过了什么?

  $('.inputfield select').tooltipster({
        trigger: 'custom',
        onlyOne: false,
        position: 'right'
    });

或者我添加了验证方法以验证选择菜单?

 $.validator.addMethod("valueNotEquals", function(value, element, arg){
            return arg != value;
           }, "Value must not equal arg.");

2 个答案:

答案 0 :(得分:0)

您需要在以下行中分配您将要使用的元素...

$('#eway input[type="text"], #eway select').tooltipster({

它对我有用。

答案 1 :(得分:0)

我发现了困难的方法但是由于selectmenus创建了一个单独的跨度,你必须将尖端附加到id为"#" + mySelect +" -button"然后专门为其初始化工具提示

ipython