Проверка радиокнопки с помощью jQuery, когда радиокнопка запускается = "сервер"? - PullRequest
5 голосов
/ 10 августа 2010

Используя jQuery, я хочу иметь возможность щелкнуть элемент, который также проверит соответствующий переключатель.У меня это работало нормально, пока нам не пришлось добавить runat = "server" к переключателям.

Когда я применяю это, это препятствует работе моей функции jQuery, и я не могу понять, как ее обойти, вотупрощенная версия кода:

HTML

<input type="radio" runat="server" id="sector1Radio" name="SectorGroup" title="Sector1" />

jQuery

$('#SomethingElse').click(function() {
    $('input[title=Sector1]').attr('checked','checked');
});

Я обнаружил, что при преобразовании его в элемент управления .net вместо флажка =«флажок» (как обычно), он просто проверен, поэтому я изменил его, но при проверке DOM в нескольких браузерах ни одна из моих переключателей не проверяется: - (

Существуют ли другие способы?Я могу использовать jQuery для проверки переключателя, который имеет runat = "server"?

Cheers!

Ответы [ 8 ]

2 голосов
/ 31 августа 2010

Я думаю, что ваша проблема в том, что идентификатор входа больше не сектор1Radio, а ctl00_sector1Radio или что-то подобное Это происходит, если Ваш входной контроль находится, например, внутри. элемент управления ContentPlaceHolder (при использовании главных страниц).

Можете ли вы проверить сгенерированный HTML-код (в браузере), чтобы убедиться, что это так? Что такое идентификатор элемента управления вводом?

Если это так, вам необходимо сгенерировать код js jQuery

$('#SomethingElse').click(function() {
  $('input[title=Sector1]').attr('checked','checked');
});

из codebehind, так что SomeThingElse заменяется на ClientID элемента управления.

1 голос
/ 30 августа 2010

.is (': флажок') работает на радиокнопках и флажках ASP.NET

$('#SomethingElse').click(function() {
    $('input[title=Sector1]').is(':checked');
});
0 голосов
/ 07 октября 2010

Здесь есть две вещи: найти контроль и выполнить проверку.В ASP.NET фактический идентификатор и имя вашего элемента управления в конечном итоге будут изменены в зависимости от контейнера runat = "server", в котором он появляется, даже если эти контейнеры не имеют идентификаторов.

Отображаемые элементы управления ASP.NET всегдаоканчиваются тем же именем, с которого вы начали, поэтому тег вроде:

<input type="radio" runat="server" id="sector1Radio" title="Sector1" />

может закончиться тем, что будет отображаться как

<input type="radio" runat="server" id="ctl0$ctl0$sector1Radio" name="ctl0_ctl0_SectorGroup" title="Sector1" />

Вы можете найти этот элемент, даже после того, как он будет отрендеренесли вы используете синтаксис выбора «содержит» в JQuery.Таким образом, чтобы найти этот элемент после его рендеринга, вы можете использовать:

$("input[type='radio'][id*='$sector1Radio']")

Этот синтаксис найдет любую радиокнопку, идентификатор которой содержит "$ sector1Radio"

Когда у вас есть элемент, вы можетеустановите или снимите флажок, используя следующий код, который вы вызываете из события click вашего другого элемента.

// check the radio button
$("input[type='radio'][id*='$sector1Radio']").attr('checked', true);    

// uncheck the radio button
$("input[type='radio'][id*='$sector1Radio']").attr('checked', false);   

И последнее ... если вы просто хотите, чтобы блок текста нажимал кнопкупри нажатии (оберните его в тег и установите для свойства AssociatedControlId имя элемента управления вашей радиокнопки, например так ...

<input type="radio" runat="server" id="sector1Radio" title="Sector1" />
<asp:label runat="server" id="lblsector1Radio" associatedControlID="sector1Radio">clicking here clicks and unclicks the radio button</asp:label>
0 голосов
/ 03 сентября 2010

Я думаю, что в ASP NET Checkboxes и Radio Buttons генерируют «input» и «span» после входа. Так что вам нужно выбрать только вход.

Вы можете попробовать:

$('.classname input[type=checkbox]').each(function() {
        this.checked = true;
});
0 голосов
/ 03 сентября 2010

Если вы используете MasterPage или создаете элементы управления динамически, вероятно, что идентификаторы элементов управления переименовываются #SomethingElse становится # MainContent_SomethingElse.

Самый простой способ проверить это - использовать плагин WebDeveloper для Firefox или Chrome. Перейдите в Информация -> Показать информацию об элементе, а затем выберите объект. Он предоставит вам его ID, класс, а также информацию о предках и детях. Проверьте, не изменяется ли идентификатор динамически с помощью .NET.

Если это так:

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

SomethingElse.ClientIDMode = ClientIDMode.Static;

Вы можете ссылаться на вас jQuery

$('#SomethingElse').click(function() {
            if ($('input[title=Sector1]').attr('checked')) {
             //execute event
});
0 голосов
/ 31 августа 2010

Как предлагают другие, ASP.net не будет генерировать html с тем же идентификатором, который вы указали.

Быстрые решения:

  • Вы можете продолжать использовать идентификатор, но вместо этого попросите jquery проверить конец идентификатора, например:

    .

    $ ( "вход [идентификатор $ = 'sector1Radio']") есть ( ": проверено");

  • Или проверьте название и фамилию, как предложил Нико

  • Использовать элемент класса, который не затрагивается ASP.net, пример

    $ ( "input.sector1Radio") есть ( ": проверено");.

Лучше всего просмотреть сгенерированный html-код и посмотреть, что дает вам id, затем вы можете использовать соответствующий селектор jquery, потому что сгенерированный id может иметь различные расширения, зависит от того, используете ли вы главные страницы и т. Д.

0 голосов
/ 31 августа 2010

попробуйте использовать

$('input[title=Sector1]').attr('checked',true);

и

$('input[title=Sector1]').attr('checked',false);

или, может быть

$('#SomethingElse').click(function () {
    $('input[title=Sector1]').attr('checked',!$('input[title=Sector1]').attr('checked'));
});
0 голосов
/ 30 августа 2010

У меня была такая же проблема. Чтобы использовать пользовательский интерфейс jQuery для создания radiobuttons, нужно написать:

<div id="radio">
<input type="radio" id="radio1" runat="server" />
<label for="radio1">The label of the radio button</label>
...
</div>

<script type="text/javascript">
$('#radio').buttonset();
</script>

Идентификатор входного тега должен быть правильно указан меткой для атрибута. Если веб-страница находится внутри главной страницы, то идентификатор тега ввода будет изменен на что-то вроде ctl00_Something_radio1, и внезапно метка атрибута for больше не будет ссылаться на тег ввода. Остерегайтесь этого в ASP.NET!

...