hy I have a scipt I would like to put it on top of my grid.
this script it give the option to control my grid.
I would like to know how can i put it
<html>
<head>
<style type="text/css">
.tdText {
font:11px Verdana;
color:#333333;
}
.option2{
font:11px Verdana;
color:#0033cc;
padding-left:4px;
padding-right:4px;
}
a {
font:11px Verdana;
color:#315686;
text-decoration:underline;
}
a:hover {
color:crimson;
}
</style>
<script type="text/javascript">
function show_hide_Column(index) {
var oChk = document.getElementById("chkCol" + index);
if(oChk.checked == true) {
grid1.showColumn(index);
} else {
grid1.hideColumn(index);
}
}
</script>
<script type="text/javascript">
function showColumnsForExport(obj) {
var oContainer = document.getElementById("columnsContainer");
if(obj.checked == true) {
oContainer.style.display = "";
} else {
oContainer.style.display = "none";
}
}
function getColumnsForExport() {
var arrColumnsForExport = new Array();
if(document.getElementById("chkExportOrderID").checked == true) {
arrColumnsForExport.push("OrderID");
}
if(document.getElementById("chkExportShipName").checked == true) {
arrColumnsForExport.push("ShipName");
}
if(document.getElementById("chkExportShipCity").checked == true) {
arrColumnsForExport.push("ShipCity");
}
if(document.getElementById("chkExportShipAddress").checked == true) {
arrColumnsForExport.push("ShipAddress");
}
if(document.getElementById("chkExportShipPostalCode").checked == true) {
arrColumnsForExport.push("ShipPostalCode");
}
if(document.getElementById("chkExportShipCountry").checked == true) {
arrColumnsForExport.push("ShipCountry");
}
return arrColumnsForExport.join(",");
}
function exportToExcel() {
var sFileName = document.getElementById("txtFileName").value;
var bKeepFormatting = document.getElementById("chkKeepFormatting").checked;
var bUsePaging = document.getElementById("chkUsePaging").checked;
var bAppendTimeStamp = document.getElementById("chkAppendTimeStamp").checked;
var bOffice2007 = document.getElementById("chkOffice2007").checked;
var bHiddenColumns = document.getElementById("chkHiddenColumns").checked;
var sColumnsForExport = null;
if(document.getElementById("chkSpecifyColumns").checked == true) {
sColumnsForExport = getColumnsForExport();
}
grid1.exportToExcel(sFileName, bKeepFormatting, bUsePaging, bAppendTimeStamp, bOffice2007, bHiddenColumns, sColumnsForExport)
}
function exportToWord() {
var sFileName = document.getElementById("txtFileName").value;
var bKeepFormatting = document.getElementById("chkKeepFormatting").checked;
var bUsePaging = document.getElementById("chkUsePaging").checked;
var bAppendTimeStamp = document.getElementById("chkAppendTimeStamp").checked;
var bOffice2007 = document.getElementById("chkOffice2007").checked;
var bHiddenColumns = document.getElementById("chkHiddenColumns").checked;
var sColumnsForExport = null;
if(document.getElementById("chkSpecifyColumns").checked == true) {
sColumnsForExport = getColumnsForExport();
}
grid1.exportToWord(sFileName, bKeepFormatting, bUsePaging, bAppendTimeStamp, bOffice2007, bHiddenColumns, sColumnsForExport)
}
</script>
</head>
<body>
<form runat="server">
<table>
<tr>
<td valign="top">
<table border="0">
<tr>
<td class="tdText" valign="middle" colspan="2">Set the properties for exporting:</td>
</tr>
<tr>
<td class="tdText" valign="middle" align="center"><input type="text" id="txtFileName" value="OboutGrid" size="10" class="tdText"/></td>
<td class="tdText" valign="middle">File Name (without extension)</td>
</tr>
<tr>
<td class="tdText" valign="middle" align="right"><input type="checkbox" id="chkKeepFormatting" /></td>
<td class="tdText" valign="middle">Keep Formatting</td>
</tr>
<tr>
<td class="tdText" valign="middle" align="right"><input type="checkbox" id="chkUsePaging" /></td>
<td class="tdText" valign="middle">Use Paging</td>
</tr>
<tr>
<td class="tdText" valign="middle" align="right"><input type="checkbox" id="chkAppendTimeStamp" /></td>
<td class="tdText" valign="middle">Append TimeStamp</td>
</tr>
<tr>
<td class="tdText" valign="middle" align="right"><input type="checkbox" id="chkOffice2007" /></td>
<td class="tdText" valign="middle">Office 2007 Compatible</td>
</tr>
<tr>
<td class="tdText" valign="middle" align="right"><input type="checkbox" id="chkHiddenColumns" /></td>
<td class="tdText" valign="middle">Export Hidden Columns</td>
</tr>
<tr>
<td class="tdText" valign="middle" align="right"><input type="checkbox" id="chkSpecifyColumns" onclick="showColumnsForExport(this)" /></td>
<td class="tdText" valign="middle">Specify the Columns</td>
</tr>
<tr id="columnsContainer" style="display: none;">
<td class="tdText"> </td>
<td class="tdText">
<table>
<tr>
<td class="tdText">OrderID</td>
<td class="tdText"><input type="checkbox" id="chkExportOrderID" checked="checked" /></td>
</tr>
<tr>
<td class="tdText">ShipName</td>
<td class="tdText"><input type="checkbox" id="chkExportShipName" checked="checked" /></td>
</tr>
<tr>
<td class="tdText">ShipCity</td>
<td class="tdText"><input type="checkbox" id="chkExportShipCity" checked="checked" /></td>
</tr>
<tr>
<td class="tdText">ShipAddress</td>
<td class="tdText"><input type="checkbox" id="chkExportShipAddress" checked="checked" /></td>
</tr>
<tr>
<td class="tdText">ShipPostalCode</td>
<td class="tdText"><input type="checkbox" id="chkExportShipPostalCode" checked="checked" /></td>
</tr>
<tr>
<td class="tdText">ShipCountry</td>
<td class="tdText"><input type="checkbox" id="chkExportShipCountry" checked="checked" /></td>
</tr>
</table>
</td>
</tr>
</table>
</td>
<td width="50"> </td>
<td valign="top">
<input type="button" class="tdText" value="Export to Excel" onclick="exportToExcel()" />
<input type="button" class="tdText" value="Export to Word" onclick="exportToWord()" />
</td>
</tr>
</table>
<br /><br />
<obout:Grid id="grid1" runat="server" CallbackMode="true" Serialize="true" AutoGenerateColumns="false"
FolderStyle="styles/style_7" AllowFiltering="true"
OnRebind="RebindGrid" OnInsertCommand="InsertRecord" OnDeleteCommand="DeleteRecord" OnUpdateCommand="UpdateRecord"
FolderExports="resources/exports">
<Columns>
<obout:Column DataField="OrderID" Visible="false" ReadOnly="true" HeaderText="ORDER ID" Width="100" runat="server"/>
<obout:Column DataField="ShipName" HeaderText="NAME" Width="250" runat="server"/>
<obout:Column DataField="ShipCity" Align="right" HeaderAlign="right" HeaderText="CITY" Width="150" runat="server" />
<obout:Column DataField="ShipAddress" Visible="false" HeaderText="ADDRESS" Width="150" runat="server" />
<obout:Column DataField="ShipPostalCode" HeaderText="POSTAL CODE" Width="150" runat="server" />
<obout:Column DataField="ShipCountry" HeaderText="COUNTRY" Width="150" runat="server" />
<obout:Column HeaderText="EDIT" AllowEdit="true" AllowDelete="true" Width="125" runat="server" />
</Columns>
</obout:Grid>
</form>
<form runat="server">
<br />
<span class="tdText">Check/uncheck the checkboxes to show/hide the columns</span>
<table>
<tr>
<td class="tdText">
<input type="checkbox" id="chkCol0" onclick="show_hide_Column(0)" checked="checked" /> ORDER ID
</td>
<td class="tdText">
<input type="checkbox" id="chkCol1" onclick="show_hide_Column(1)" checked="checked" /> NAME
</td>
<td class="tdText">
<input type="checkbox" id="chkCol2" onclick="show_hide_Column(2)" checked="checked" /> CITY
</td>
</tr>
<tr>
<td class="tdText">
<input type="checkbox" id="chkCol3" onclick="show_hide_Column(3)" checked="checked" /> POSTAL CODE
</td>
<td class="tdText">
<input type="checkbox" id="chkCol4" onclick="show_hide_Column(4)" checked="checked" /> COUNTRY
</td>
<td class="tdText">
<input type="checkbox" id="chkCol5" onclick="show_hide_Column(5)" checked="checked" /> ORDER DATE
</td>
</tr>
</table>
<br />
<obout:Grid id="grid1" runat="server" CallbackMode="true" Serialize="true" AutoGenerateColumns="false" ShowFooter="false"
FolderStyle="styles/style_3" AllowColumnResizing="false" AllowAddingRecords="false">
<Columns>
<obout:Column DataField="OrderID" ReadOnly="true" HeaderText="ORDER ID" Width="100" runat="server"/>
<obout:Column DataField="ShipName" HeaderText="NAME" Width="200" runat="server"/>
<obout:Column DataField="ShipCity" HeaderText="CITY" Width="150" runat="server" />
<obout:Column DataField="ShipPostalCode" HeaderText="POSTAL CODE" Width="150" runat="server" />
<obout:Column DataField="ShipCountry" HeaderText="COUNTRY" Width="150" runat="server" />
<obout:Column DataField="OrderDate" HeaderText="ORDER DATE" Width="200" runat="server" />
</Columns>
</obout:Grid>
<br />
</form>
<form runat="server">
<span class="tdText">Change the position of the columns inside the grid<br /></span>
<ul>
<table cellspacing="0" cellpadding="0">
<tr>
<td class="tdText">
<li type="disc">SUPPLIER ID: </li>
</td>
<td class="tdText">
<asp:DropDownList runat="server" id="ddlSupplierID" CssClass="tdText">
<asp:ListItem Value="0" Selected="true">1</asp:ListItem>
<asp:ListItem Value="1">2</asp:ListItem>
<asp:ListItem Value="2">3</asp:ListItem>
<asp:ListItem Value="3">4</asp:ListItem>
<asp:ListItem Value="4">5</asp:ListItem>
</asp:DropDownList>
</td>
</tr>
<tr>
<td class="tdText">
<li type="disc">COMPANY NAME: </li>
</td>
<td class="tdText">
<asp:DropDownList runat="server" id="ddlCompanyName" CssClass="tdText">
<asp:ListItem Value="0">1</asp:ListItem>
<asp:ListItem Value="1" Selected="true">2</asp:ListItem>
<asp:ListItem Value="2">3</asp:ListItem>
<asp:ListItem Value="3">4</asp:ListItem>
<asp:ListItem Value="4">5</asp:ListItem>
</asp:DropDownList>
</td>
</tr>
<tr>
<td class="tdText">
<li type="disc">ADDRESS: </li>
</td>
<td class="tdText">
<asp:DropDownList runat="server" id="ddlAddress" CssClass="tdText">
<asp:ListItem Value="0">1</asp:ListItem>
<asp:ListItem Value="1">2</asp:ListItem>
<asp:ListItem Value="2" Selected="true">3</asp:ListItem>
<asp:ListItem Value="3">4</asp:ListItem>
<asp:ListItem Value="4">5</asp:ListItem>
</asp:DropDownList>
</td>
</tr>
<tr>
<td class="tdText">
<li type="disc">COUNTRY: </li>
</td>
<td class="tdText">
<asp:DropDownList runat="server" id="ddlCountry" CssClass="tdText">
<asp:ListItem Value="0">1</asp:ListItem>
<asp:ListItem Value="1">2</asp:ListItem>
<asp:ListItem Value="2">3</asp:ListItem>
<asp:ListItem Value="3" Selected="true">4</asp:ListItem>
<asp:ListItem Value="4">5</asp:ListItem>
</asp:DropDownList>
</td>
</tr>
<tr>
<td class="tdText">
<li type="disc">EDIT: </li>
</td>
<td class="tdText">
<asp:DropDownList runat="server" id="ddlEdit" CssClass="tdText">
<asp:ListItem Value="0">1</asp:ListItem>
<asp:ListItem Value="1">2</asp:ListItem>
<asp:ListItem Value="2">3</asp:ListItem>
<asp:ListItem Value="3">4</asp:ListItem>
<asp:ListItem Value="4" Selected="true">5</asp:ListItem>
</asp:DropDownList>
</td>
</tr>
<tr>
<td class="tdText" align="right" colspan="2">
<input type="submit" value="Submit" class="tdText" />
</td>
</tr>
</table>
</ul>
<obout:Grid id="grid1" runat="server" CallbackMode="true" Serialize="false" AllowFiltering="true"
FolderStyle="styles/style_9" AutoGenerateColumns="false"
OnRebind="RebindGrid" OnInsertCommand="InsertRecord" OnDeleteCommand="DeleteRecord" OnUpdateCommand="UpdateRecord">
<Columns>
<obout:Column DataField="SupplierID" ReadOnly="true" HeaderText="SUPPLIER ID" Width="125" runat="server"/>
<obout:Column DataField="CompanyName" HeaderText="COMPANY NAME" Width="250" runat="server"/>
<obout:Column DataField="Address" HeaderText="ADDRESS" Width="250" runat="server" />
<obout:Column DataField="Country" HeaderText="COUNTRY" Width="125" runat="server" />
<obout:Column AllowEdit="true" AllowDelete="true" HeaderText="EDIT" Width="150" runat="server" />
</Columns>
</obout:Grid>
</form>
</body>
</html>
thank you
