Jquery doesnt work inside AJAX updatepanel..

Hi,

My jquery doesnt work inside AJAX update panel..
HELP....

Here's some code snippet..

<asp:UpdatePanel runat="server" id="UpdatePanel" updatemode="Conditional">
                            <Triggers>
                                    <asp:AsyncPostBackTrigger controlid="lnkNotifs" eventname="Click" />
                                    <asp:AsyncPostBackTrigger controlid="lnkMessages" eventname="Click" />
                                    <asp:AsyncPostBackTrigger controlid="lnkThreads" eventname="Click" />
                            </Triggers>
                            <ContentTemplate>
                                <asp:LinkButton ID="lnkNotifs" runat="server" CssClass="sbi-entertainment" style="font-size: 1.0em; color: white" onclick="ShowNewNotifs_Click"><span class="point"></span><em>27</em> Notifications</asp:LinkButton>
                                <asp:LinkButton ID="lnkMessages" runat="server" CssClass="sbi-entertainment" style="font-size: 1.0em; color: white" onclick="ShowNewMessages_Click"><span class="point"></span><em>27</em> Messages</asp:LinkButton>
                                <asp:LinkButton ID="lnkThreads" runat="server" CssClass="sbi-entertainment" style="font-size: 1.0em; color: white" onclick="ShowNewThreadsPost_Click"><span class="point"></span><em>27</em> Threads/Posts</asp:LinkButton>
                            
                            <br />
                            <div style="padding-top: 5px">
                                <asp:ListView ID="lstMSG" runat="server">
                                    <LayoutTemplate>
                                        <table style="border-top: 1px solid gray;" cellspacing="0" cellpadding="4" rules="all">
                                            <tbody>
                                                <asp:PlaceHolder ID="itemPlaceHolder" runat="server" />
                                            </tbody>
                                        </table>
                                    </LayoutTemplate>
                                    <ItemTemplate>
                                        <tr style="border-bottom-color: Gray; border-bottom-width: 1px; border-bottom-style: solid;">
                                            <td style="padding: 4px">
                                                <img style="vertical-align: top" alt="picImages" src="Upload/<%#Eval("strAvatar") %>" width="70px"  />
                                            </td>
                                            <td style="padding: 4px; width: 192px">
                                                    <div style="font-weight: bold; color: white">
                                                        <%#Eval("strFromUserName")%>
                                                    </div>
                                                    
                                                    <asp:LinkButton id="lnkShowUserMessageModal" class="overshow">  
                                                    <div style="font-weight: normal; color: gray">
                                                        <%#Eval("strMessage")%>
                                                    </div>
                                                    </asp:LinkButton>
                                                                                 
                                            </td>
                                        </tr>
                                    </ItemTemplate>
                                    <EmptyDataTemplate>
                                        <div>
                                            No Message...
                                        </div>
                                    </EmptyDataTemplate>
                                </asp:ListView>
                                <br />
                                <asp:Label ID="Label4" runat="server" Font-Size="Small" Font-Bold="true" ForeColor="white"
                                    Width="280px" Style="text-align: center">See All Messages</asp:Label><br />
                            </div>

                                </ContentTemplate>
                            </asp:UpdatePanel>

The underline part "<asp:Linkbutton id="lnkShowUserMessageModal" class="overshow">" is calling a Jquery...

<script type="text/javascript">

        $(document).ready(function () {
            $("#lnkShowUserMessageModal").click(function (e) {
                ShowDialog_UserMessage(true);
                e.preventDefault();
            });
......................................

I WANT TO ACHIEVE.. clicking the link button will show a jquery overlay.... and so on...

Re: Jquery doesnt work inside AJAX updatepanel..

Kurai
<asp:Linkbutton id="lnkShowUserMessageModal" class="overshow">

I'm not sure why it is not having runat="server" attribute. if it has then check for generated ID and make sure you've the same ID in your Jquery code. I also suggest you to check out this thread.

Re: Jquery doesnt work inside AJAX updatepanel..

Hi,

Try this-

$(document).ready(function () {
            $("a[id*=lnkShowUserMessageModal]").live("click", function (e) {
                ShowDialog_UserMessage(true);
                e.preventDefault();
            });