Use .Net-Repeater with jquery

Question

I have a Repeater (ASP.Net).

<asp:Repeater ID="rep" runat="server">
<ItemTemplate>
<asp:TextBox runat="server" ID="txt"></asp:TextBox>
<asp:CheckBox runat="server" ID="cb" />
</ItemTemplate>

I would like to write Text in the text-box if I click on the checkbox, using jQuery. Is this possible and how.

Answer 1

Yes, it is. One possibility is the approach by the server:

On the Load Event (in the server) of the CheckBox, you can do the following:

void checkBox_Load(object sender, EventArgs e)
{
     CheckBox chk = (CheckBox) sender;
     TextBox txt = (TextBox) chk.Parent.FindControl("txt");
     chk.Attributes.Add("onclick",
                          string.Format("$(\"#{0}\").val('{1}');", txt.ClientID, "newValue");
}

EDIT: It was missing the # in the jQuery selector.

Answer 2

Using jQuery, you can use the ID selector to select the DOM elements with the ID="txt" that you have specified. http://api.jquery.com/id-selector/

You can then update the .text() attribute of those elements. http://api.jquery.com/text/

Something like this should work in the simplest fashion:

$("#txt").text("some new text");

Answer 3

I'd recommend simply using a CSS class and using that to identify the TextBox:

<asp:Repeater ID="rep" runat="server">
  <ItemTemplate>
    <asp:TextBox runat="server" ID="txt"></asp:TextBox>
    <asp:CheckBox runat="server" ID="cb" CssClass="repCheck" />
  </ItemTemplate>

And then:

$('.repCheck').change(function(){
    // via Andre
    $(this).siblings('input[type="text"]').first().val("clicked");
});

Answer 4

You'll have to post the html output to get a working code, but it is something like this:

$(function(){
    $('#<%=rep.ClientID  %> input[type="checkbox"]').each(function(){
        $(this).change(function(){
            $(this).siblings('input[type="text"]').first().val("clicked");
        });
    });
});