简体   繁体   中英

disable previously selected dropdown option, check both text & id value

In a table, how to loop through all dropdowns text & id in a table's col, and save them in array. So that I can disable previously selected options

Once an option is selected, I do not want it to be available again . How to check the selected text of previously selected options in the table set that option to disabled on all other dropdowns in the page.

(this question is different from other SO questions since its disabling after checking both selected text & selected value inside a table and needs to target the dropdown in the specified column)

var allSelectedValuesArray = array();
allSelectedValuesArray.push($("#tblVersions .Model option:selected").text());

var rows = $("body tr",$("#tblVersions")).map(function() { 
return [$("td:eq(0) input:checkbox:checked",this).map(function() { 
  return this.innerHTML;     
}).get()];
}).get();

<table id="tblversions">
 <tbody id="body">
  <tr class="rowcss">
   <td>
    <select class="Manufacturer">
      <option value="1">Toyota </option>
      <option value="2">Honda</option>
      <option value="3">BMW</option>
    </select>
   </td>
   <td>
   <select class="Model"> 
   <!-- If user selects Honda my Ajax populates Honda Models/Cars like below-->
      <option value="1">Accord</option>
      <option value="2">Toyota 2</option>
      <option value="3">Honda 3</option>        
    </select>
   </td>
   </tr>
    <tr class="rowcss">
    <td>
    <select class="Manufacturer">
      <option value="1">Toyota </option>
      <option value="2">Honda</option>
      <option value="3">BMW</option>
    </select>
    </td>
    <td>
    <select class="Model">
    <!-- If user selects BMW my Ajax populates BMW models Cars like below-->
      <option value="1">X5 Suv</option>
      <option value="2">318 series Cheap</option>
      <option value="3">540i too expensive!</option>        
    </select>
   </td>
  </tr>     
 </tbody>
 </table>

I didn't understand the second part of your question, but if you want to get text and values for all dropdowns you could do something like this.

// Called when any of the dropdowns change
( "#tblversions" ).change(function() {
    var allSelectedValuesArray = [];

    // Search for all selects in the #tblversions
    $("#tblversions select option:selected").each(function() {
        // for each one, push it into the array
        allSelectedValuesArray.push({text:$(this).text(), value:this.value});
    });
});

This creates an array of objects in the format {text:"sometext",value:"somevalue"} for each of the dropdowns in the table.

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM