флажок выбрать / отменить выбор в репитере при нажатии на текст

Question

скажем, у нас есть простой репитер asp.net, в строке у нас есть один флажок, одна метка (идентификатор базы данных записи) и невидимая (используется для обратной передачи) и один текст (в ячейке таблицы)

Теперь я хочу сделать так, как в Windows, если вы нажмете на текст, флажок должен быть установлен или снят.

есть кто-нибудь ссылка или решение для этого, может быть, уже с jQuery?

Редактировать: как я уже сказал, это asp.repeater. и таблица предназначена для разметки, поэтому использование свойства checkbox.text недопустимо (например, перенос строки) Идентификаторы флажка и текста динамически добавляются / изменяются при рендеринге повторителя. поэтому решение для этикеток также не работает.

Answer 1

предположим, что вам не понадобится jQuery и табличная конструкция

<asp:Repeater runat="server">
    <ItemTemplate>
        <asp:CheckBox runat="server" Text="your text" />
    </ItemTemplate>
</asp:Repeater>

в основном это решение, предоставленное Рикардо Вега все, что вы получаете в тексте свойства флажка, является кликабельным, и устанавливает / снимает флажок ... для этого вы должны использовать <% # Eval ("...")%> Вы можете скинуть (через css) поле с надписью

Edit:

Подумав еще раз, есть другое решение:

<asp:Repeater runat="server">
    <HeaderTemplate>
        <table>
    </HeaderTemplate>
    <ItemTemplate>
        <tr>
            <td><asp:Checkbox runat="server" ID="checkbox" /></td>
            <td><asp:Label runat="server" AssociatedControlID="checkbox">Your text</asp:Label></td>
        </tr>
    </ItemTemplate>
    <FooterTemplate>
        </table>
    </FooterTemplate>
</asp:Repeater>

Примечания: Вы можете использовать Text-атрибут asp: Label-Element либо!

Answer 2

возможно, я не совсем понимаю, но почему бы вам не использовать html-атрибут "for" в теге label?

Как:

<label for="field_id">Checkbox 1</label>
<input id="field_id" type="checkbox" />

И это заставит флажок действовать как нажатый, если щелкнуть ярлык. Так что вам не нужно зависеть от JS, чтобы сделать это.

Edit: Если вы действительно хотите использовать для этого jQuery:

$('td').click(function(){
  $(':checkbox',this).attr('checked',!$(':checkbox',this).attr('checked'));
});

При необходимости измените 'td'.

Answer 3

Если вы используете одно из решений для кликов jQuery, убедитесь, что вы игнорируете события щелчка, инициированные самим флажком.

$('td').click(function(e){
    if (!$(e.target).is(':checkbox')) { // toggle only on non-checkbox click
        var checked = $(':checkbox', this).attr('checked');
        $(':checkbox', this).attr('checked', !checked); // toggle
    }
});

Answer 4

Как насчет этого?

$('.yourtableclass td').click( function( e ) {
    var cb = $(this).children('input[type=checkbox]').get(0);
    cb.checked = !cb.checked;
});