Как я могу определить SelectedValue списка RadioButtonList в JavaScript?

У меня есть веб-страница ASP.NET с привязкой к RadioButtonList. Я не знаю, сколько радио-кнопок будет отображаться во время разработки. Мне нужно определить SelectedValue на клиенте с помощью JavaScript. Я пробовал следующее без большой удачи:

var reasonCode = document.getElementById("RadioButtonList1");
var answer = reasonCode.SelectedValue;  

( "answer" возвращается как "undefined" ) Пожалуйста, простите мое незнание JavaScript, но что я делаю неправильно?

Спасибо заранее.

Ответ 1

ASP.NET отображает таблицу и множество других надбавок вокруг фактических радиовходов. Следующее должно работать: -

 var list = document.getElementById("radios"); //Client ID of the radiolist
 var inputs = list.getElementsByTagName("input");
 var selected;
 for (var i = 0; i < inputs.length; i++) {
      if (inputs[i].checked) {
          selected = inputs[i];
          break;
       }
  }
  if (selected) {
       alert(selected.value);
  }

Ответ 2

Попробуйте это, чтобы получить выбранное значение из списка RadioButtonList.

var selectedvalue = $('#<%= yourRadioButtonList.ClientID %> input:checked').val()

Ответ 3

Я всегда вижу источник. Вы обнаружите, что каждый элемент переключателя имеет уникальный идентификатор, с которым вы можете работать, и проведите через них, чтобы выяснить, какой из них проверен.

Изменить: нашёл пример. У меня есть список переключателей rbSearch. Это в ascx, называемом ReportFilter. В View Source я вижу

ReportFilter1_rbSearch_0
ReportFilter1_rbSearch_1
ReportFilter1_rbSearch_2

Итак, вы можете либо пропустить document.getElementById( "ReportFilter1_rbSearch_" + idx), либо иметь оператор switch, и посмотреть, какой из них имеет .checked = true.

Ответ 4

RadioButtonList - это серверный элемент управления ASP.NET. Это отображает HTML в браузер, который включает в себя переключатель, который вы пытаетесь манипулировать с помощью JavaScript.

Я бы рекомендовал использовать что-то вроде Панель инструментов IE Developer (если вы предпочитаете Internet Explorer) или Firebug (если вы предпочитаете FireFox), чтобы проверить вывод HTML и найти идентификатор переключателя, который вы хотите манипулировать в JavaScript.

Затем вы можете использовать document.getElementByID("radioButtonID").checked из JavaScript, чтобы узнать, выбран ли переключатель или нет.

Ответ 5

HTML-эквивалент ASP.NET RadioButtonList - это набор типа < input type = "radio" > с таким же атрибутом имени (на основе свойства ID для RadioButtonList).

Вы можете получить доступ к этой группе переключателей, используя getElementsByName. Это набор переключателей, доступных через их индекс.

alert( document.getElementsByName('RadioButtonList1') [0].checked );

Ответ 6

Для "RadioButtonList" всего 2 значения "да" и "нет", я сделал это:

var chkval=document.getElemenById("rdnPosition_0")

Здесь rdnposition_0 ссылается на id да ListItem. Я получил его, просмотрев исходный код формы.

Затем я сделал chkval.checked, чтобы узнать, отмечено ли значение "Да".

Ответ 7

function CheckRadioListSelectedItem(name) {

    var radioButtons = document.getElementsByName(name);
    var Cells = radioButtons[0].cells.length;

    for (var x = 0; x < Cells; x++) {
        if (document.getElementsByName(name + '_' + x)[0].checked) {
            return x;
        }
    }

    return -1;
}

Ответ 8

Я хотел бы добавить наиболее прямое решение этой проблемы:

var reasons= document.getElementsByName("<%=RadioButtonList1.UniqueID%>");
var answer;
for (var j = 0; j < reasons.length; j++) {
    if (reason[j].checked) {
        answer = reason[j].value;
    }
}

UniqueID - это свойство, которое дало вам имя входов внутри элемента управления, поэтому вы можете просто проверить их очень легко.

Ответ 9

reasonCode.options [reasonCode.selectedIndex].value

Ответ 10

Из здесь:

if (RadioButtonList1.SelectedIndex > -1)

{

Label1.Text = "Вы выбрали:" + RadioButtonList1.SelectedItem.Text;

}

Ответ 11

Я пробовал различные способы определения RadioButtonList SelectedValue в Javascript без радости. Затем я просмотрел веб-страницу HTML и понял, что ASP.NET отображает элемент управления RadioButtonList на веб-странице в виде таблицы HTML с одним столбцом!

<table id="rdolst" border="0">
  <tr>
    <td><input id="rdolst_0" type="radio" name="rdolst" value="Option 1" /><label for="rdolst_0">Option 1</label></td>
  </tr>
  <tr>
    <td><input id="rdolst_1" type="radio" name="rdolst" value="Option 2" /><label for="rdolst_1">Option 2</label></td>
  </tr>
</table>

Чтобы получить доступ к отдельному элементу ListItem в RadioButtonList через Javascript, вам необходимо ссылаться на него в дочерних элементах ячейки (называемых узлами в Javascript) в соответствующей строке. Каждый ListItem отображается как первый (нулевой) элемент в первой (нулевой) ячейке в своей строке.

Этот пример проходит через RadioButtonList, чтобы отобразить SelectedValue:

var pos, rdolst;

for (pos = 0; pos < rdolst.rows.length; pos++) {
    if (rdolst.rows[pos].cells[0].childNodes[0].checked) {
        alert(rdolst.rows[pos].cells[0].childNodes[0].value);
        //^ Returns value of selected RadioButton
    }
}

Чтобы выбрать последний элемент в списке RadioButtonList, вы должны сделать следующее:

rdolst.rows[rdolst.rows.length - 1].cells[0].childNodes[0].checked = true;

Таким образом, взаимодействие с RadioButtonList в Javascript очень похоже на работу с обычной таблицей. Как я уже сказал, я пробовал большинство других решений, но это единственное, что работает для меня.

Ответ 12

Я хотел выполнить ShowShouldWait script, только если Page_ClientValidate был true. В конце script возвращается значение b, чтобы предотвратить событие postback в случае, если оно недействительно.

В случае, если кому-то интересно, вызов ShouldShowWait используется для отображения только "please wait" div, если выбран тип вывода "HTML", а не "CSV".

onclientclick="var isGood = Page_ClientValidate('vgTrxByCustomerNumber');if(isGood){ShouldShowWait('optTrxByCustomer');} return isGood"