Как можно заполнить сгенерированный JQuery со значениями 1-52

0

Я использую jquery для добавления поля выбора после изменения переключателя. Код выглядит так:

$("<label>For: </label><select><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>"+
                            "<option value='7'>7</option>"+
                            "<option value='8'>8</option>"+
                            "<option value='9'>9</option>"+
                            "<option value='10'>10</option>"+
                            "<option value='11'>11</option>"+
                            "<option value='12'>12</option>"+
                            "</select><label>Weeks</label>")
.attr("id", "duration")
.attr("name", "duration")
.attr("class", "duration")
.appendTo("#durationVal");

Я попытался использовать массив, но это просто заполнило выбор со всеми элементами массива в поле. Я также пытался использовать цикл for для этого, но это ничего не делает. Идея заключается в том, что при щелчке на переключателе для повторяющейся работы появляется следующий набор радиостанций, позволяющий использовать выбор ежемесячного или недельного повторения. Затем вы выбираете окончательный выбор, который я хочу выбрать, который позволяет в течение 26 недель или 6 месяцев в зависимости от выбранного переключателя. Как я могу это сделать, поэтому мне не нужно добавлять каждый параметр вручную? Вышеупомянутые работы, но это уродливые и слишком много типизирующие.

Теги:

2 ответа

0
Лучший ответ

Я не мог заставить код jquery работать так, как мне было нужно, поэтому я написал для выбора в свой html, используя php-цикл, чтобы заполнить их следующим образом:

  <td id="selmn_td"><label>Times: </label>
    <select name="selectMN" id="selectorMN" ><?PHP 
                                            for ($i = 1;$i<13;$i++)
                                             echo "<option value=" . $i . ">" .$i . "</option>";
                                            ?>
    </select></td>
</tr>
<tr>
  <td id="selwk_td"><label>Times: </label>
    <select name="selectWK" id="selector" style="visibility:hidden" ><?PHP 
                                                                for ($i = 1;$i<53;$i++)
                                                                 echo "<option value=" . $i . ">" .$i . "</option>";
                                                                ?>
    </select><label id="weeks"></label><label id="months"></label></td>
  <td>&nbsp;</td>
  <td>&nbsp;</td>
  <td id="weekdays" colspan="2">
        <input type="checkbox" name="weekdays[]" value="Monday" id="weekdays_0" />Mon</label><label>
        <input type="checkbox" name="weekdays[]" value="Tuesday" id="weekdays_1" />Tues</label><label>
        <input type="checkbox" name="weekdays[]" value="Wednesday" id="weekdays_2" />Wed</label><label>
        <input type="checkbox" name="weekdays[]" value="Thursday" id="weekdays_3" />Thu</label><label>
        <input type="checkbox" name="weekdays[]" value="Friday" id="weekdays_4" />Fri</label><label>
        <input type="checkbox" name="weekdays[]" value="Saturday" id="weekdays_5" />Sat</label><label>
        <input type="checkbox" name="weekdays[]" value="Sunday" id="weekdays_6" />Sun</label>
  </td>

Затем я использовал следующий jquery, чтобы показать и скрыть поля ввода:

        $('#RadioGroup1_0').change(function()
        {
            document.getElementById('radio_duration_td').style.visibility="visible";
            document.getElementById('selwk_td').style.visibility="visible";
            document.getElementById('selector').style.visibility="visible";
            document.getElementById('weekdays').style.visibility="visible";

        $('#RadioGroup1_1').change(function()
        {
            document.getElementById('radio_duration_td').style.visibility="hidden";
            document.getElementById('selwk_td').style.visibility="hidden";
            document.getElementById('selector').style.visibility="hidden";
            document.getElementById('weekdays').style.visibility="hidden";
            document.getElementById('selmn_td').style.visibility="hidden";
        }
        );  

        $('#radio_duration_1').change(function()
        {
            document.getElementById('weeks').style.visibility="hidden";
            document.getElementById('weekdays').style.visibility="hidden";
            document.getElementById('selmn_td').style.visibility="visible";
            document.getElementById('selector').style.visibility="hidden";
            document.getElementById('selwk_td').style.visibility="hidden";
            //document.getElementById('selwk_td').style.visibility="visible";
            //document.getElementById('selector').style.visibility="visible";
        }
        );                              
        $('#radio_duration_2').change(function()
        {
            document.getElementById('weekdays').style.visibility="visible";
            document.getElementById('selector').style.visibility="visible";
            document.getElementById('selwk_td').style.visibility="visible";
            document.getElementById('selmn_td').style.visibility="hidden";
            //document.getElementById('months').style.visibility="hidden";
        }

Это не идеальный вариант, но когда уходят крайние сроки, вам нужно идти с тем, что работает. Предложения по этому поводу будут по достоинству оценены!

Поделиться
2

На данный момент вы создаете единичный флажок для выбора каждый раз, когда вы проходите цикл, вы хотите создать параметры, а не выбирать в цикле

var select = $("<select></select>");
for (i=1;i<53;i++)
{
   select.append( $('<option value="'+i+'">'+i+'</option>') );
}
$("#WhateverElement").append(select);

И так как вы начинаете цикл в 1, вы должны использовать либо i<53 либо i<=52 чтобы получить полные значения 52

Также у вас есть

.attr("id", "durationW")
.attr("class", "duration")
.appendTo("#durationVal");

сразу после того, как недопустимый блок цикла for не имеет значения, и должен бросать какую-то ошибку, поскольку он не привязан к какому-либо объекту.

Поделиться

Ещё вопросы

Сообщество Overcoder
Наверх
Меню