var fnRenderTable = function() { var Ex = YAHOO.namespace('example'); Ex.dataSource = new YAHOO.util.DataSource(gitData.rows,{ responseType : YAHOO.util.DataSource.TYPE_JSARRAY, responseSchema : { fields : ['name','url','price','aprice','storage','repos','users','Git','SVN'] }, doBeforeCallback : function (req,raw,res,cb) { var data = res.results || [], filtered = [], i,l; if (req) { req = req.toLowerCase(); for (i = 0, l = data.length; i < l; ++i) { if (!data[i].name.toLowerCase().indexOf(req)) { filtered.push(data[i]); } } res.results = filtered; } return res; } }); var gitUrlFormatter = function(elCell, oRecord, oColumn, sData) { elCell.innerHTML = "View"; }; var gitNumFormatter = function(elCell, oRecord, oColumn, sData) { if (sData == '999999999') elCell.innerHTML = "unlimited"; else elCell.innerHTML = sData; }; var gitTickFormatter = function(elCell, oRecord, oColumn, sData) { if (sData) elCell.innerHTML = ""; else elCell.innerHTML = ""; }; Ex.cols = [ { key: 'name', sortable: true, label:'Provider' }, { key: 'url', sortable: true, formatter: gitUrlFormatter, label:'URL' }, { key: 'price', sortable: true, label:'Monthly', formatter:"currency" }, { key: 'aprice', sortable: true, label:'Annually', formatter:"currency" }, { key: 'storage', sortable: true, label:'Storage (MB)', formatter:gitNumFormatter}, { key: 'repos', sortable: true, label:'Repository', formatter:gitNumFormatter }, { key: 'users', sortable: true, label:'Users', formatter:gitNumFormatter }, { key: 'Git', sortable: true, formatter:gitTickFormatter }, { key: 'SVN', sortable: true, formatter:gitTickFormatter } ]; Ex.paginator = new YAHOO.widget.Paginator({ rowsPerPage : 20, pageLinks : 5 }); Ex.conf = { paginator : Ex.paginator, sortedBy: {key:'name', dir:YAHOO.widget.DataTable.CLASS_ASC} ,width: "658px" }; Ex.dataTable = new YAHOO.widget.ScrollingDataTable('tbl',Ex.cols,Ex.dataSource,Ex.conf); Ex.filterTimeout = null; Ex.updateFilter = function () { Ex.filterTimeout = null; var state = Ex.dataTable.getState(); state.sortedBy = {key:'name', dir:YAHOO.widget.DataTable.CLASS_ASC}; Ex.dataSource.sendRequest(YAHOO.util.Dom.get('filter').value,{ success : Ex.dataTable.onDataReturnInitializeTable, failure : Ex.dataTable.onDataReturnInitializeTable, scope : Ex.dataTable, argument: state }); }; YAHOO.util.Event.on('filter','keyup',function (e) { clearTimeout(Ex.filterTimeout); setTimeout(Ex.updateFilter,600); }); } if (!YAHOO.widget.ScrollingDataTable && !YAHOO.widget.Paginator) { var loader = new YAHOO.util.YUILoader({ base: "http://ajax.googleapis.com/ajax/libs/yui/2.8.2r1/build/", require: ["datatable","paginator"], loadOptional: false, combine: false, filter: "MIN", allowRollup: true, onSuccess: fnRenderTable }); loader.insert(); }