CODEWITHSUNDEEP
jqueryfindaccordion
Dean.DePue
Dean.DePue

Reputation: 1013

Cannot ID of element in DIV of jQuery accordion

My accordion looks like this:

 @for (int i = 0; i < Model.Count; i++)
        {
            <h3 id= '@Model[i].UserId'>@Model[i].UserName</h3>
            <div >
                @Html.HiddenFor(x => Model[i].UserId, new { @id = "txtId" + i })
                <table style="font-size:xx-small">
                    <tr>
                         <td>
                                            <img id='img + @Model[i].UserId' alt="" class="image" />
                                        </td>

This establishes the id for image element different from the ID of the H3 header. I can get the ID of the header like this:

 $("#accordion > h3").click(function () {
        var currentID = $('.ui-accordion-header-active').attr('id');
        var divid = "#" + currentID;
        var imgId = $(divid).find(".image").attr("id");
        imgId = $('.ui-accordion-header-active .image').attr("id");
        alert(imgId);
    });

But I just cannot get the ID of image element. What am I doing wrong? I do not want to load any picture until the person is clicked in the accordion.

Upvotes: 0

Views: 219

Answers (1)

Guruprasad J Rao
Guruprasad J Rao

Reputation: 29683

You are using .find to get the id of the image where as .find tries to get the children of the selector referred. So you need to add one more .next to get children from that div as below, since .image rests inside div next to your header:

$("#accordion > h3").click(function () {
        var currentID = $('.ui-accordion-header-active').attr('id');
        var divid = "#" + currentID;
        var imgId = $(divid).next().find(".image").attr("id"); //.next here
        alert(imgId);
});

Again even the below line tries to find for children .image inside header

imgId = $('.ui-accordion-header-active .image').attr("id");

and I don't think you need this anymore in the above event so I just removed it..

Upvotes: 1

Related Questions