Hi Chriz,
I have update the code please check it.
HTML
<script type='text/javascript'>
function OpenModal() {
$('[id*=myModal]').modal('show');
}
</script>
<asp:GridView ID="gvCustomers" runat="server" AutoGenerateColumns="false" ShowFooter="true"
AllowPaging="True" PageSize="10">
<Columns>
<asp:TemplateField Visible="true">
<ItemTemplate>
<asp:HiddenField runat="server" ID="hfId" Value='<%# Bind("Id") %>' />
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Name">
<ItemTemplate>
<asp:Label ID="lblName" runat="server" Text='<%# Bind("Name") %>'></asp:Label>
</ItemTemplate>
<EditItemTemplate>
<asp:TextBox ID="txtName" CssClass="form-control" runat="server" Text='<%# Bind("Name") %>'></asp:TextBox>
</EditItemTemplate>
<FooterTemplate>
<asp:TextBox ID="txtName" runat="server" />
</FooterTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Country">
<ItemTemplate>
<asp:Label ID="lblValue" runat="server" Text='<%# Bind("Country") %>'></asp:Label>
</ItemTemplate>
<EditItemTemplate>
<asp:TextBox ID="txtValue" CssClass="form-control" runat="server" Text='<%# Bind("Country") %>'></asp:TextBox>
</EditItemTemplate>
<FooterTemplate>
<asp:TextBox ID="txtCountry" CssClass="form-control" Width="50px" runat="server"></asp:TextBox>
</FooterTemplate>
</asp:TemplateField>
<asp:TemplateField ItemStyle-Width="150">
<ItemTemplate>
<asp:Button ID="btnModal" runat="server" Text="Edit" OnClick="btnModal_Click" />
</ItemTemplate>
<FooterTemplate>
<asp:Button ID="btnAdd" Text="Add" runat="server" OnClick="OnInsert" />
</FooterTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
</div>
<div class="modal fade" id="myModal" tabindex="-1" role="dialog">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span></button>
<h5 class="modal-title">
Modal</h5>
</div>
<div class="modal-body">
<table>
<tr>
<td style="padding: 5px">
<asp:Label ID="lblID" runat="server" Text="ID"></asp:Label>
</td>
<td style="padding: 5px">
<asp:Label ID="lblIndex" Text='<%# Eval("Id") %>' runat="server" />
</td>
</tr>
<tr>
<td style="padding: 5px">
<asp:Label ID="lblName" runat="server" Text="Name"></asp:Label>
</td>
<td style="padding: 5px">
<asp:TextBox ID="txtName" Text='<%# Eval("Name") %>' Width="100px" CssClass="form-control"
runat="server"></asp:TextBox>
</td>
</tr>
<tr>
<td style="padding: 5px">
<asp:Label ID="lblCountry" runat="server" Text="Country"></asp:Label>
</td>
<td style="padding: 5px">
<asp:TextBox ID="txtCountry" Text='<%# Eval("Country") %>' Width="100px" CssClass="form-control"
runat="server"></asp:TextBox>
</td>
</tr>
</table>
</div>
<div class="modal-footer">
<asp:Button ID="btnOK" Text="Update" OnClick="OnUpdate" CssClass="form-control" runat="server" />
<asp:Button ID="btnCancel" Text="Cancel" CssClass="form-control" data-dismiss="modal"
runat="server" />
</div>
</div>
</div>
Namespaces
C#
using System.Data;
VB.Net
Imports System.Data
Code
C#
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
DataTable dt = new DataTable();
dt.Columns.AddRange(new DataColumn[3] { new DataColumn("Id"), new DataColumn("Name"), new DataColumn("Country") });
dt.Rows.Add(1, "John Hammond", "United States");
dt.Rows.Add(2, "Mudassar Khan", "India");
dt.Rows.Add(3, "Suzanne Mathews", "France");
dt.Rows.Add(4, "Robert Schidner", "Russia");
dt.Rows.Add(5, "Rohit", "India");
ViewState["dt"] = dt;
this.BindGrid();
}
}
protected void BindGrid()
{
gvCustomers.DataSource = ViewState["dt"] as DataTable;
gvCustomers.DataBind();
}
protected void OnInsert(object sender, EventArgs e)
{
DataTable dt = ViewState["dt"] as DataTable;
GridViewRow row = ((sender as Button).NamingContainer as GridViewRow);
string name = (gvCustomers.FooterRow.FindControl("txtName") as TextBox).Text;
string country = (gvCustomers.FooterRow.FindControl("txtCountry") as TextBox).Text;
dt.Rows.Add("",name, country);
ViewState["dt"] = dt;
this.BindGrid();
}
protected void gvCustomers_RowEditing(object sender, GridViewEditEventArgs e)
{
gvCustomers.EditIndex = e.NewEditIndex;
this.BindGrid();
}
protected void gvCustomers_RowUpdating(object sender, GridViewUpdateEventArgs e)
{
GridViewRow row = (GridViewRow)gvCustomers.Rows[e.RowIndex];
string name = (row.FindControl("txt1") as TextBox).Text;
string country = (row.FindControl("txtValue") as TextBox).Text;
DataTable dt = ViewState["dt"] as DataTable;
dt.Rows[row.RowIndex]["Name"] = name;
dt.Rows[row.RowIndex]["Country"] = country;
ViewState["dt"] = dt;
gvCustomers.EditIndex = -1;
this.BindGrid();
}
protected void btnModal_Click(object sender, EventArgs e)
{
GridViewRow row = ((sender as Button).NamingContainer as GridViewRow);
lblIndex.Text = (row.FindControl("hfId") as HiddenField).Value;
txtName.Text = (row.FindControl("lblName") as Label).Text;
txtCountry.Text = (row.FindControl("lblValue") as Label).Text;
ClientScript.RegisterStartupScript(this.GetType(), "Pop", "OpenModal();", true);
}
protected void OnUpdate(object sender, EventArgs e)
{
DataTable dt = ViewState["dt"] as DataTable;
string id = lblIndex.Text;
string name = txtName.Text;
string country = txtCountry.Text;
foreach (DataRow dr in dt.Rows)
{
if (dr["Id"].ToString() == id)
{
dr["Name"] = name;
dr["Country"] = country;
}
dt.AcceptChanges();
}
ViewState["dt"] = dt;
this.BindGrid();
}
VB.Net
Protected Sub Page_Load(ByVal sender As Object, ByVal e As EventArgs) Handles Me.Load
If Not IsPostBack Then
Dim dt As DataTable = New DataTable()
dt.Columns.AddRange(New DataColumn(2) {New DataColumn("Id"), New DataColumn("Name"), New DataColumn("Country")})
dt.Rows.Add(1, "John Hammond", "United States")
dt.Rows.Add(2, "Mudassar Khan", "India")
dt.Rows.Add(3, "Suzanne Mathews", "France")
dt.Rows.Add(4, "Robert Schidner", "Russia")
dt.Rows.Add(5, "Rohit", "India")
ViewState("dt") = dt
Me.BindGrid()
End If
End Sub
Protected Sub BindGrid()
gvCustomers.DataSource = TryCast(ViewState("dt"), DataTable)
gvCustomers.DataBind()
End Sub
Protected Sub OnInsert(ByVal sender As Object, ByVal e As EventArgs)
Dim dt As DataTable = TryCast(ViewState("dt"), DataTable)
Dim row As GridViewRow = (TryCast((TryCast(sender, Button)).NamingContainer, GridViewRow))
Dim name As String = (TryCast(gvCustomers.FooterRow.FindControl("txtName"), TextBox)).Text
Dim country As String = (TryCast(gvCustomers.FooterRow.FindControl("txtCountry"), TextBox)).Text
dt.Rows.Add("",name, country)
ViewState("dt") = dt
Me.BindGrid()
End Sub
Protected Sub gvCustomers_RowEditing(ByVal sender As Object, ByVal e As GridViewEditEventArgs)
gvCustomers.EditIndex = e.NewEditIndex
Me.BindGrid()
End Sub
Protected Sub gvCustomers_RowUpdating(ByVal sender As Object, ByVal e As GridViewUpdateEventArgs)
Dim row As GridViewRow = CType(gvCustomers.Rows(e.RowIndex), GridViewRow)
Dim name As String = (TryCast(row.FindControl("txt1"), TextBox)).Text
Dim country As String = (TryCast(row.FindControl("txtValue"), TextBox)).Text
Dim dt As DataTable = TryCast(ViewState("dt"), DataTable)
dt.Rows(row.RowIndex)("Name") = name
dt.Rows(row.RowIndex)("Country") = country
ViewState("dt") = dt
gvCustomers.EditIndex = -1
Me.BindGrid()
End Sub
Protected Sub btnModal_Click(ByVal sender As Object, ByVal e As EventArgs)
Dim row As GridViewRow = (TryCast((TryCast(sender, Button)).NamingContainer, GridViewRow))
lblIndex.Text = (TryCast(row.FindControl("hfId"), HiddenField)).Value
txtName.Text = (TryCast(row.FindControl("lblName"), Label)).Text
txtCountry.Text = (TryCast(row.FindControl("lblValue"), Label)).Text
ClientScript.RegisterStartupScript(Me.[GetType](), "Pop", "OpenModal();", True)
End Sub
Protected Sub OnUpdate(ByVal sender As Object, ByVal e As EventArgs)
Dim dt As DataTable = TryCast(ViewState("dt"), DataTable)
Dim id As String = lblIndex.Text
Dim name As String = txtName.Text
Dim country As String = txtCountry.Text
For Each dr As DataRow In dt.Rows
If dr("Id").ToString() = id Then
dr("Name") = name
dr("Country") = country
End If
dt.AcceptChanges()
Next
ViewState("dt") = dt
Me.BindGrid()
End Sub
