如何强制用户使用引导程序选择<选择>选项

How to force a user to choose a <select> option with bootstrap

本文关键字：选择 选项 引导程序 何强制 用户      更新时间：2023-09-26

几个小时以来，我一直在努力解决这个问题，这让我发疯了！

我正在使用Twitter Bootstrap和bootstrap-min.js。

这是我的代码：

<select id="assettype" name="assettype" class="input-medium required">
   <option>-- Please select --</option>
   <option value="1">Printer</option>
   <option value="2">Scanner</option>
</select>

如果用户将表单保留为"-- 请选择 --"选项，那么我想要一个错误来阻止用户提交表单，即强制他们进行选择。

任何帮助将不胜感激！提前谢谢。

use event.preventDefault（）

$('#formId').submit(function (e) {
    if ($('#assettype').val() == '') {
    e.preventDefault(); //stop form submission
}
});

或

使用 jQuery Validator

$.validator.addMethod('notNone', function (value, element) {
    return (value != '');
}, 'Please select an option');
$("form").validate({
    rules: {
        assettype: {
            required: true,
            notNone: true
        }
    }
});

这似乎在提交之前需要一个简单的验证，例如

$('#formId').submit(function () {
 if ($('#assettype').val() != '')) {  //Check the value of select
    return true; //allow to submit the form
 }
 else {       
    alert("Please select an option");
    return false;  //Prevent form being submitted
 }
}); 

<form id="my_form" method="POST" action="" >
<select id="assettype" name="assettype" class="input-medium required">
  <option value="0" >-- Please select --</option>
  <option value="1">Printer</option>
  <option value="2">Scanner</option>
</select>
</form>
<script type="text/javascript">
  $("#my_form").submit(
    var check_value = $("#assettype").val();
    if (check_value == 0)
    {
      e.preventDefault();
      // prevent the user he has to choose something
      // by an alert for example, or background change of the element
      $("#assettype").css("background-color", "red");
      return false;
    }
    else
    {
      // and restore it if it's ok
      $("#assettype").css("background-color", "inherit");
    }
    return true;
  });
</script>
相关文章：