Javascript и asp.net веб-элементы управления

Question

У меня есть веб-пользовательский элемент управления, который генерирует следующий HTML-код на клиенте.

Я хочу сослаться на конкретный элемент управления RadioButton, используя JavaScript.

Я не уверен, как это сделать, так как идентификатор RadioButton генерируется asp.net.

Например я даю идентификатор RadioButton = 1_RadioButton

asp.net генерирует ID = ctl00_ContentPlaceHolder1_Material_1_RadioButton

как этот код JavaScript может найти элементы управления Radio Button?

    <script type="text/javascript">
        $(document).ready(function() {
            if (document.getElementById("1_RadioButton").checked) {
                $("#1_other").hide();
            }
        });    
    </script>

Вот что генерирует asp.net для клиента.

    <input id="ctl00_ContentPlaceHolder1_Material_1_RadioButton" type="radio" name="ctl00$ContentPlaceHolder1$Material$Academic" value="1_RadioButton" onclick="javascript:$('#1_other').show('fast');" />

    <label for="ctl00_ContentPlaceHolder1_Material_1_RadioButton">Yes</label>

    <input id="ctl00_ContentPlaceHolder1_Material_2_RadioButton" type="radio" name="ctl00$ContentPlaceHolder1$Material$Academic" value="2_RadioButton" checked="checked" onclick="javascript:$('#1_other').hide('fast');" />

    <label for="ctl00_ContentPlaceHolder1_Material_2_RadioButton">No</label>

    <input id="ctl00_ContentPlaceHolder1_Material_3_RadioButton" type="radio" name="ctl00$ContentPlaceHolder1$Material$Academic" value="3_RadioButton" onclick="javascript:$('#1_other').hide('fast');" />

    <label for="ctl00_ContentPlaceHolder1_Material_3_RadioButton">Uncertain</label>

    <div id='1_other'>
         <input name="ctl00$ContentPlaceHolder1$Material$4_TextBox" type="text" value="bbb chabng" id="ctl00_ContentPlaceHolder1_Material_4_TextBox" />
   </div>

Answer 1

Если этот код находится в файле.aspx, используйте вместо него <% = MyRadioButton.ClientID%>, и механизм рендеринга ASP.NET правильно предоставит вам идентификатор.

Обновление: например:

<script type="text/javascript">
    $(document).ready(function() {
        if ($get("<%= MyRadioButton.ClientID %>").checked) {
            $("#1_other").hide();
        }
    });    
</script>

Answer 2

var radioButton = document.getElementById("<%= 1_RadioButton.ClientID %>");

А потом иди оттуда. Примечание - я не уверен в кавычках.

Answer 3

Очень просто установить clientidmode веб-контроль в статический (clientidmode="static") и вы можете быть уверены, что asp.net будет держать ваш ID как видно в интерфейсе дизайнера.

Answer 4

Я написал сообщение в блоге о том, как это сделать:

Допустим, у вас есть элемент управления ярлыком на вашей странице:

Сгенерированный вывод html и идентификатор этого элемента управления может выглядеть следующим образом:

<span id="ctl00_ContentPlaceHolder1_Label1"></span>

К сожалению, сгенерированный идентификатор ct100_ContentPlaceHolder1_Label1 не всегда будет одинаковым от сборки к сборке. Итак, пытаясь выбрать его так:

$("#ct100_ContentPlaceHolder1_Label1").hide();

в конце концов сломается и не скроет элемент управления меткой.

Хитрость заключается в том, чтобы использовать ASP.NET внутри селектора jQuery. Label1.ClientID будет возвращать сгенерированный идентификатор каждый раз. Мы объединяем ASP.NET и jQuery в одну строку следующим образом:

$("#<%= Label1.ClientID %>").hide();

Это будет получать сгенерированный идентификатор элемента управления Label каждый раз.