Access asp element in a repeater via javascript

Question

The Scenario:

I have a form in which I register people. I have a button "Add more people". The repeater has ran 4 times on Page_Load and all the controls is already on the page(they are just hidden). When I click the button I find the first hidden div and just show it.

The Problem:

Now I need to do stuff with a speciffic element in a speciffic div generated by the repeater (for example change it's class). However I don't know how to access it. Access by Id doesn't work and neither does access by class. I can't do anything from the code behind becaus everything is already on the page. It has to be done in javascript. Any ideas?

The code:

<asp:Repeater ID="rptOtherPeople" runat="server">
        <HeaderTemplate>
                 <h3>Other people</h3>
        </HeaderTemplate>
        <ItemTemplate>
            <div class="GridRow" id="personRow" style="display: none">           
                    <dl>
                        <dt class="form-lbl left">Name</dt>
                        <dd class="form-value left">
                            <asp:TextBox ID="txtFirstName" CssClass="mid-inp required" Text="" runat="server"></asp:TextBox>
                        </dd>
                    </dl>
                    <div class="clear"></div>
                    <div class="separator"></div>
          </div>
        </ItemTemplate>
        <FooterTemplate> </FooterTemplate>
    </asp:Repeater>

The javascript that shows the next row:

 var peopleNum = 1;
$(document).ready(function () {
    for (i = 0; i < peopleNum; i++) {
        $(".GridRow").each(function (index) {
            if (index == i)
                $(this).show();
        });
    }
})

function addPerson() {
    peopleNum++;
    $(".GridRow").each(function (index) {
        if (index == peopleNum-1)
            $(this).show();
    });
}

user2940223 · Accepted Answer · 2013-11-26 07:53:46Z

2

Could you be some what clear ?? when will you wish to change the CSS or any other stuff?? We can handle repeater in Jquery

Example:

$("[id*=txtFirstName]").change(function () {
         // This displays the text from the Tag element of the button...    
                $(this).css("background", "red");
            });

answered Nov 26, 2013 at 7:53

user2940223

466 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

panky sharma Over a year ago

good answer..but could you explain it a bit more..What is [id*= (I guess its searching the id in page (for each?)

user2940223 Over a year ago

Yes It will get all the id's in our page which contains string txtFirstName

user2940223 Over a year ago

It is like Attribute:value.[] represent syntax. Check this link once api.jquery.com/attribute-contains-selector

bresleveloper · Accepted Answer · 2013-11-26 07:45:03Z

0

well you have some options, 1st is using the IDs to find the array of elements like this

$($( "input[id*='txtFirstName']" )[i]).addClass("myNewClass")

this means all elements that their id contains txtFirstName.

another is select by your grid:

$($(".GridRow")[i]).find(".mid-inp").addClass("myNewClass")

answered Nov 26, 2013 at 7:45

bresleveloper

6,0843 gold badges35 silver badges50 bronze badges

Comments

Vahid Taghizadeh · Accepted Answer · 2013-11-26 07:46:32Z

0

Check this :

$($(".GridRow")[i]).addClass("Yourclass");

answered Nov 26, 2013 at 7:46

Vahid Taghizadeh

9978 silver badges9 bronze badges

Collectives™ on Stack Overflow

Access asp element in a repeater via javascript

3 Answers 3

3 Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

3 Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related