CODEWITHSUNDEEP
jqueryasp.netvb.net
jack
jack

Reputation: 135

jquery and asp.net gridview help

I have a grid with a link and what I want to achieve is when the link is clicked, to open a modal window. My modal is working properly. I'm just having issue with getting the link to do something. Below is my example code.

ASPX:

<asp:GridView AutoGenerateColumns="False" Width="100%" ID="grvUsers" runat="server">
    <Columns>
        <asp:TemplateField HeaderText="Delete">
            <ItemTemplate>
                <asp:LinkButton ID="Label1" runat="server" Text='<%# eval("ID") %>'></asp:LinkButton>
            </ItemTemplate>
        </asp:TemplateField>
    </Columns>
</asp:GridView>

HTML render:

<table cellspacing="0" rules="all" border="1" id="grvUsers" style="width: 100%; border-collapse: collapse;">
    <tr>
        <th scope="col">Delete</th>
    </tr>
    <tr>
        <td>
            <span id="grvUsers_Label1_0">23</span>
        </td>
    </tr>
</table>

jQuery:

$(document).ready(function(){
    $('td:nth-col(0)').click(function(){
        alert("OMG");
    });
});

Upvotes: 1

Views: 816

Answers (2)

Andres
Andres

Reputation: 2023

  1. You can just use ajax for the modal popup, works a whole lot better than using jquery library(there are exceptions..)

  2. You can use the a select command field as a delete and handle the event in your SelectIndexchanging or Delete either one.

Add this to your gridview

<asp:CommandField HeaderText="Delete" ButtonType="Link" ShowSelectButton="true"
SelectText='<%# eval("ID") %>' />

Codebehind:

protected void mygridview_SelectedIndexChanging(object sender, GridViewSelectEventArgs e)
{
        //here you can do anything with the id
        string id = mygridview.Rows[e.NewSelectedIndex].Cells[1].Text;

        mdlPopup.Show();
}

Ajax popup:

<asp:Button id="btnShowPopup" runat="server" style="display:none" />
<ajaxToolkit:ModalPopupExtender
ID="mdlPopup" 
runat="server" 
TargetControlID="btnShowPopup" 
PopupControlID="pnlPopup" 
CancelControlID="btnClose" 
BackgroundCssClass="Inactive" />
<asp:Panel ID="pnlPopup" runat="server" Width="500px" style="display:none;">
  <!--here you put any content that will go inside your popup-->
</asp:Panel>

Upvotes: 0

BentOnCoding
BentOnCoding

Reputation: 28228

Instead of trying to add the event with js can you just use : 

<asp:LinkButton ID="Label1" onClick="myAlertFunction();" runat="server" Text='<%# eval("ID") %>'></asp:LinkButton>

I would recommend you check out this jquery documentation: Jquery Dialog w/Modal

Upvotes: 1

Related Questions