Javascript Document Method

The document object has several special collections. Each of these collections is an HTMLCollection object and provides faster access to common parts of the document, as described here:

document.anchors — Contains all <a> elements with a name attribute in the document.
document.applets — Contains all <applet> elements in the document. This collection is deprecated, because the <applet> element is no longer recommended for use.
document.forms — Contains all <form> elements in the document. The same as document.getElementsByTagName("form").
document.images — Contains all <img> elements in the document. The same as document.getElementsByTagName("img").
document.links — Contains all <a> elements with an href attribute in the document.

Determine Browser by using JS

Internet Explorer (IE), Safari, Opera, and Chrome all provide screenLeft and screenTop properties that indicate the window location in relation to the left and top of the screen, respectively. Firefox provides this functionality through the screenX and screenY properties, which are also supported in Safari and Chrome. Opera supports screenX and screenY, but you should avoid using them in Opera, because they don’t correspond to screenLeft and screenTop. The following code determines the left and top positions of the window across browsers:

var leftPos = (typeof window.screenLeft == "number")?window.screenLeft :window.screenX;
var topPos = (typeof window.screenTop == "number") ? window.screenTop : window.screenY;

This example uses the ternary operator to determine if the screenLeft and screenTop properties exist. If they do (which is the case in IE, Safari, Opera, and Chrome), they are used. If they don’t exist (as in Firefox), screenX and screenY are used.

Using DataGrid_ItemCreated

//Just add the Datagrid on to the Design View

<asp:DataGrid ID="DataGrid1" runat="server" AutoGenerateColumns="false" onitemcreated="DataGrid1_ItemCreated">
<Columns>
<asp:BoundColumn DataField="CustomerID" HeaderText="Customer ID"/>
<asp:BoundColumn DataField="CustomerName" HeaderText="Customer Name"/>
<asp:BoundColumn DataField="CustomerPhone" HeaderText="Customer Phone"/>
<asp:BoundColumn DataField="CustomerAddress" HeaderText="Customer Address"/>
<asp:BoundColumn DataField="CustomerAge" HeaderText="Customer Age"/>
</Columns>
</asp:DataGrid>

//Then Add the Event DataGrid_ItemCreated
protected void DataGrid1_ItemCreated(object sender, DataGridItemEventArgs e)
{
if(e.Item.ItemType == ListItemType.Header)
{
e.Item.Cells.RemoveAt(2);
e.Item.Cells[1].ColumnSpan = 2;
e.Item.Cells[1].Text = "<table border=\"1px\" style=\"width:100%; text-align:center; \"" +
" <tr align=\"centre\">" +
" <td colspan=\"2\">" +
" Name" +
" </td>" +
" </tr>" +
" </table>" +
"<table border=\" 1px\" " +
" <tr align=\"centre\">" +
" <td>" +
" First Name" +
" </td>" +
" <td>" +
" Last Name" +
" </td>" +
" </tr>" +
" </table>";
}
}