Figure 6
Figure 6 Refresh User Interface
void Grid_SelectionChanged(
Object Sender, EventArgs e)
{
TableCell cImg, cName, cTitle;
DataGridItem dgi;
dgi = DataGrid1.SelectedItem;
cName = (TableCell) dgi.Controls[2];
cTitle = (TableCell) dgi.Controls[3];
statusbar.Text = "<b>You selected </b>" +
cName.Text + " (" +
cTitle.Text + ")" +
"<br><b> Item:</b> " +
DataGrid1.SelectedIndex.ToString();
cImg = (TableCell) dgi.Controls[0];
cImg.Text = "<img src=opened.gif>";
}
Figure 7 Implementing DataGrid
void Grid_CancelEdit(Object Sender,
DataGridCommandEventArgs e)
{
DataGrid1.EditItemIndex = -1;
}
void Grid_Edit(Object Sender,
DataGridCommandEventArgs e)
{
DataGrid1.EditItemIndex = e.Item.ItemIndex;
}
void Grid_Update(Object Sender,
DataGridCommandEventArgs e)
{
DataGrid1.EditItemIndex = -1;
}
Figure 9 Data Pages Script Code
<%@ Page Language="C#" %>
<%@ Import Namespace="System.Data" %>
<%@ Import Namespace="System.Data.SQL" %>
<style>
.PagerSpan {font-weight:bold;color:blue;}
.PagerLink {behavior:url(MouseOver.htc);}
</style>
<script runat="server">
/***********************************************************************
Initialize the page
***********************************************************************/
public void Page_Load(Object Sender, EventArgs e)
{
if (! Page.IsPostBack)
{
// first request to page, set properties
DataGrid1.PagerStyle.Mode = PagerMode.NumericPages;
DataGrid1.PagerStyle.BackColor = System.Drawing.Color.Gainsboro;
DataGrid1.PagerStyle.PageButtonCount = 10;
DataGrid1.PageSize = 4;
BindData();
}
}
/***********************************************************************
This function creates the data source whenever it is
necessary. If you're going to use paging, you always
need to reload the data source before rebinding.
You cannot cache the dataset in this case.
***********************************************************************/
private ICollection CreateDataSource()
{
// Set up the SQL2K connection
String strConn;
strConn = "DATABASE=Northwind;SERVER=localhost;UID=sa;PWD=;";
// Set the SQL command to run
String strCmd = "";
strCmd += "SELECT ";
strCmd += " employeeid, ";
strCmd += "titleofcourtesy + ' ' + firstname + ' ' + lastname AS
EmployeeName, ";
strCmd += "title ";
strCmd += "FROM Employees";
// Execute the command and add a named table to the dataset
SQLDataSetCommand oCMD = new SQLDataSetCommand(strCmd, strConn);
// Add a named table to the dataset
DataSet oDS = new DataSet();
oCMD.FillDataSet(oDS, "EmployeesList");
// Return a given data table
return oDS.Tables["EmployeesList"].DefaultView;
}
/***********************************************************************
The paging needs this delegate handler to refresh the
data source. It's critical that you recalculate the data
source here. Internally, the DataGrid will load only the
needed elements.
***********************************************************************/
public void Grid_PageIndexChanged(Object Sender, DataGridPageChangedEventArgs e)
{
// clear the selected and edit indices first, then rebind
DataGrid1.SelectedIndex = -1;
DataGrid1.EditItemIndex = -1;
BindData();
}
/***********************************************************************
This function gets called to rebind the grid to the data.
***********************************************************************/
public void BindData()
{
Trace.Warn("bindata","");
DataGrid1.DataSource = CreateDataSource();
DataGrid1.DataBind();
}
/***********************************************************************
This function gets called whenever a new item is created within
the DataGrid. You check the type, enumerate the pager items,
and set the CSS style
***********************************************************************/
public void Grid_ItemCreated(Object Sender, DataGridItemEventArgs e)
{
// Get the newly created item
ListItemType itemType = e.Item.ItemType;
// Is it the pager?
if (itemType == ListItemType.Pager)
{
// There's just one control in the list...
TableCell pager = (TableCell)e.Item.Controls[0];
// Enumerates all the items in the pager...
for (int i=0; i<pager.Controls.Count; i+=2)
{
try {
Label l = (Label) pager.Controls[i];
l.Text = "Page " + l.Text;
l.CssClass = "PagerSpan";
}
catch {
LinkButton h = (LinkButton) pager.Controls[i];
h.Text = "[ " + h.Text + " ]";
h.CssClass = "PagerLink";
}
}
}
}
/***********************************************************************
This code runs whenever an item is selected within the grid.
***********************************************************************/
public void Grid_SelectionChanged(Object Sender, EventArgs e)
{
// cancel editing
DataGrid1.EditItemIndex = -1;
try {
DataGridItem dgi = DataGrid1.SelectedItem;
TableCell cName = (TableCell) dgi.Controls[2];
TableCell cTitle = (TableCell) dgi.Controls[3];
statusbar.Text = "<b>You have selected </b>" +
cName.Text + " (" +
cTitle.Text + ")" + "<br><b> Item:</b> " +
DataGrid1.SelectedIndex.ToString();
TableCell c = (TableCell) dgi.Controls[0];
c.Text = "<img src=opened.gif border=0 align=absmiddle>";
}
catch {
statusbar.Text = "<b>You have no item selected </b>
<br><b> Item:</b> " +
DataGrid1.SelectedIndex.ToString();
}
}
/***********************************************************************
Select the specified row by manually setting the
SelectedIndex property.
***********************************************************************/
void SelectRow(Object sender, EventArgs e)
{
DataGrid1.SelectedIndex = RowNumber.Text.ToInt32()-1;
Grid_SelectionChanged(sender, e);
}
/***********************************************************************
Handler for CancelCommand. It provides the code necessary
to clear the current editing operation.
***********************************************************************/
void Grid_CancelEdit(Object Sender, DataGridCommandEventArgs e)
{
// Cancel the operation
DataGrid1.EditItemIndex = -1;
// Refresh the grid
BindData();
}
/***********************************************************************
Handler for EditCommand. It provides the code necessary
to start a new edit operation.
***********************************************************************/
void Grid_Edit(Object Sender, DataGridCommandEventArgs e)
{
// Start the edit operation
DataGrid1.EditItemIndex = e.Item.ItemIndex;
DataGrid1.SelectedIndex = -1;
// Refresh the grid
BindData();
}
/***********************************************************************
Handler for UpdateCommand. It provides the code necessary
to clear the current editing operation, update the data source,
and refresh the grid.
***********************************************************************/
void Grid_Update(Object Sender, DataGridCommandEventArgs e)
{
// Cancel the operation
DataGrid1.EditItemIndex = -1;
// update the data source
// TODO
// Refresh the grid
BindData();
}
</script>
<html>
<body>
<form runat="server">
<asp:DataGrid id="DataGrid1" runat="server"
AllowPaging="true"
OnPageIndexChanged="Grid_PageIndexChanged"
OnEditCommand="Grid_Edit"
OnUpdateCommand="Grid_Update"
OnCancelCommand="Grid_CancelEdit"
OnSelectedIndexChanged="Grid_SelectionChanged"
OnItemCreated="Grid_ItemCreated"
Font-Name="verdana"
Font-Size="10pt"
CellPadding="4">
<property name="SelectedItemStyle">
<asp:TableItemStyle BackColor="blue" ForeColor="white"
Font-Bold="true" />
</property>
<property name="EditItemStyle">
<asp:TableItemStyle BackColor="Yellow" ForeColor="black"
Font-Bold="true" />
</property>
<property name="HeaderStyle">
<asp:TableItemStyle BackColor="darkred" ForeColor="white"
Font-Bold="true" />
</property>
<property name="Columns">
<asp:ButtonColumn Text="<img border=0 src=select.gif>"
CommandName="Select" />
<asp:EditCommandColumn EditText="<img src=edit.gif>"
CancelText="<img src=cancel.gif>" UpdateText="<img src=ok.gif>" />
</property>
</asp:DataGrid>
<asp:Label id="statusbar" runat="server" /><br>
Enter the row to select:
<asp:Textbox id=RowNumber runat="server" />
<asp:Button Text="Select" OnClick="SelectRow" runat="server" />
</form>
</body>
</html>