حذف GridView Row با جعبه تأیید جاوا اسکریپت با استفاده از رویداد CommandField و OnRowDeleting در ASP.Net
با سلام در این مقاله نحوه حذف سوابق یا سطرها از GridView با جعبه تأیید با استفاده از CommandField و RowDeleting را توضیح خواهیم داد
کد HTML
کد HTML زیر شامل یک GridView با دو ستون BoundField و یک ستون CommandField است.
<asp:GridView ID="GridView1" CssClass = "Grid" runat="server" OnRowDeleting="OnRowDeleting" AutoGenerateColumns = "false" OnRowDataBound = "OnRowDataBound">
<Columns>
<asp:BoundField DataField="Item" HeaderText="Item" />
<asp:BoundField DataField="Price" HeaderText="Price" />
<asp:CommandField ShowDeleteButton="True" ButtonType="Button" />
</Columns>
</asp:GridView>
اتصال به GridView
در داخل رویداد بارگذاری صفحه ، GridView با استفاده از DataTable جمع شده و DataTable در متغیر ViewState ذخیره می شود.
C #
protected void Page_Load(object sender, EventArgs e)
{
if (!Page.IsPostBack)
{
DataTable dt = new DataTable();
dt.Columns.AddRange(new DataColumn[2] { new DataColumn("Item"), new DataColumn("Price") });
dt.Rows.Add("Shirt", 450);
dt.Rows.Add("Jeans", 3200);
dt.Rows.Add("Trousers", 1900);
dt.Rows.Add("Tie", 185);
dt.Rows.Add("Cap", 100);
dt.Rows.Add("Hat", 120);
dt.Rows.Add("Scarf", 290);
dt.Rows.Add("Belt", 150);
ViewState["dt"] = dt;
BindGrid();
}
}
protected void BindGrid()
{
GridView1.DataSource = ViewState["dt"] as DataTable;
GridView1.DataBind();
}
VB.Net
Protected Sub Page_Load(sender As Object, e As EventArgs) Handles Me.Load
If Not Page.IsPostBack Then
Dim dt As New DataTable()
dt.Columns.AddRange(New DataColumn(1) {New DataColumn("Item"), New DataColumn("Price")})
dt.Rows.Add("Shirt", 450)
dt.Rows.Add("Jeans", 3200)
dt.Rows.Add("Trousers", 1900)
dt.Rows.Add("Tie", 185)
dt.Rows.Add("Cap", 100)
dt.Rows.Add("Hat", 120)
dt.Rows.Add("Scarf", 290)
dt.Rows.Add("Belt", 150)
ViewState("dt") = dt
BindGrid()
End If
End Sub
Protected Sub BindGrid()
GridView1.DataSource = TryCast(ViewState("dt"), DataTable)
GridView1.DataBind()
End Sub
استفاده از جعبه تأیید جاوا اسکریپت در دکمه GridView CommandField Delete
درون رویداد OnRowDataBound ، یک حلقه بر روی کنترل دکمه های GridView Cell اجرا می شود.اگر CommandName از دکمه حذف است ، اسکریپت JavaScript Confirmation Box به ویژگی OnClick اختصاص داده می شود.
C #
protected void OnRowDataBound(object sender, GridViewRowEventArgs e)
{
if (e.Row.RowType == DataControlRowType.DataRow)
{
string item = e.Row.Cells[0].Text;
foreach (Button button in e.Row.Cells[2].Controls.OfType<Button>())
{
if (button.CommandName == "Delete")
{
button.Attributes["onclick"] = "if(!confirm('Do you want to delete " + item + "?')){ return false; };";
}
}
}
}
VB.Net
Protected Sub OnRowDataBound(sender As Object, e As GridViewRowEventArgs)
If e.Row.RowType = DataControlRowType.DataRow Then
Dim item As String = e.Row.Cells(0).Text
For Each button As Button In e.Row.Cells(2).Controls.OfType(Of Button)()
If button.CommandName = "Delete" Then
button.Attributes("onclick") = "if(!confirm('Do you want to delete " + item + "?')){ return false; };"
End If
Next
End If
End Sub
حذف GridView با استفاده از رویداد CommandField و OnRowDeleting
با کلیک بر روی دکمه Delete ، رویداد OnRowDeleting اجرا می شود. در قسمت رویداد OnRowDeleting ، Index of GridView Row مشخص می شود و از آن برای حذف ردیف از جدول داده استفاده می شود.
سرانجام DataTable در ViewState ذخیره می شود و GridView دوباره جمع می شود.
C #
protected void OnRowDeleting(object sender, GridViewDeleteEventArgs e)
{
int index = Convert.ToInt32(e.RowIndex);
DataTable dt = ViewState["dt"] as DataTable;
dt.Rows[index].Delete();
ViewState["dt"] = dt;
BindGrid();
}
VB.Net
Protected Sub OnRowDeleting(sender As Object, e As GridViewDeleteEventArgs)
Dim index As Integer = Convert.ToInt32(e.RowIndex)
Dim dt As DataTable = TryCast(ViewState("dt"), DataTable)
dt.Rows(index).Delete()
ViewState("dt") = dt
BindGrid()
End Sub