Our fully-featured DataGrid
Selecting & deleting multiple items will definitely be set up quite differently than any other type of .NET DataGrid deleting you probably have seen. However, we'll still follow the same logical flow of deletion, and we'll still confirm any delete actions about to take place after we have selected all our items. Much of the magic in making this work is really going to come from client-side JavaScript, that is ultimately responsible for wiring up our main "select all" checkbox to handle the selecting and deselecting of our checkboxes. Also, included is our server-side delete method that erases our data, and a DataGrid refresher method to rebind our DataGrid after we have completed our data deletion.
Have a look at Figure 1 to get an idea of what your DataGrid will look like:
Figure 1
Here is the code to set up our DataGrid:
<form runat="server" ID="Form1">
<h3>Selecting, Confirming & Deleting Multiple Checkbox Items In A DataGrid
(i.e. HotMail & Yahoo)</h3>
<br>
<ASP:DataGrid id="MyDataGrid" runat="server" Width="700" BackColor="white" BorderColor="black"
CellPadding="3" CellSpacing="0" Font-Size="9pt" AutoGenerateColumns="False" HeaderStyle-BackColor="darkred"
HeaderStyle-ForeColor="white">
<Columns>
<asp:TemplateColumn>
<HeaderTemplate>
<asp:CheckBox ID="CheckAll" OnClick="javascript: return select_deselectAll (this.checked, this.id);"
runat="server" />
<font face="Webdings" color="white" size="4">a</font>
</HeaderTemplate>
<ItemTemplate>
<asp:CheckBox ID="DeleteThis" OnClick="javascript: return select_deselectAll (this.checked, this.id);"
runat="server" />
</ItemTemplate>
</asp:TemplateColumn>
// ... Rest of our Custom Template & Bound Columns
</Columns>
</form>
The code listed above is what makes our DataGrid set up behave just like the grids on Hotmail and Yahoo. Our .NET DataGrid will have the same functionality and options available for selecting however many items, or perhaps all, that you'd like to delete, and once you do and submit, kiss them goodbye.
Comments