1

我有一个带有几个下拉菜单的表单,这些下拉菜单是使用选择菜单的样式。这些下拉菜单最初是隐藏的。在某些情况下,它会显示出来。所以我需要检查下拉菜单是否显示,用户应该从中选择一个值,然后只允许他提交表单。如果用户没有选择任何值,则应显示错误并且不应提交表单。

用于选择菜单的 JS 文件

if ($.fn.selectmenu) {
  $('select.dd-select').selectmenu({
    style:'dropdown',
    maxHeight: 300,
    transferClasses: true
  });

}

用于验证的 JS 文件

$('#submitbutton').click(function(){
var returnValue = true;
$('#form1 .required').filter(':visible').each(function () {
inputVal = $(".dd-default option:selected").val();
alert(inputVal); -- displaying null
var input = $(this);alert(input.val()); -- displaying null
input.next('ul.innererrormessages').remove();
input.removeClass('required');
if (!input.val()) {
    input.addClass('required');
    var $msg = input.attr('title');
    input.after('<ul class="innererrormessages"><li>'+$msg+'</li></ul>'); --error message not shown
    returnValue = false;
}

 });
});

$('#form1 .required').change(function () {
    var input = $(this);
    input.next('ul.innererrormessages').remove();
    input.removeClass('required');
    alert(input.val());-- displays the value
    if (!input.val()) {
        input.addClass('required');
        var $msg = input.attr('title');
        input.after('<ul class="innererrormessages"><li>'+$msg+'</li></ul>');-- the error message is also displayed properly
    }
});

HTML

<select id="dd1" name="dd1" class="required dd-select" title="Please select to continue.">
  <option value=""> --</option>
   <%= List %>
</select>

在上面的代码中,如果没有选择任何值,它会突出显示但不显示错误。它应该从选择的标题属性中获取的错误。在更改值时,它会提醒新值。但再次提交时,该值显示为空。我不知道如何使用选择菜单为此创建小提琴。如果我只使用下拉验证创建小提琴,它就可以正常工作。我认为当它的选择菜单时,我们有什么单独的方法来获取选定的值吗?有人可以告诉我我做错了什么并指导我吗?谢谢

4

2 回答 2

0

您在 !input.val() 上显示错误消息,这意味着没有值或 value=0。为什么不在 if (!input.val()) {} 内提醒

        if (!input.val()) {
            alert("Ther is no value!"); // new alert()
            input.addClass('required');
            var $msg = input.attr('title');
            input.after('<ul class="innererrormessages"><li>'+$msg+'</li></ul>');//-- the error message is also displayed properly
        }
于 2013-11-14T08:39:13.533 回答
0

尝试使用像 jquery 验证这样的库。在这个问题中,您将找到有关如何使其与 selectmenu 一起使用的有用信息。然后,您可以添加自定义方法来检查下拉菜单是否可见。

于 2013-11-15T18:03:50.343 回答