jquery - Populate select options dependent on their corresponding table value -
i have table select dropdowns , values of places left shown in html:
<table class="day-choices"> <thead> <tr> <th>time</th> <th class="day-choices-pleft">places left</th> <th class="day-choices-preq">places req.</th> </tr> </thead> <tbody> <tr> <td>10.30</td> <td class="day-choices-pleft">6</td> <td class="day-choices-preq"> <select name="places-req[]" class="places-req"> </select> </td> </tr> <tr> <td>11.30</td> <td class="day-choices-pleft">8</td> <td class="day-choices-preq"> <select name="places-req[]" class="places-req"> <option value="">0</option> </select> </td> </tr> <tr> <td>12.30</td> <td class="day-choices-pleft">10</td> <td class="day-choices-preq"> <select name="places-req[]" class="places-req"> <option value="">0</option> </select> </td> </tr> <tr> <td>13.30</td> <td class="day-choices-pleft">5</td> <td class="day-choices-preq"> <select name="places-req[]" class="places-req"> <option value="">0</option> </select> </td> </tr> <tr> <td>14.30</td> <td class="day-choices-pleft">6</td> <td class="day-choices-preq"> <select name="places-req[]" class="places-req"> <option value="">0</option> </select> </td> </tr> </tbody> </table>
what i'd populate select options dependent on value in td.day-choices-pleft
using jquery.
for example if in table row had 6 places left id select have 6 options (including 0 option):
<select name="places-req[]" class="places-req"> <option value="">0</option> <option value="">0</option> <option value="1">1</option> <option value="2">2</option> <option value="3">3</option> <option value="4">4</option> <option value="5">5</option> <option value="6">6</option> </select>
$('td.day-choices-pleft').each(function(){ var val = parseint($(this).text()); var $select = $(this).next('td.day-choices-preq').find('select'); $select.empty(); for(var = 0 ; <= val ; i++){ $select.append("<option value="+i+">"+i+"</option>"); } });
Comments
Post a Comment