L'ajout de optgroups dynamiquement à l'aide de jQuery

<select id="myElement" multiple="multiple">
  <option value="1">Category Type</option>
  <option value="158">itemOne</option>
  <option value="157">itemTwo</option>
  <option value="7">My Type</option>
  <option value="20">itemThree</option>
  <option value="21">itemFour</option>
  <option value="22">itemFive</option>
  <option value="8">Category Yet Another</option>
  <option value="31">itemCheese</option>
  <option value="32">itemBrain</option>
</select>

J'ai besoin de convertir dynamiquement ce donc que la "Catégorie" des options (tout ce qui ne commence pas par "le point") est un "optgroup", d'emballage whaterver vient après lui jusqu'à la prochaine Catégorie de l'option, de sorte que le ci-dessus pourrait finir par ressembler à:

<select id="myElement" multiple="multiple">
  <optGroup label="Category Type">
    <option value="158">One</option>
    <option value="157">Two</option>
  </optGroup>
  <optGroup label="My Type">
    <option value="20">Three</option>
    <option value="21">Four</option>
    <option value="22">Five</option>
  </optGroup>
  <optGroup label="Category Yet Another">
    <option value="31">Cheese</option>
    <option value="32">Brain</option>
  </optGroup>
</select>

Comment puis-je effectuer une itération en cours et de modifier les valeurs pour obtenir l'effet désiré à l'aide de jQuery?

Solution: reportez-vous à jsbin.com/nagohevoyi/1/edit?html,js,sortie AJS.$("#select2-example").append('<optgroup id="opt-gr1" label="Group test"></optgroup>'); AJS.$("#opt-gr1").append('<option>test</option>'); AJS.$("#opt-gr1").append('<option>test2</option>');

OriginalL'auteur key2starz | 2012-09-24

Leave a Reply

Votre adresse de messagerie ne sera pas publiée. Les champs obligatoires sont indiqués avec *