Question

我想我已经做了相当详尽的搜索，但还没有找到答案。

我有一个列表框（选择多个）URI地址，可以通过它上面的输入字段添加。（即：键入URI地址，单击“添加”按钮，将URI添加到下面的列表框中。）

使用JQuery Validate Plugin，我已将选择框selectboxUriList定义为

getClass().getSimpleName().split("(?<=[a-z])(?=[A-Z])")

以及错误消息：

selectboxUriList: {
    required: true,
    rangelength: [1, 6]
}

minLength，maxLegth等的各种迭代。然而，即使在输入项目之后，验证也会失败，除非我手动单击列表框中的项目。然后它立即通过。

selectboxUriList: {
    required: "Required field",
    minlength: "Must have at least 1 URI entry"
}

我在StackOverflow上经历过几个建议，但大多数似乎依赖于用户在物理上选择一个项目。我只想验证用户是否在列表框中输入了至少一个URI地址。

Submitted without manually clicking item

After manually clicking item

我尝试过使用.change（）,. on（'change'，function（）... etc

感谢任何建议或意见。

Answer 1

我想我想出了一个适合我的解决方案。

创建了自定义JQuery Validate插件规则定义：

selUriList: {
    uriListCheck: true
},

然后定义规则本身：

jQuery.validator.addMethod('uriListCheck', function(value) {
    var hasOptions = !!$('#selUriList option').filter(function() {
        return !this.disabled;
    }).length;
    if (hasOptions <= 0) {
        return false;
    } else {
        return true;
    }
}, "At least one base URI is required");

然后在调用ADD按钮时调用规则：

$('[name="btnUriAdd"]').click(function() {
    var uri = $('#txtUriEntry').val();
    $('#selUriList').append('<option value="' + uri + '">' + uri + '</option>');
    $('#txtUriEntry').val('');
    $('#btnUriAdd').attr('disabled', true);
    $('#sendForm').validate().element('#selUriList');
});

发布此信息以防其他人帮助。

Jquery验证列表框中“至少1”条目的插件

1 个答案: