使用jquery禁用下拉列表

时间:2017-02-25 10:08:06

标签: jquery json

我试过这个

<div class="form-group">
            <label>Customer Type</label>
            <select class="form-control select2" style="width: 100%;" name="customer_type" id="customer_type" onchange="get_corporate(this.value)">
                <option value="">Select Customer Type</option>
                <option value="1">Personal</option>
                <option value="2">Organization</option>
            </select>
        </div>

        <div class="form-group">
            <label>Company Name</label> <button class="btn btn-info btn-xs" type="button" id="btn-addcompany">add</button> 
            <select class="form-control select2" style="width: 100%;" name="company_name" id="company_name">
                <option>-- Select Company --</option>
                <?php
                foreach ($company as $value) {
                     echo"<option value='".$value['id']."'>".$value['name']."</option>";
                }
                ?>
            </select>
        </div>

但是如果company_name禁用,变量company_name不能定义,如何解决?

1 个答案:

答案 0 :(得分:0)

要禁用按钮和选择框,您可以执行以下操作:您也可以禁用所需的属性。

$(function(){
 $("#save").on("click",function(){
	 var id = $('#customer_type').val();   
	 if(id == ""){
	      alert("Please select Customer Type");
	     return;
		}
	var company=  $("#company_name").val();
	if(id != 1 && company == 0){
      alert("Please select your company");
     return;
	}	 
 }); });  
function get_corporate(id){    
var id = $('#customer_type').val();    
   if (id == 2){
     $("#btn-addcompany").prop("disabled",false);
     $("#company_name").prop("required",true);
     $("#company_name").prop("disabled",false);
 }else{
 	$("#btn-addcompany").prop("disabled",true);
     $("#company_name").prop("required",false);
     $("#company_name").prop("disabled",true);
 }   

}
   
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="form-group">
            <label>Customer Type</label>
            <select class="form-control select2" style="width: 100%;" name="customer_type" id="customer_type" onchange="get_corporate()">
                <option value="">Select Customer Type</option>
                <option value="1">Personal</option>
                <option value="2">Organization</option>
            </select>
        </div>

        <div class="form-group">
            <label>Company Name</label> <button class="btn btn-info btn-xs" type="button" id="btn-addcompany">add</button> 
            <select class="form-control select2" style="width: 100%;" name="company_name" id="company_name">
                <option value="0">-- Select Company --</option>
                <option value="1">1</option>
                <option value="2">2</option>
            </select>
        </div>
<button id="save" type="button">Save!</button>