oJM86o
oJM86o

Reputation: 2118

Getting id of image button inside gridview using jquery

I want to get the id of an image button inside of a gridview that is inside an updatepanel.

 $("<%# gvLineItems.ClientID %> tr img[id*='ibDelete']").click(function() {
                                                                alert('hi');
                                                                $(this).fadeOut(1000, function() {
                                                                    $(this).remove();
                                                                });       
                                                         });

What I want to do is upon clicking a delete button I want to fade the row out of my grid view then completly remove it.

This is not workign but is not throwing any errors. I have this inside of $(document).ready()

Does anyone know what I am doing incorrectly?

Upvotes: 1

Views: 5612

Answers (2)

James Hill
James Hill

Reputation: 61802

It appears that you're grabbing the client id of the control incorrectly. Try this:

$("#" + "<%# gvLineItems.ClientID %> tr").find('#ibDelete').click(...)

EDIT:

Per our discussion in chat:

$(".TempName").click(function() { 
    $(this).closest("tr").fadeOut(10000, function() { 
        $(this).remove(); 
    }); 
});

Upvotes: 1

vvohra87
vvohra87

Reputation: 5664

Firstly you have a small typo - remove the # from the asp script snippet as follows

$("#" + "<%= gvLineItems.ClientID %> tr img[id*='ibDelete']")

You cannot bind an event to an element with the same id, even if it is in a different container.

$("<%# gvLineItems.ClientID %> tr img[id*='ibDelete']")

id="ibDelete" is a NO-NO.

Just change this to a class definition on the image and call it using 'img[class=lbDelete]'.

Finally, when you are usng inline scripting anywhere in the page, the operator '#' or '=' mean different things in terms of when and how they are executed. But like you pointed out, you will get an error when a client side script tries to use inline script tag content which is generated on the fly.

To resolve this, simple put the entire script tag into a server side control as such:

<div runat="server">
    <script type="text/javascript">
        .....
    </script>
</div>

Lemme know if you need anymore help, Cheers!

Upvotes: 1

Related Questions