JQuery несколько радио-кнопок - PullRequest
Новая
       24

JQuery несколько радио-кнопок

2 голосов
/ 16 октября 2008

Впервые в javascript / jquery и с трудом справляются с использованием «this» или «$ (this)» для получения текущего объекта.

У меня есть таблица с набором переключателей в каждой строке, каждая из которых называется 's_'. Ни одна из переключателей по умолчанию не включена: 

<tr>
   <td align="left" style="width: 300px">
      <div id="div_s_0">
         <input type="radio" name="s_0" value="1" />Public
         <input type="radio" name="s_0" value="2" />Not Public
         <input type="radio" name="s_0" value="3" />Confidential
      </div>
   </td>
</tr>
<tr>
   <td align="left" style="width: 300px">
      <div id="div_s_1">
         <input type="radio" name="s_1" value="1" />Public
         <input type="radio" name="s_1" value="2" />Not Public
         <input type="radio" name="s_1" value="3" />Confidential
      </div>
   </td>
</tr>

Я пытаюсь написать функцию jQuery для добавления новой строки в таблицу всякий раз, когда пользователь выбирает переключатель, но только если они в данный момент находятся в последней строке таблицы. То, что я хотел бы сделать, это получить атрибут имени переключаемой кнопки, проанализировать его, чтобы получить индекс строки (то есть деталь после '_') и сравнить его с количеством строк в таблице. Если они равны, добавьте новую строку, иначе ничего не делайте.

Мой вопрос двоякий, в зависимости от того, как я должен атаковать это:

1) Как вернуть атрибут имени переключателя ИЛИ 2) Как мне вернуть индекс строки, в которой я сейчас нахожусь?

Ответы [ 3 ]

5 голосов
/ 16 октября 2008

Это даст вам индекс, используя предоставленный вами HTML-код: 

$(document).ready(function() {
    $("input:radio").click(function() {
        var index = parseInt(this.name.split('_')[1])
    });
});

Еще одна вещь, которая может вам помочь: получение количества строк в вашей таблице: 

$($("table").children()[0]).children().length

Надеюсь, это поможет вам на вашем пути.

2 голосов
/ 17 октября 2008

Для ваших конкретных вопросов 1 и 2, если вы дали своей таблице идентификатор «mytable», этот пример должен дать вам то, что вы ищете: 

var rowIndex = $("#mytable tr").index($(this).parents("tr"));
var inputName = $(this).attr("name");
alert("Input Name: " + inputName + "; RowIndex: " + rowIndex);
0 голосов
/ 16 октября 2008

Вот какой-то непроверенный код на моей голове: 

$("#div_s_0 input[type='radio']").onclick = function() {
    if ($("#div_s_0 input[type='radio']:last").attr('checked') == 'checked') {
    /* add a new element */
    }
}

Для этого нужно прикрепить событие onclick к каждой из переключателей в div. При щелчке по кнопке проверяется, установлен ли последний переключатель в этой группе, и, если это так, добавляется еще один элемент.

Как я уже сказал, это еще не было проверено. Я не уверен насчет селектора (# div_s_0 ... :last), поэтому сначала запустите его в Firebug.

...