Display ASP.Net GridView row details in AJAX Modal Popup Extender on LinkButton Click using C# and VB.Net

Last Reply 7 months ago By pandeyism

Posted 7 months ago

sir , 

i use this code in my page where i need click linkbutton and get the cell value in modal pop textbox

Use AJAX Modal Popup Extender inside GridView in ASP.Net

my aspx code is 

<div>
    <style>
        .example-modal .modal
        {
            position: relative;
            top: auto;
            bottom: auto;
            right: auto;
            left: auto;
            display: block;
            z-index: 1;
        }
        .example-modal .modal
        {
            background: transparent !important;
        }
    </style>
    <div class="row">
        <div class="col-md-12">
            <div class="box box-primary">
                <div class="box-header with-border">
                    <h3 class="box-title">
                        List E-Pin Request</h3>
                </div>
                <div class="box-body">
                    <div class="form-group" align="center" style="height: 650PX; overflow: scroll">
                        <asp:ScriptManager ID="ScriptManager1" runat="server">
                        </asp:ScriptManager>
                        <asp:UpdatePanel ID="UpdatePanel1" runat="server">
                            <ContentTemplate>
                                <asp:GridView ID="GridView1" runat="server" CssClass="table table-hover" EmptyDataText="No Record Found"
                                    DataKeyNames="Id" AllowPaging="True" AllowSorting="True" AutoGenerateColumns="False"
                                    OnPageIndexChanging="OnPageIndexChanging" GridLines="None">
                                    <Columns>
                                        <asp:TemplateField HeaderText="S.No" ItemStyle-Width="50">
                                            <ItemTemplate>
                                                <asp:Label ID="lblRowNumber" Text='<%# Container.DataItemIndex + 1 %>' runat="server" />
                                            </ItemTemplate>
                                            <ItemStyle Width="50px"></ItemStyle>
                                        </asp:TemplateField>
                                        <asp:TemplateField HeaderText="Request Id" ItemStyle-Width="70">
                                            <ItemTemplate>
                                                <asp:Label ID="lblreqId" Text='<%# Eval("id") %>' runat="server" />
                                            </ItemTemplate>
                                            <ItemStyle Width="70px"></ItemStyle>
                                        </asp:TemplateField>
                                        <asp:TemplateField HeaderText="User Id" ItemStyle-Width="100">
                                            <ItemTemplate>
                                                <asp:Label ID="lbluserid" runat="server" readOnly="true" Text='<%# Eval("User_id") %>'></asp:Label>
                                            </ItemTemplate>
                                            <ItemStyle Width="100px"></ItemStyle>
                                        </asp:TemplateField>
                                        <asp:TemplateField HeaderText="Deposite Amount" ItemStyle-Width="130">
                                            <ItemTemplate>
                                                <asp:Label ID="lblamt" runat="server" readOnly="true" Text='<%# Eval("Deposite_amount") %>'></asp:Label>
                                            </ItemTemplate>
                                            <ItemStyle Width="130px"></ItemStyle>
                                        </asp:TemplateField>
                                        <asp:TemplateField HeaderText="Request Date" ItemStyle-Width="100">
                                            <ItemTemplate>
                                                <asp:Label ID="lblrdate" runat="server" readOnly="true" Text='<%# Eval("Request_Date") %>'></asp:Label>
                                            </ItemTemplate>
                                            <ItemStyle Width="100px"></ItemStyle>
                                        </asp:TemplateField>
                                        <asp:BoundField DataField="Request_Status" HeaderText="Request Status" ItemStyle-Width="100"
                                            SortExpression="Request_Status" ReadOnly="true" />
                                        <asp:TemplateField HeaderText="Remark" ItemStyle-Width="200">
                                            <ItemTemplate>
                                                <asp:Label ID="lblremark" runat="server" readOnly="true" Text='<%# Eval("Remark") %>'></asp:Label>
                                            </ItemTemplate>
                                            <ItemStyle Width="200px"></ItemStyle>
                                        </asp:TemplateField>
                                        <asp:TemplateField ItemStyle-Width="30px" HeaderText="E-Pin">
                                            <ItemTemplate>
                                                <asp:LinkButton ID="lnkEdit" runat="server" Text="Generate" OnClick="Edit"></asp:LinkButton>
                                            </ItemTemplate>
                                        </asp:TemplateField>
                                    </Columns>
                                </asp:GridView>
                                <asp:Panel ID="pnlAddEdit" runat="server" CssClass="modalPopup" Style="display: none">
                                    <div class="example-modal">
                                        <div class="modal modal-primary">
                                            <div class="modal-dialog">
                                                <div class="modal-content">
                                                    <div class="modal-header">
                                                        <h4 class="modal-title">
                                                            Generate E-Pin</h4>
                                                    </div>
                                                    <div class="modal-body">
                                                        <div class="row">
                                                            <div class="col-md-6">
                                                                <div class="form-group">
                                                                    <asp:TextBox ID="txtuserid" runat="server" CssClass="form-control" ReadOnly="true"></asp:TextBox>
                                                                </div>
                                                                <div class="form-group">
                                                                    <asp:TextBox ID="txtamt" runat="server" CssClass="form-control" ReadOnly="true"></asp:TextBox>
                                                                </div>
                                                                <div class="form-group">
                                                                    <asp:DropDownList ID="DDLpack" runat="server" CssClass="form-control">
                                                                    </asp:DropDownList>
                                                                    <asp:RequiredFieldValidator ID="RequiredFieldValidator2" runat="server" ForeColor="Red"
                                                                        ErrorMessage="select Package" ControlToValidate="DDLpack" InitialValue="Select Package"
                                                                        ValidationGroup="validateformregis"></asp:RequiredFieldValidator>
                                                                </div>
                                                            </div>
                                                            <div class="col-md-6">
                                                                <div class="form-group">
                                                                    <asp:TextBox ID="txtreqid" runat="server" CssClass="form-control" ReadOnly="true"></asp:TextBox>
                                                                </div>
                                                                <div class="form-group">
                                                                    <div class="input-group">
                                                                        <div class="input-group-addon">
                                                                            <i class="fa fa-calendar"></i>
                                                                        </div>
                                                                        <asp:TextBox ID="txtdt" runat="server" CssClass="form-control" placeholder="Request Date mm/dd/yyyy"
                                                                            ReadOnly="true"></asp:TextBox>
                                                                    </div>
                                                                </div>
                                                                <div class="form-group">
                                                                    <asp:TextBox ID="txtpinno" runat="server" CssClass="form-control" placeholder="Enter No of Pins"></asp:TextBox>
                                                                </div>
                                                                <asp:Button ID="Button1" runat="server" CssClass="btn btn-primary pull-right " Text="Generate"
                                                                    OnClick="generate" />
                                                            </div>
                                                        </div>
                                                        <div class="modal-footer">
                                                            <asp:Button ID="btnCancel" runat="server" CssClass="btn btn-default pull-left" Text="Cancel"
                                                                OnClientClick="return Hidepopup()" />
                                                            <asp:Button ID="btnSave" runat="server" CssClass="btn btn-primary" Text="save" OnClick="Save" />
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                </asp:Panel>
                                <asp:LinkButton ID="lnkFake" runat="server"></asp:LinkButton>
                                <asp:ModalPopupExtender ID="popup" runat="server" DropShadow="false" PopupControlID="pnlAddEdit"
                                    TargetControlID="lnkFake" BackgroundCssClass="modalBackground">
                                </asp:ModalPopupExtender>
                            </ContentTemplate>
                            <Triggers>
                                <asp:AsyncPostBackTrigger ControlID="GridView1" />
                                <asp:AsyncPostBackTrigger ControlID="btnSave" />
                                <asp:AsyncPostBackTrigger ControlID="GridView2" />
                                <asp:AsyncPostBackTrigger ControlID="Button1" />
                            </Triggers>
                        </asp:UpdatePanel>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

and my code behind is 

    Protected Sub Edit(ByVal sender As Object, ByVal e As EventArgs)
        Dim row As GridViewRow = CType(CType(sender, LinkButton).Parent.Parent, GridViewRow)
        txtreqid.Text = row.Cells(1).Text
        txtuserid.Text = row.Cells(2).Text
        txtamt.Text = row.Cells(3).Text
        txtdt.Text = row.Cells(4).Text
        getpack()
        popup.Show()
    End Sub

 

This question does not have replies that have been liked.