Example
Source
Run as server control
The "look and feel" of the grid can be easliy customised using CSS and the
setColumnProperty
method which allows the appearance of indivdual cells or whole rows to be modified conditionally or unconditionally.
Include the Javascript library file
<script src="../dbnetgrid.js"></script>
Styles
table.dbnetgrid td.headingCell { background-image:url('../images/blue_gradient.gif'); } table.dbnetgrid tr.oddRow { background-color:lightblue; }
Client-side script
window.onload = initGrid ////////////////////////////////////////////////////////////////////////////////////////////// function initGrid() ////////////////////////////////////////////////////////////////////////////////////////////// { var dbnetgrid1 = new DbNetGrid( "dbnetgrid1" ) with ( dbnetgrid1 ) { connectionString = "samples" headings = ["Customer Code","Customer Name","Address","City","Region","Phone","Fax"] selectPart = ["customerid","companyname","address","city","region","phone","fax"] fromPart = "customers" orderColumn = "region" orderSequence = "desc" setColumnProperty('city','backgroundColor:orange') setColumnProperty('region','backgroundColor:gold',/SP/,false) setColumnProperty('region','backgroundColor:yellow',/WY/,true) setColumnProperty('region','backgroundColor:darkorange',/WA/,false) saveType = "enhanced" view = true primaryKeyColumn = 'customerid' editRow = false loadData() } }
HTML
<p> <div id=dbnetgrid1></div>