I try to delete data that display in GridView after confirm it using twitter bootstrap. my gridview with modal-dialog as follow
<div class="panel panel-default">
<div class="panel-heading">
<h2 class="panel-title clearfix ">
<div>
<b>Name</b>
<div style="float: left;">
</div>
</div>
</h2>
</div>
<div class="panel-body">
<div>
<asp:GridView ID="gridView" DataKeyNames="Id" runat="server"
CssClass="table table-striped table-bordered table-hove"
AutoGenerateColumns="False" HeaderStyle-Font-Bold="true"
OnRowEditing="gridView_RowEditing"
OnRowCancelingEdit="gridView_RowCancelingEdit"
OnRowUpdating="gridView_RowUpdating"
OnRowDeleting="gridView_RowDeleting"
OnRowCommand="gridView_RowCommand">
<Columns>
<asp:TemplateField HeaderText="ID" ControlStyle-Width="0px">
<ItemTemplate>
<asp:Label ID="txtid" runat="server" Text='<%#Eval("Id") %>' />
</ItemTemplate>
<EditItemTemplate>
<asp:Label ID="lblid" runat="server" Width="40px" Text='<%#Eval("Id") %>' />
</EditItemTemplate>
<FooterTemplate>
</FooterTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Name">
<ItemTemplate>
<asp:Label ID="lblLName" runat="server" Text='<%#Eval("Location_name") %>' />
</ItemTemplate>
<EditItemTemplate>
<asp:TextBox ID="txtLName" CssClass="form-control" runat="server" Text='<%#Eval("Location_name") %>' />
</EditItemTemplate>
<FooterTemplate>
<asp:TextBox ID="LocName" AutoCompleteType="Disabled" runat="server" />
<asp:RequiredFieldValidator ID="ReqBrName" runat="server" ControlToValidate="BrName" Display="Dynamic" CssClass="valid" ErrorMessage="?" ValidationGroup="validaiton" />
</FooterTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Options">
<ItemTemplate>
<asp:LinkButton ID="lbEdit" CssClass="btn btn-default btn-sm " runat="server" CommandName="Edit">
<span class="glyphicon glyphicon-edit" aria-hidden="true"></span> Edit</asp:LinkButton>
<asp:LinkButton ID="lbDelete" CssClass="btn btn-default btn-sm " runat="server" CommandArgument='<%#Eval("Id")%>' OnClientClick="return ConfirmDelete()">
<span class="glyphicon glyphicon-trash" aria-hidden="true"></span> Delete</asp:LinkButton>
<%-- Delete Form --%>
<div class="modal fade" id="DeleteModal" tabindex="-1" role="dialog" aria-labelledby="delete" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close glyphicon glyphicon-remove" data-dismiss="modal" aria-hidden="true"></button>
<h4 class="modal-title" id="">Delete the data</h4>
</div>
<div class="modal-body">
Are You sure?
<asp:Label ID="lblLName1" runat="server" Text='<%#Eval("id") %>' />
<br />
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default glyphicon glyphicon-remove" data-dismiss="modal">Cancel</button>
<asp:LinkButton ID="lbde" CssClass="btn btn-default btn-sm " runat="server" CommandName="Delete">
<span class="glyphicon glyphicon-trash" aria-hidden="true"></span> Delete
</asp:LinkButton>
</div>
</div>
</div>
</div>
<%-- Delete Form --%>
</ItemTemplate>
<EditItemTemplate>
<asp:LinkButton ID="lbUpdate" CssClass="btn btn-default btn-sm " runat="server" CommandName="Update">
<span class="glyphicon glyphicon-refresh" aria-hidden="true"></span> Update
</asp:LinkButton>
<asp:LinkButton ID="lbCancel" CssClass="btn btn-default btn-sm " runat="server" CommandName="Cancel">
<span class="glyphicon glyphicon-remove-sign" aria-hidden="true"></span> Cancel
</asp:LinkButton>
</EditItemTemplate>
<FooterTemplate>
</FooterTemplate>
</asp:TemplateField>
</Columns>
<HeaderStyle Font-Bold="True"></HeaderStyle>
</asp:GridView>
</div>
</div>
</div>
and my JavaScript function is
<script>
function ConfirmDelete() {
$('#DeleteModal').modal()
return false;
}
</script>
so when I try to delete the record by using the popup model it’s not working, the model will work fine but the data in lblLName1 allows will be the first record ID so when I confirm the first record will be deleted
could anyone helps me in that??
2
Answers
Thanks everyone
after trying several ways I found the solution.
first, change the calling button from
to
and in c# call function under lbDelete_Command
and I edit the fields under modal-body division like follow
I use the hidden field hf_Del_ID for delete purpose
and the label lb_Del_Name for display only
and also the deleting SQL in C# as follow
I hope the solution helps
Thanks
this works for me… very easy