datagrid源码
/** * jQuery EasyUI 1.2.3 * * Licensed under the GPL terms * To use it on other terms please contact us * * Copyright(c) 2009-2011 stworthy [ stworthy@gmail.com ] * */ (function ($) { $.extend(Array.prototype, { indexOf: function (o) { for (var i = 0, len = this.length; i < len; i++) { if (this[i] == o) { return i; } } return -1; }, remove: function (o) { var index = this.indexOf(o); if (index != -1) { this.splice(index, 1); } return this; }, removeById: function (filed, id) { for (var i = 0, len = this.length; i < len; i++) { if (this[i][filed] == id) { this.splice(i, 1); return this; } } return this; } }); function setSize(target, param) { var opts = $.data(target, "datagrid").options; var pnl = $.data(target, "datagrid").panel; if (param) { if (param.width) { opts.width = param.width; } if (param.height) { opts.height = param.height; } } if (opts.fit == true) { var p = pnl.panel("panel").parent(); opts.width = p.width(); opts.height = p.height(); } pnl.panel("resize", { width: opts.width, height: opts.height }); }; function fixDataGridHeight(target) { var opts = $.data(target, "datagrid").options; var pnl = $.data(target, "datagrid").panel; var pnlwidth = pnl.width(); var pnlheight = pnl.height(); var view = pnl.children("div.datagrid-view"); var view1 = view.children("div.datagrid-view1"); var view2 = view.children("div.datagrid-view2"); var view1header = view1.children("div.datagrid-header"); var view2header = view2.children("div.datagrid-header"); var view1headerTable = view1header.find("table"); var view2headerTable = view2header.find("table"); view.width(pnlwidth); var view1headerInner = view1header.children("div.datagrid-header-inner").show(); view1.width(view1headerInner.find("table").width()); if (!opts.showHeader) { view1headerInner.hide(); } view2.width(pnlwidth - view1.outerWidth()); view1.children("div.datagrid-header,div.datagrid-body,div.datagrid-footer").width(view1.width()); view2.children("div.datagrid-header,div.datagrid-body,div.datagrid-footer").width(view2.width()); var hh; view1header.css("height", ""); view2header.css("height", ""); view1headerTable.css("height", ""); view2headerTable.css("height", ""); hh = Math.max(view1headerTable.height(), view2headerTable.height()); view1headerTable.height(hh); view2headerTable.height(hh); if ($.boxModel == true) { view1header.height(hh - (view1header.outerHeight() - view1header.height())); view2header.height(hh - (view2header.outerHeight() - view2header.height())); } else { view1header.height(hh); view2header.height(hh); } if (opts.height != "auto") { var bodyHeight = pnlheight - view2.children("div.datagrid-header").outerHeight(true) - view2.children("div.datagrid-footer").outerHeight(true) - pnl.children("div.datagrid-toolbar").outerHeight(true) - pnl.children("div.datagrid-pager").outerHeight(true); view1.children("div.datagrid-body").height(bodyHeight); view2.children("div.datagrid-body").height(bodyHeight); } view.height(view2.height()); view2.css("left", view1.outerWidth()); }; function fixRowHeight(target, index) { var rows = $.data(target, "datagrid").data.rows; var opts = $.data(target, "datagrid").options; var pnl = $.data(target, "datagrid").panel; var view = pnl.children("div.datagrid-view"); var view1 = view.children("div.datagrid-view1"); var view2 = view.children("div.datagrid-view2"); if (!view1.find("div.datagrid-body-inner").is(":empty")) { if (index >= 0) { fixSingleRowHeight(index); } else { for (var i = 0; i < rows.length; i++) { fixSingleRowHeight(i); } if (opts.showFooter) { var footerRows = $(target).datagrid("getFooterRows") || []; var c1 = view1.children("div.datagrid-footer"); var c2 = view2.children("div.datagrid-footer"); for (var i = 0; i < footerRows.length; i++) { fixSingleRowHeight(i, c1, c2); } fixDataGridHeight(target); } } } if (opts.height == "auto") { var view1body = view1.children("div.datagrid-body"); var view2body = view2.children("div.datagrid-body"); var outerHeightTotal = 0; var tmpHeight = 0; view2body.children().each(function () { var c = $(this); if (c.is(":visible")) { outerHeightTotal += c.outerHeight(); if (tmpHeight < c.outerWidth()) { tmpHeight = c.outerWidth(); } } }); if (tmpHeight > view2body.width()) { outerHeightTotal += 18; } view1body.height(outerHeightTotal); view2body.height(outerHeightTotal); view.height(view2.height()); } view2.children("div.datagrid-body").triggerHandler("scroll"); function fixSingleRowHeight(index, c1, c2) { c1 = c1 || view1; c2 = c2 || view2; var tr1 = c1.find("tr[datagrid-row-index=" + index + "]"); var tr2 = c2.find("tr[datagrid-row-index=" + index + "]"); tr1.css("height", ""); tr2.css("height", ""); var maxheight = Math.max(tr1.height(), tr2.height()); tr1.css("height", maxheight); tr2.css("height", maxheight); }; }; function wrapGrid(target, rownumbers) { function getDataByCondition(conditons) { var trAry = []; $("tr", conditons).each(function () { var thAry = []; $("th", this).each(function () { var th = $(this); var col = { title: th.html(), align: th.attr("align") || "left", sortable: th.attr("sortable") == "true" || false, checkbox: th.attr("checkbox") == "true" || false }; if (th.attr("field")) { col.field = th.attr("field"); } if (th.attr("formatter")) { col.formatter = eval(th.attr("formatter")); } if (th.attr("styler")) { col.styler = eval(th.attr("styler")); } if (th.attr("editor")) { var s = $.trim(th.attr("editor")); if (s.substr(0, 1) == "{") { col.editor = eval("(" + s + ")"); } else { col.editor = s; } } if (th.attr("rowspan")) { col.rowspan = parseInt(th.attr("rowspan")); } if (th.attr("colspan")) { col.colspan = parseInt(th.attr("colspan")); } if (th.attr("width")) { col.width = parseInt(th.attr("width")); } if (th.attr("hidden")) { col.hidden = th.attr("hidden") == "true"; } if (th.attr("resizable")) { col.resizable = th.attr("resizable") == "true"; } thAry.push(col); }); trAry.push(thAry); }); return trAry; }; var wrapObj = $("<div class=\"datagrid-wrap\">" + "<div class=\"datagrid-view\">" + "<div class=\"datagrid-view1\">" + "<div class=\"datagrid-header\">" + "<div class=\"datagrid-header-inner\"></div>" + "</div>" + "<div class=\"datagrid-body\">" + "<div class=\"datagrid-body-inner\"></div>" + "</div>" + "<div class=\"datagrid-footer\">" + "<div class=\"datagrid-footer-inner\"></div>" + "</div>" + "</div>" + "<div class=\"datagrid-view2\">" + "<div class=\"datagrid-header\">" + "<div class=\"datagrid-header-inner\"></div>" + "</div>" + "<div class=\"datagrid-body\"></div>" + "<div class=\"datagrid-footer\">" + "<div class=\"datagrid-footer-inner\"></div>" + "</div>" + "</div>" + "<div class=\"datagrid-resize-proxy\"></div>" + "</div>" + "</div>").insertAfter(target); wrapObj.panel({ doSize: false }); wrapObj.panel("panel").addClass("datagrid").bind("_resize", function (e, _32) { var opts = $.data(target, "datagrid").options; if (opts.fit == true || _32) { setSize(target); setTimeout(function () { if ($.data(target, "datagrid")) { fixColumnSize(target); } }, 0); } return false; }); $(target).hide().appendTo(wrapObj.children("div.datagrid-view")); var dataFrozen = getDataByCondition($("thead[frozen=true]", target)); var dataFit = getDataByCondition($("thead[frozen!=true]", target)); return { panel: wrapObj, frozenColumns: dataFrozen, columns: dataFit }; }; function getData(target) { var data = { total: 0, rows: [] }; var getCols = getColumnFiles(target, true).concat(getColumnFiles(target, false)); $(target).find("tbody tr").each(function () { data.total++; var col = {}; for (var i = 0; i < getCols.length; i++) { col[getCols[i]] = $("td:eq(" + i + ")", this).html(); } data.rows.push(col); }); return data; }; function initDatagrid(target) { var opts = $.data(target, "datagrid").options; var pnl = $.data(target, "datagrid").panel; pnl.panel($.extend({}, opts, { doSize: false, onResize: function (_40, _41) { setTimeout(function () { if ($.data(target, "datagrid")) { fixDataGridHeight(target); fixColumnWidth(target); opts.onResize.call(pnl, _40, _41); } }, 0); }, onExpand: function () { fixDataGridHeight(target); fixRowHeight(target); opts.onExpand.call(pnl); } })); var view = pnl.children("div.datagrid-view"); var view1 = view.children("div.datagrid-view1"); var view2 = view.children("div.datagrid-view2"); var view1HeaderInner = view1.children("div.datagrid-header").children("div.datagrid-header-inner"); var view2HeaderInner = view2.children("div.datagrid-header").children("div.datagrid-header-inner"); appendColumns(view1HeaderInner, opts.frozenColumns, true); appendColumns(view2HeaderInner, opts.columns, false); view1HeaderInner.css("display", opts.showHeader ? "block" : "none"); view2HeaderInner.css("display", opts.showHeader ? "block" : "none"); view1.find("div.datagrid-footer-inner").css("display", opts.showFooter ? "block" : "none"); view2.find("div.datagrid-footer-inner").css("display", opts.showFooter ? "block" : "none"); if (opts.toolbar) { if (typeof opts.toolbar == "string") { $(opts.toolbar).addClass("datagrid-toolbar").prependTo(pnl); $(opts.toolbar).show(); } else { $("div.datagrid-toolbar", pnl).remove(); var tb = $("<div class=\"datagrid-toolbar\"></div>").prependTo(pnl); for (var i = 0; i < opts.toolbar.length; i++) { var btn = opts.toolbar[i]; if (btn == "-") { $("<div class=\"datagrid-btn-separator\"></div>").appendTo(tb); } else { var lnkObj = $("<a href=\"javascript:void(0)\"></a>"); lnkObj[0].onclick = eval(btn.handler || function () { }); lnkObj.css("float", "left").appendTo(tb).linkbutton($.extend({}, btn, { plain: true })); } } } } else { $("div.datagrid-toolbar", pnl).remove(); } $("div.datagrid-pager", pnl).remove(); if (opts.pagination) { var pagerObj = $("<div class=\"datagrid-pager\"></div>").appendTo(pnl); pagerObj.pagination({ pageNumber: opts.pageNumber, pageSize: opts.pageSize, pageList: opts.pageList, onSelectPage: function (_4a, _4b) { opts.pageNumber = _4a; opts.pageSize = _4b; request(target); } }); opts.pageSize = pagerObj.pagination("options").pageSize; } function appendColumns(container, columns, frozen) { if (!columns) { return; } $(container).show(); $(container).empty(); var t = $("<table border=\"0\" cellspacing=\"0\" cellpadding=\"0\"><tbody></tbody></table>").appendTo(container); for (var i = 0; i < columns.length; i++) { var tr = $("<tr></tr>").appendTo($("tbody", t)); var findCol = columns[i]; for (var j = 0; j < findCol.length; j++) { var col = findCol[j]; var strHtml = ""; if (col.rowspan) { strHtml += "rowspan=\"" + col.rowspan + "\" "; } if (col.colspan) { strHtml += "colspan=\"" + col.colspan + "\" "; } var td = $("<td " + strHtml + "></td>").appendTo(tr); if (col.checkbox) { td.attr("field", col.field); $("<div class=\"datagrid-header-check\"></div>").html("<input type=\"checkbox\"/>").appendTo(td); } else { if (col.field) { td.attr("field", col.field); td.append("<div class=\"datagrid-cell\"><span></span><span class=\"datagrid-sort-icon\"></span></div>"); $("span", td).html(col.title); $("span.datagrid-sort-icon", td).html(" "); var findCell = td.find("div.datagrid-cell"); if (col.resizable == false) { findCell.attr("resizable", "false"); } col.boxWidth = $.boxModel ? (col.width - (findCell.outerWidth() - findCell.width())) : col.width; findCell.width(col.boxWidth); findCell.css("text-align", (col.align || "left")); } else { $("<div class=\"datagrid-cell-group\"></div>").html(col.title).appendTo(td); } } if (col.hidden) { td.hide(); } } } if (frozen && opts.rownumbers) { var td = $("<td rowspan=\"" + opts.frozenColumns.length + "\"><div class=\"datagrid-header-rownumber\"></div></td>"); if ($("tr", t).length == 0) { td.wrap("<tr></tr>").parent().appendTo($("tbody", t)); } else { td.prependTo($("tr:first", t)); } } }; }; function bindRowEvents(target) { var pnl = $.data(target, "datagrid").panel; var opts = $.data(target, "datagrid").options; var data = $.data(target, "datagrid").data; var pnlBody = pnl.find("div.datagrid-body"); pnlBody.find("tr[datagrid-row-index]").unbind(".datagrid").bind("mouseenter.datagrid", function () { var findIndex = $(this).attr("datagrid-row-index"); pnlBody.find("tr[datagrid-row-index=" + findIndex + "]").addClass("datagrid-row-over"); }).bind("mouseleave.datagrid", function () { var findIndex = $(this).attr("datagrid-row-index"); pnlBody.find("tr[datagrid-row-index=" + findIndex + "]").removeClass("datagrid-row-over"); }).bind("click.datagrid", function () { var findIndex = $(this).attr("datagrid-row-index"); if (opts.singleSelect == true) { clearSelections(target); selectRow(target, findIndex); } else { if ($(this).hasClass("datagrid-row-selected")) { unSelectRow(target, findIndex); } else { selectRow(target, findIndex); } } if (opts.onClickRow) { opts.onClickRow.call(target, findIndex, data.rows[findIndex]); } }).bind("dblclick.datagrid", function () { var findIndex = $(this).attr("datagrid-row-index"); if (opts.onDblClickRow) { opts.onDblClickRow.call(target, findIndex, data.rows[findIndex]); } }).bind("contextmenu.datagrid", function (e) { var findIndex = $(this).attr("datagrid-row-index"); if (opts.onRowContextMenu) { opts.onRowContextMenu.call(target, e, findIndex, data.rows[findIndex]); } }); pnlBody.find("td[field]").unbind(".datagrid").bind("click.datagrid", function () { var findIndex = $(this).parent().attr("datagrid-row-index"); var findField = $(this).attr("field"); var findRow = data.rows[findIndex][findField]; opts.onClickCell.call(target, findIndex, findField, findRow); }).bind("dblclick.datagrid", function () { var findIndex = $(this).parent().attr("datagrid-row-index"); var findField = $(this).attr("field"); var findRow = data.rows[findIndex][findField]; opts.onDblClickCell.call(target, findIndex, findField, findRow); }); pnlBody.find("div.datagrid-cell-check input[type=checkbox]").unbind(".datagrid").bind("click.datagrid", function (e) { var findIndex = $(this).parent().parent().parent().attr("datagrid-row-index"); if (opts.singleSelect) { clearSelections(target); selectRow(target, findIndex); } else { if ($(this).attr("checked")) { selectRow(target, findIndex); } else { unSelectRow(target, findIndex); } } e.stopPropagation(); }); }; function bindCellsEvents(target) { var pnl = $.data(target, "datagrid").panel; var opts = $.data(target, "datagrid").options; var pnlHeader = pnl.find("div.datagrid-header"); pnlHeader.find("td:has(div.datagrid-cell)").unbind(".datagrid").bind("mouseenter.datagrid", function () { $(this).addClass("datagrid-header-over"); }).bind("mouseleave.datagrid", function () { $(this).removeClass("datagrid-header-over"); }).bind("contextmenu.datagrid", function (e) { var filed = $(this).attr("field"); opts.onHeaderContextMenu.call(target, e, filed); }); pnlHeader.find("div.datagrid-cell").unbind(".datagrid").bind("click.datagrid", function () { var filed = $(this).parent().attr("field"); var opt = getColOptions(target, filed); if (!opt.sortable) { return; } opts.sortName = filed; opts.sortOrder = "asc"; var c = "datagrid-sort-asc"; if ($(this).hasClass("datagrid-sort-asc")) { c = "datagrid-sort-desc"; opts.sortOrder = "desc"; } pnlHeader.find("div.datagrid-cell").removeClass("datagrid-sort-asc datagrid-sort-desc"); $(this).addClass(c); if (opts.onSortColumn) { opts.onSortColumn.call(target, opts.sortName, opts.sortOrder); } if (opts.remoteSort) { request(target); } else { var data = $.data(target, "datagrid").data; loadData(target, data); } }); pnlHeader.find("input[type=checkbox]").unbind(".datagrid").bind("click.datagrid", function () { if (opts.singleSelect) { return false; } if ($(this).attr("checked")) { selectAll(target); } else { clearSelectRows(target); } }); var view = pnl.children("div.datagrid-view"); var view1 = view.children("div.datagrid-view1"); var view2 = view.children("div.datagrid-view2"); view2.children("div.datagrid-body").unbind(".datagrid").bind("scroll.datagrid", function () { view1.children("div.datagrid-body").scrollTop($(this).scrollTop()); view2.children("div.datagrid-header").scrollLeft($(this).scrollLeft()); view2.children("div.datagrid-footer").scrollLeft($(this).scrollLeft()); }); pnlHeader.find("div.datagrid-cell").each(function () { $(this).resizable({ handles: "e", disabled: ($(this).attr("resizable") ? $(this).attr("resizable") == "false" : false), minWidth: 25, onStartResize: function (e) { view.children("div.datagrid-resize-proxy").css({ left: e.pageX - $(pnl).offset().left - 1, display: "block" }); }, onResize: function (e) { view.children("div.datagrid-resize-proxy").css({ display: "block", left: e.pageX - $(pnl).offset().left - 1 }); return false; }, onStopResize: function (e) { var field = $(this).parent().attr("field"); var col = getColOptions(target, field); col.width = $(this).outerWidth(); col.boxWidth = $.boxModel == true ? $(this).width() : $(this).outerWidth(); fixColumnSize(target, field); fixColumnWidth(target); var tmpView = pnl.find("div.datagrid-view2"); tmpView.find("div.datagrid-header").scrollLeft(tmpView.find("div.datagrid-body").scrollLeft()); view.children("div.datagrid-resize-proxy").css("display", "none"); opts.onResizeColumn.call(target, field, col.width); } }); }); view1.children("div.datagrid-header").find("div.datagrid-cell").resizable({ onStopResize: function (e) { var filed = $(this).parent().attr("field"); var col = getColOptions(target, filed); col.width = $(this).outerWidth(); col.boxWidth = $.boxModel == true ? $(this).width() : $(this).outerWidth(); fixColumnSize(target, filed); var tmpView = pnl.find("div.datagrid-view2"); tmpView.find("div.datagrid-header").scrollLeft(tmpView.find("div.datagrid-body").scrollLeft()); view.children("div.datagrid-resize-proxy").css("display", "none"); fixDataGridHeight(target); fixColumnWidth(target); opts.onResizeColumn.call(target, filed, col.width); } }); }; function fixColumnWidth(target) { var opts = $.data(target, "datagrid").options; if (!opts.fitColumns) { return; } var pnl = $.data(target, "datagrid").panel; var view2Header = pnl.find("div.datagrid-view2 div.datagrid-header"); var tmpWidth = 0; var tmpCol; var coFields = getColumnFiles(target, false); for (var i = 0; i < coFields.length; i++) { var col = getColOptions(target, coFields[i]); if (!col.hidden && !col.checkbox) { tmpWidth += col.width; tmpCol = col; } } var view2HeaderInner = view2Header.children("div.datagrid-header-inner").show(); var jzWidth = view2Header.width() - view2Header.find("table").width() - opts.scrollbarSize; var ratio = jzWidth / tmpWidth; if (!opts.showHeader) { view2HeaderInner.hide(); } for (var i = 0; i < coFields.length; i++) { var col = getColOptions(target, coFields[i]); if (!col.hidden && !col.checkbox) { var floorWidth = Math.floor(col.width * ratio); setCellWidth(col, floorWidth); jzWidth -= floorWidth; } } fixColumnSize(target); if (jzWidth) { setCellWidth(tmpCol, jzWidth); fixColumnSize(target, tmpCol.field); } function setCellWidth(col, width) { col.width += width; col.boxWidth += width; view2Header.find("td[field=" + col.field + "] div.datagrid-cell").width(col.boxWidth); }; }; function fixColumnSize(target, filed) { var pnl = $.data(target, "datagrid").panel; var bf = pnl.find("div.datagrid-body,div.datagrid-footer"); if (filed) { fix(filed); } else { pnl.find("div.datagrid-header td[field]").each(function () { fix($(this).attr("field")); }); } fixCellWidth(target); setTimeout(function () { fixRowHeight(target); resizeEditor(target); }, 0); function fix(_88) { var col = getColOptions(target, _88); bf.find("td[field=" + _88 + "]").each(function () { var td = $(this); var _89 = td.attr("colspan") || 1; if (_89 == 1) { td.find("div.datagrid-cell").width(col.boxWidth); td.find("div.datagrid-editable").width(col.width); } }); }; }; function fixCellWidth(target) { var pnl = $.data(target, "datagrid").panel; var pnlHeader = pnl.find("div.datagrid-header"); pnl.find("div.datagrid-body td.datagrid-td-merged").each(function () { var td = $(this); var colspan = td.attr("colspan") || 1; var tdFiled = td.attr("field"); var findTd = pnlHeader.find("td[field=" + tdFiled + "]"); var findTdWidth = findTd.width(); for (var i = 1; i < colspan; i++) { findTd = findTd.next(); findTdWidth += findTd.outerWidth(); } var tdCell = td.children("div.datagrid-cell"); if ($.boxModel == true) { tdCell.width(findTdWidth - (tdCell.outerWidth() - tdCell.width())); } else { tdCell.width(findTdWidth); } }); }; function resizeEditor(target) { var pnl = $.data(target, "datagrid").panel; pnl.find("div.datagrid-editable").each(function () { var ed = $.data(this, "datagrid.editor"); if (ed.actions.resize) { ed.actions.resize(ed.target, $(this).width()); } }); }; function getColOptions(target, filed) { var opts = $.data(target, "datagrid").options; if (opts.columns) { for (var i = 0; i < opts.columns.length; i++) { var colOpts = opts.columns[i]; for (var j = 0; j < colOpts.length; j++) { var col = colOpts[j]; if (col.field == filed) { return col; } } } } if (opts.frozenColumns) { for (var i = 0; i < opts.frozenColumns.length; i++) { var colOpts = opts.frozenColumns[i]; for (var j = 0; j < colOpts.length; j++) { var col = colOpts[j]; if (col.field == filed) { return col; } } } } return null; }; function getColumnFiles(target, frozen) { var opts = $.data(target, "datagrid").options; var cols = (frozen == true) ? (opts.frozenColumns || [[]]) : opts.columns; if (cols.length == 0) { return []; } var columnFileds = []; function findLocation(index) { var c = 0; var i = 0; while (true) { if (columnFileds[i] == undefined) { if (c == index) { return i; } c++; } i++; } }; function getColumnFileds(r) { var ff = []; var c = 0; for (var i = 0; i < cols[r].length; i++) { var col = cols[r][i]; if (col.field) { ff.push([c, col.field]); } c += parseInt(col.colspan || "1"); } for (var i = 0; i < ff.length; i++) { ff[i][0] = findLocation(ff[i][0]); } for (var i = 0; i < ff.length; i++) { var f = ff[i]; columnFileds[f[0]] = f[1]; } }; for (var i = 0; i < cols.length; i++) { getColumnFileds(i); } return columnFileds; }; function loadData(target, data) { var opts = $.data(target, "datagrid").options; var pnl = $.data(target, "datagrid").panel; var selectRows = $.data(target, "datagrid").selectedRows; data = opts.loadFilter.call(target, data); var dataRows = data.rows; $.data(target, "datagrid").data = data; if (data.footer) { $.data(target, "datagrid").footer = data.footer; } if (!opts.remoteSort) { var opt = getColOptions(target, opts.sortName); if (opt) { var _a9 = opt.sorter || function (a, b) { return (a > b ? 1 : -1); }; data.rows.sort(function (r1, r2) { return _a9(r1[opts.sortName], r2[opts.sortName]) * (opts.sortOrder == "asc" ? 1 : -1); }); } } var view = pnl.children("div.datagrid-view"); var view1 = view.children("div.datagrid-view1"); var view2 = view.children("div.datagrid-view2"); if (opts.view.onBeforeRender) { opts.view.onBeforeRender.call(opts.view, target, dataRows); } opts.view.render.call(opts.view, target, view2.children("div.datagrid-body"), false); opts.view.render.call(opts.view, target, view1.children("div.datagrid-body").children("div.datagrid-body-inner"), true); if (opts.showFooter) { opts.view.renderFooter.call(opts.view, target, view2.find("div.datagrid-footer-inner"), false); opts.view.renderFooter.call(opts.view, target, view1.find("div.datagrid-footer-inner"), true); } if (opts.view.onAfterRender) { opts.view.onAfterRender.call(opts.view, target); } opts.onLoadSuccess.call(target, data); var pager = pnl.children("div.datagrid-pager"); if (pager.length) { if (pager.pagination("options").total != data.total) { pager.pagination({ total: data.total }); } } fixRowHeight(target); bindRowEvents(target); view2.children("div.datagrid-body").triggerHandler("scroll"); if (opts.idField) { for (var i = 0; i < dataRows.length; i++) { if (isExistsRow(dataRows[i])) { selectRecord(target, dataRows[i][opts.idField]); } } } function isExistsRow(row) { for (var i = 0; i < selectRows.length; i++) { if (selectRows[i][opts.idField] == row[opts.idField]) { selectRows[i] = row; return true; } } return false; }; }; function getRowIndex(target, row) { var opts = $.data(target, "datagrid").options; var rows = $.data(target, "datagrid").data.rows; if (typeof row == "object") { return rows.indexOf(row); } else { for (var i = 0; i < rows.length; i++) { if (rows[i][opts.idField] == row) { return i; } } return -1; } }; function getSelectRows(target) { var opts = $.data(target, "datagrid").options; var pnl = $.data(target, "datagrid").panel; var data = $.data(target, "datagrid").data; if (opts.idField) { return $.data(target, "datagrid").selectedRows; } else { var rowAry = []; $("div.datagrid-view2 div.datagrid-body tr.datagrid-row-selected", pnl).each(function () { var row_index = parseInt($(this).attr("datagrid-row-index")); rowAry.push(data.rows[row_index]); }); return rowAry; } }; function clearSelections(target) { clearSelectRows(target); var selectRows = $.data(target, "datagrid").selectedRows; selectRows.splice(0, selectRows.length); }; function selectAll(target) { var opts = $.data(target, "datagrid").options; var pnl = $.data(target, "datagrid").panel; var data = $.data(target, "datagrid").data; var selectRows = $.data(target, "datagrid").selectedRows; var rows = data.rows; var pnlBody = pnl.find("div.datagrid-body"); $("tr", pnlBody).addClass("datagrid-row-selected"); $("div.datagrid-cell-check input[type=checkbox]", pnlBody).attr("checked", true); for (var i = 0; i < rows.length; i++) { if (opts.idField) { (function () { var row = rows[i]; for (var i = 0; i < selectRows.length; i++) { if (selectRows[i][opts.idField] == row[opts.idField]) { return; } } selectRows.push(row); })(); } } opts.onSelectAll.call(target, rows); }; function clearSelectRows(target) { var opts = $.data(target, "datagrid").options; var pnl = $.data(target, "datagrid").panel; var data = $.data(target, "datagrid").data; var selectRows = $.data(target, "datagrid").selectedRows; $("div.datagrid-body tr.datagrid-row-selected", pnl).removeClass("datagrid-row-selected"); $("div.datagrid-body div.datagrid-cell-check input[type=checkbox]", pnl).attr("checked", false); if (opts.idField) { for (var i = 0; i < data.rows.length; i++) { selectRows.removeById(opts.idField, data.rows[i][opts.idField]); } } opts.onUnselectAll.call(target, data.rows); }; function selectRow(target, index) { var pnl = $.data(target, "datagrid").panel; var opts = $.data(target, "datagrid").options; var data = $.data(target, "datagrid").data; var selectRows = $.data(target, "datagrid").selectedRows; if (index < 0 || index >= data.rows.length) { return; } if (opts.singleSelect == true) { clearSelections(target); } var tr = $("div.datagrid-body tr[datagrid-row-index=" + index + "]", pnl); if (!tr.hasClass("datagrid-row-selected")) { tr.addClass("datagrid-row-selected"); var ck = $("div.datagrid-cell-check input[type=checkbox]", tr); ck.attr("checked", true); if (opts.idField) { var row = data.rows[index]; (function () { for (var i = 0; i < selectRows.length; i++) { if (selectRows[i][opts.idField] == row[opts.idField]) { return; } } selectRows.push(row); })(); } } opts.onSelect.call(target, index, data.rows[index]); var view2 = pnl.find("div.datagrid-view2"); var view2Header = view2.find("div.datagrid-header").outerHeight(); var view2Body = view2.find("div.datagrid-body"); var top = tr.position().top - view2Header; if (top <= 0) { view2Body.scrollTop(view2Body.scrollTop() + top); } else { if (top + tr.outerHeight() > view2Body.height() - 18) { view2Body.scrollTop(view2Body.scrollTop() + top + tr.outerHeight() - view2Body.height() + 18); } } }; function selectRecord(target, id) { var opts = $.data(target, "datagrid").options; var data = $.data(target, "datagrid").data; if (opts.idField) { var _da = -1; for (var i = 0; i < data.rows.length; i++) { if (data.rows[i][opts.idField] == id) { _da = i; break; } } if (_da >= 0) { selectRow(target, _da); } } }; function unSelectRow(target, index) { var opts = $.data(target, "datagrid").options; var pnl = $.data(target, "datagrid").panel; var data = $.data(target, "datagrid").data; var selectRows = $.data(target, "datagrid").selectedRows; if (index < 0 || index >= data.rows.length) { return; } var pnlBody = pnl.find("div.datagrid-body"); var tr = $("tr[datagrid-row-index=" + index + "]", pnlBody); var ck = $("tr[datagrid-row-index=" + index + "] div.datagrid-cell-check input[type=checkbox]", pnlBody); tr.removeClass("datagrid-row-selected"); ck.attr("checked", false); var row = data.rows[index]; if (opts.idField) { selectRows.removeById(opts.idField, row[opts.idField]); } opts.onUnselect.call(target, index, row); }; function beginEdit(target, index) { var opts = $.data(target, "datagrid").options; var tr = opts.editConfig.getTr(target, index); var row = opts.editConfig.getRow(target, index); if (tr.hasClass("datagrid-row-editing")) { return; } if (opts.onBeforeEdit.call(target, index, row) == false) { return; } tr.addClass("datagrid-row-editing"); beginEditRow(target, index); resizeEditor(target); tr.find("div.datagrid-editable").each(function () { var filed = $(this).parent().attr("field"); var ed = $.data(this, "datagrid.editor"); ed.actions.setValue(ed.target, row[filed]); }); validateRow(target, index); }; function endEdit(target, index, canceld) { var opts = $.data(target, "datagrid").options; var updatedRows = $.data(target, "datagrid").updatedRows; var insertedRows = $.data(target, "datagrid").insertedRows; var tr = opts.editConfig.getTr(target, index); var row = opts.editConfig.getRow(target, index); if (!tr.hasClass("datagrid-row-editing")) { return; } if (!canceld) { if (!validateRow(target, index)) { return; } var flag = false; var tmpObj = {}; tr.find("div.datagrid-editable").each(function () { var field = $(this).parent().attr("field"); var ed = $.data(this, "datagrid.editor"); var editValue = ed.actions.getValue(ed.target); if (row[field] != editValue) { row[field] = editValue; flag = true; tmpObj[field] = editValue; } }); if (flag) { if (insertedRows.indexOf(row) == -1) { if (updatedRows.indexOf(row) == -1) { updatedRows.push(row); } } } } tr.removeClass("datagrid-row-editing"); destroyEdit(target, index); $(target).datagrid("refreshRow", index); if (!canceld) { opts.onAfterEdit.call(target, index, row, tmpObj); } else { opts.onCancelEdit.call(target, index, row); } }; function getEditors(target, index) { var editors = []; var pnl = $.data(target, "datagrid").panel; var tr = $("div.datagrid-body tr[datagrid-row-index=" + index + "]", pnl); tr.children("td").each(function () { var editorsAry = $(this).find("div.datagrid-editable"); if (editorsAry.length) { var ed = $.data(editorsAry[0], "datagrid.editor"); editors.push(ed); } }); return editors; }; function getEditor(target, options) { var editors = getEditors(target, options.index); for (var i = 0; i < editors.length; i++) { if (editors[i].field == options.field) { return editors[i]; } } return null; }; function beginEditRow(target, index) { var opts = $.data(target, "datagrid").options; var tr = opts.editConfig.getTr(target, index); tr.children("td").each(function () { var cell = $(this).find("div.datagrid-cell"); var thisFiled = $(this).attr("field"); var col = getColOptions(target, thisFiled); if (col && col.editor) { var tmpType, tmpOpts; if (typeof col.editor == "string") { tmpType = col.editor; } else { tmpType = col.editor.type; tmpOpts = col.editor.options; } var tmpEditor = opts.editors[tmpType]; if (tmpEditor) { var cellHtml = cell.html(); var cellOutWidth = cell.outerWidth(); cell.addClass("datagrid-editable"); if ($.boxModel == true) { cell.width(cellOutWidth - (cell.outerWidth() - cell.width())); } cell.html("<table border=\"0\" cellspacing=\"0\" cellpadding=\"1\"><tr><td></td></tr></table>"); cell.children("table").attr("align", col.align); cell.children("table").bind("click dblclick contextmenu", function (e) { e.stopPropagation(); }); $.data(cell[0], "datagrid.editor", { actions: tmpEditor, target: tmpEditor.init(cell.find("td"), tmpOpts), field: thisFiled, type: tmpType, oldHtml: cellHtml }); } } }); fixRowHeight(target, index); }; function destroyEdit(target, index) { var opts = $.data(target, "datagrid").options; var tr = opts.editConfig.getTr(target, index); tr.children("td").each(function () { var cell = $(this).find("div.datagrid-editable"); if (cell.length) { var ed = $.data(cell[0], "datagrid.editor"); if (ed.actions.destroy) { ed.actions.destroy(ed.target); } cell.html(ed.oldHtml); $.removeData(cell[0], "datagrid.editor"); var cellOuterWidth = cell.outerWidth(); cell.removeClass("datagrid-editable"); if ($.boxModel == true) { cell.width(cellOuterWidth - (cell.outerWidth() - cell.width())); } } }); }; function validateRow(target, index) { var tr = $.data(target, "datagrid").options.editConfig.getTr(target, index); if (!tr.hasClass("datagrid-row-editing")) { return true; } var vbox = tr.find(".validatebox-text"); vbox.validatebox("validate"); vbox.trigger("mouseleave"); var trAry = tr.find(".validatebox-invalid"); return trAry.length == 0; }; function getChanges(target, type) { var insertedRows = $.data(target, "datagrid").insertedRows; var deletedRows = $.data(target, "datagrid").deletedRows; var updatedRows = $.data(target, "datagrid").updatedRows; if (!type) { var rows = []; rows = rows.concat(insertedRows); rows = rows.concat(deletedRows); rows = rows.concat(updatedRows); return rows; } else { if (type == "inserted") { return insertedRows; } else { if (type == "deleted") { return deletedRows; } else { if (type == "updated") { return updatedRows; } } } } return []; }; function deleteRow(taget, index) { var opts = $.data(taget, "datagrid").options; var data = $.data(taget, "datagrid").data; var insertedRows = $.data(taget, "datagrid").insertedRows; var deletedRows = $.data(taget, "datagrid").deletedRows; var selectedRows = $.data(taget, "datagrid").selectedRows; $(taget).datagrid("cancelEdit", index); var row = data.rows[index]; if (insertedRows.indexOf(row) >= 0) { insertedRows.remove(row); } else { deletedRows.push(row); } selectedRows.removeById(opts.idField, data.rows[index][opts.idField]); opts.view.deleteRow.call(opts.view, taget, index); if (opts.height == "auto") { fixRowHeight(taget); } }; function insertRow(target, param) { var view = $.data(target, "datagrid").options.view; var insertedRows = $.data(target, "datagrid").insertedRows; view.insertRow.call(view, target, param.index, param.row); bindRowEvents(target); insertedRows.push(param.row); }; function appendRow(target, row) { var view = $.data(target, "datagrid").options.view; var insertedRows = $.data(target, "datagrid").insertedRows; view.insertRow.call(view, target, null, row); bindRowEvents(target); insertedRows.push(row); }; function cacheRows(target) { var data = $.data(target, "datagrid").data; var rows = data.rows; var rowAry = []; for (var i = 0; i < rows.length; i++) { rowAry.push($.extend({}, rows[i])); } $.data(target, "datagrid").originalRows = rowAry; $.data(target, "datagrid").updatedRows = []; $.data(target, "datagrid").insertedRows = []; $.data(target, "datagrid").deletedRows = []; }; function acceptChanges(target) { var data = $.data(target, "datagrid").data; var ok = true; for (var i = 0, len = data.rows.length; i < len; i++) { if (validateRow(target, i)) { endEdit(target, i, false); } else { ok = false; } } if (ok) { cacheRows(target); } }; function rejectChanges(target) { var opts = $.data(target, "datagrid").options; var originalRows = $.data(target, "datagrid").originalRows; var insertedRows = $.data(target, "datagrid").insertedRows; var deletedRows = $.data(target, "datagrid").deletedRows; var selectedRows = $.data(target, "datagrid").selectedRows; var data = $.data(target, "datagrid").data; for (var i = 0; i < data.rows.length; i++) { endEdit(target, i, true); } var rowAry = []; for (var i = 0; i < selectedRows.length; i++) { rowAry.push(selectedRows[i][opts.idField]); } selectedRows.splice(0, selectedRows.length); data.total += deletedRows.length - insertedRows.length; data.rows = originalRows; loadData(target, data); for (var i = 0; i < rowAry.length; i++) { selectRecord(target, rowAry[i]); } cacheRows(target); }; function request(target, param) { var pnl = $.data(target, "datagrid").panel; var opts = $.data(target, "datagrid").options; if (param) { opts.queryParams = param; } if (!opts.url) { return; } var queryObj = $.extend({}, opts.queryParams); if (opts.pagination) { $.extend(queryObj, { page: opts.pageNumber, rows: opts.pageSize }); } if (opts.sortName) { $.extend(queryObj, { sort: opts.sortName, order: opts.sortOrder }); } if (opts.onBeforeLoad.call(target, queryObj) == false) { return; } $(target).datagrid("loading"); setTimeout(function () { ajaxRequest(); }, 0); function ajaxRequest() { $.ajax({ type: opts.method, url: opts.url, data: queryObj, dataType: "json", success: function (data) { setTimeout(function () { $(target).datagrid("loaded"); }, 0); parent.closeLoadinglayer(); loadData(target, data); setTimeout(function () { cacheRows(target); }, 0); }, error: function () { setTimeout(function () { $(target).datagrid("loaded"); }, 0); if (opts.onLoadError) { opts.onLoadError.apply(target, arguments); } } }); }; }; function mergeCells(target, options) { var rows = $.data(target, "datagrid").data.rows; var pnl = $.data(target, "datagrid").panel; options.rowspan = options.rowspan || 1; options.colspan = options.colspan || 1; if (options.index < 0 || options.index >= rows.length) { return; } if (options.rowspan == 1 && options.colspan == 1) { return; } var findRow = rows[options.index][options.field]; var tr = pnl.find("div.datagrid-body tr[datagrid-row-index=" + options.index + "]"); var td = tr.find("td[field=" + options.field + "]"); td.attr("rowspan", options.rowspan).attr("colspan", options.colspan); td.addClass("datagrid-td-merged"); for (var i = 1; i < options.colspan; i++) { td = td.next(); td.hide(); rows[options.index][td.attr("field")] = findRow; } for (var i = 1; i < options.rowspan; i++) { tr = tr.next(); var td = tr.find("td[field=" + options.field + "]").hide(); rows[options.index + i][td.attr("field")] = findRow; for (var j = 1; j < options.colspan; j++) { td = td.next(); td.hide(); rows[options.index + i][td.attr("field")] = findRow; } } setTimeout(function () { fixCellWidth(target); }, 0); }; $.fn.datagrid = function (options, param) { if (typeof options == "string") { return $.fn.datagrid.methods[options](this, param); } options = options || {}; return this.each(function () { var state = $.data(this, "datagrid"); var opts; if (state) { opts = $.extend(state.options, options); state.options = opts; } else { opts = $.extend({}, $.fn.datagrid.defaults, $.fn.datagrid.parseOptions(this), options); $(this).css("width", "").css("height", ""); var wrapResult = wrapGrid(this, opts.rownumbers); if (!opts.columns) { opts.columns = wrapResult.columns; } if (!opts.frozenColumns) { opts.frozenColumns = wrapResult.frozenColumns; } $.data(this, "datagrid", { options: opts, panel: wrapResult.panel, selectedRows: [], data: { total: 0, rows: [] }, originalRows: [], updatedRows: [], insertedRows: [], deletedRows: [] }); } initDatagrid(this); if (!state) { var data = getData(this); if (data.total > 0) { loadData(this, data); cacheRows(this); } } setSize(this); if (opts.url) { request(this); } bindCellsEvents(this); }); }; var editorsObj = { text: { init: function (container, options) { var gridInput = $("<input type=\"text\" class=\"datagrid-editable-input\">").appendTo(container); return gridInput; }, getValue: function (target) { return $(target).val(); }, setValue: function (target, value) { $(target).val(value); }, resize: function (target, width) { var targetObj = $(target); if ($.boxModel == true) { targetObj.width(width - (targetObj.outerWidth() - targetObj.width())); } else { targetObj.width(width); } } }, textarea: { init: function (container, options) { var gridTextAreaObj = $("<textarea class=\"datagrid-editable-input\"></textarea>").appendTo(container); return gridTextAreaObj; }, getValue: function (target) { return $(target).val(); }, setValue: function (target, value) { $(target).val(value); }, resize: function (target, width) { var targetObj = $(target); if ($.boxModel == true) { targetObj.width(width - (targetObj.outerWidth() - targetObj.width())); } else { targetObj.width(width); } } }, checkbox: { init: function (container, options) { var gridCheckBoxObj = $("<input type=\"checkbox\">").appendTo(container); gridCheckBoxObj.val(options.on); gridCheckBoxObj.attr("offval", options.off); return gridCheckBoxObj; }, getValue: function (target) { if ($(target).attr("checked")) { return $(target).val(); } else { return $(target).attr("offval"); } }, setValue: function (target, value) { if ($(target).val() == value) { $(target).attr("checked", true); } else { $(target).attr("checked", false); } } }, numberbox: { init: function (container, options) { var gridNumBoxObj = $("<input type=\"text\" class=\"datagrid-editable-input\">").appendTo(container); gridNumBoxObj.numberbox(options); return gridNumBoxObj; }, destroy: function (target) { $(target).numberbox("destroy"); }, getValue: function (target) { return $(target).val(); }, setValue: function (target, value) { $(target).val(value); }, resize: function (target, width) { var targetObj = $(target); if ($.boxModel == true) { targetObj.width(width - (targetObj.outerWidth() - targetObj.width())); } else { targetObj.width(width); } } }, validatebox: { init: function (container, options) { var gridvalidateBoxObj = $("<input type=\"text\" class=\"datagrid-editable-input\">").appendTo(container); gridvalidateBoxObj.validatebox(options); return gridvalidateBoxObj; }, destroy: function (target) { $(target).validatebox("destroy"); }, getValue: function (target) { return $(target).val(); }, setValue: function (target, value) { $(target).val(value); }, resize: function (taget, width) { var targetObj = $(taget); if ($.boxModel == true) { targetObj.width(width - (targetObj.outerWidth() - targetObj.width())); } else { targetObj.width(width); } } }, datebox: { init: function (container, options) { var gridDateBoxObj = $("<input type=\"text\">").appendTo(container); gridDateBoxObj.datebox(options); return gridDateBoxObj; }, destroy: function (target) { $(target).datebox("destroy"); }, getValue: function (target) { return $(target).datebox("getValue"); }, setValue: function (target, value) { $(target).datebox("setValue", value); }, resize: function (target, width) { $(target).datebox("resize", width); } }, combobox: { init: function (container, options) { var gridcomboxObj = $("<input type=\"text\">").appendTo(container); gridcomboxObj.combobox(options || {}); return gridcomboxObj; }, destroy: function (target) { $(target).combobox("destroy"); }, getValue: function (target) { return $(target).combobox("getValue"); }, setValue: function (target, value) { $(target).combobox("setValue", value); }, resize: function (target, width) { $(target).combobox("resize", width); } }, combotree: { init: function (container, options) { var gridcombotreeObj = $("<input type=\"text\">").appendTo(container); gridcombotreeObj.combotree(options); return gridcombotreeObj; }, destroy: function (target) { $(target).combotree("destroy"); }, getValue: function (target) { return $(target).combotree("getValue"); }, setValue: function (target, value) { $(target).combotree("setValue", value); }, resize: function (target, width) { $(target).combotree("resize", width); } } }; $.fn.datagrid.methods = { options: function (jq) { var opts = $.data(jq[0], "datagrid").options; var pnlOpts = $.data(jq[0], "datagrid").panel.panel("options"); var opts = $.extend(opts, { width: pnlOpts.width, height: pnlOpts.height, closed: pnlOpts.closed, collapsed: pnlOpts.collapsed, minimized: pnlOpts.minimized, maximized: pnlOpts.maximized }); var pager = jq.datagrid("getPager"); if (pager.length) { var pagerOpts = pager.pagination("options"); $.extend(opts, { pageNumber: pagerOpts.pageNumber, pageSize: pagerOpts.pageSize }); } return opts; }, getPanel: function (jq) { return $.data(jq[0], "datagrid").panel; }, getPager: function (jq) { return $.data(jq[0], "datagrid").panel.find("div.datagrid-pager"); }, getColumnFields: function (jq, frozen) { return getColumnFiles(jq[0], frozen); }, getColumnOption: function (jq, filed) { return getColOptions(jq[0], filed); }, resize: function (jq, params) { return jq.each(function () { setSize(this, params); }); }, load: function (jq, param) { return jq.each(function () { var opts = $(this).datagrid("options"); opts.pageNumber = 1; var pager = $(this).datagrid("getPager"); pager.pagination({ pageNumber: 1 }); request(this, param); }); }, reload: function (jq, param) { return jq.each(function () { request(this, param); }); }, reloadFooter: function (jq, footer) { return jq.each(function () { var opts = $.data(this, "datagrid").options; var view = $(this).datagrid("getPanel").children("div.datagrid-view"); var view1 = view.children("div.datagrid-view1"); var view2 = view.children("div.datagrid-view2"); if (footer) { $.data(this, "datagrid").footer = footer; } if (opts.showFooter) { opts.view.renderFooter.call(opts.view, this, view2.find("div.datagrid-footer-inner"), false); opts.view.renderFooter.call(opts.view, this, view1.find("div.datagrid-footer-inner"), true); if (opts.view.onAfterRender) { opts.view.onAfterRender.call(opts.view, this); } $(this).datagrid("fixRowHeight"); } }); }, loading: function (jq) { return jq.each(function () { var opts = $.data(this, "datagrid").options; $(this).datagrid("getPager").pagination("loading"); if (opts.loadMsg) { var wrap = $(this).datagrid("getPanel"); $("<div class=\"datagrid-mask\"></div>").css({ display: "block", width: wrap.width(), height: wrap.height() }).appendTo(wrap); $("<div class=\"datagrid-mask-msg\"></div>").html(opts.loadMsg).appendTo(wrap).css({ display: "block", left: (wrap.width() - $("div.datagrid-mask-msg", wrap).outerWidth()) / 2, top: (wrap.height() - $("div.datagrid-mask-msg", wrap).outerHeight()) / 2 }); } }); }, loaded: function (jq) { return jq.each(function () { $(this).datagrid("getPager").pagination("loaded"); var pnl = $(this).datagrid("getPanel"); pnl.children("div.datagrid-mask-msg").remove(); pnl.children("div.datagrid-mask").remove(); }); }, fitColumns: function (jq) { return jq.each(function () { fixColumnWidth(this); }); }, fixColumnSize: function (jq) { return jq.each(function () { fixColumnSize(this); }); }, fixRowHeight: function (jq, index) { return jq.each(function () { fixRowHeight(this, index); }); }, loadData: function (jq, data) { return jq.each(function () { loadData(this, data); cacheRows(this); }); }, getData: function (jq) { return $.data(jq[0], "datagrid").data; }, getRows: function (jq) { return $.data(jq[0], "datagrid").data.rows; }, getFooterRows: function (jq) { return $.data(jq[0], "datagrid").footer; }, getRowIndex: function (jq, id) { return getRowIndex(jq[0], id); }, getSelected: function (jq) { var rows = getSelectRows(jq[0]); return rows.length > 0 ? rows[0] : null; }, getSelections: function (jq) { return getSelectRows(jq[0]); }, clearSelections: function (jq) { return jq.each(function () { clearSelections(this); }); }, selectAll: function (jq) { return jq.each(function () { selectAll(this); }); }, unselectAll: function (jq) { return jq.each(function () { clearSelectRows(this); }); }, selectRow: function (jq, index) { return jq.each(function () { selectRow(this, index); }); }, selectRecord: function (jq, id) { return jq.each(function () { selectRecord(this, id); }); }, unselectRow: function (jq, index) { return jq.each(function () { unSelectRow(this, index); }); }, beginEdit: function (jq, index) { return jq.each(function () { beginEdit(this, index); }); }, endEdit: function (jq, index) { return jq.each(function () { endEdit(this, index, false); }); }, cancelEdit: function (jq, index) { return jq.each(function () { endEdit(this, index, true); }); }, getEditors: function (jq, index) { return getEditors(jq[0], index); }, getEditor: function (jq, options) { return getEditor(jq[0], options); }, refreshRow: function (jq, index) { return jq.each(function () { var opts = $.data(this, "datagrid").options; opts.view.refreshRow.call(opts.view, this, index); }); }, validateRow: function (jq, index) { return validateRow(jq[0], index); }, updateRow: function (jq, param) { return jq.each(function () { var opts = $.data(this, "datagrid").options; opts.view.updateRow.call(opts.view, this, param.index, param.row); }); }, appendRow: function (jq, row) { return jq.each(function () { appendRow(this, row); }); }, insertRow: function (jq, param) { return jq.each(function () { insertRow(this, param); }); }, deleteRow: function (jq, index) { return jq.each(function () { deleteRow(this, index); }); }, getChanges: function (jq, type) { return getChanges(jq[0], type); }, acceptChanges: function (jq) { return jq.each(function () { acceptChanges(this); }); }, rejectChanges: function (jq) { return jq.each(function () { rejectChanges(this); }); }, mergeCells: function (jq, options) { return jq.each(function () { mergeCells(this, options); }); }, showColumn: function (jq, filed) { return jq.each(function () { var pnl = $(this).datagrid("getPanel"); pnl.find("td[field=" + filed + "]").show(); $(this).datagrid("getColumnOption", filed).hidden = false; $(this).datagrid("fitColumns"); }); }, hideColumn: function (jq, filed) { return jq.each(function () { var pnl = $(this).datagrid("getPanel"); pnl.find("td[field=" + filed + "]").hide(); $(this).datagrid("getColumnOption", filed).hidden = true; $(this).datagrid("fitColumns"); }); } }; $.fn.datagrid.parseOptions = function (target) { var t = $(target); return $.extend({}, $.fn.panel.parseOptions(target), { fitColumns: (t.attr("fitColumns") ? t.attr("fitColumns") == "true" : undefined), striped: (t.attr("striped") ? t.attr("striped") == "true" : undefined), nowrap: (t.attr("nowrap") ? t.attr("nowrap") == "true" : undefined), rownumbers: (t.attr("rownumbers") ? t.attr("rownumbers") == "true" : undefined), singleSelect: (t.attr("singleSelect") ? t.attr("singleSelect") == "true" : undefined), pagination: (t.attr("pagination") ? t.attr("pagination") == "true" : undefined), pageSize: (t.attr("pageSize") ? parseInt(t.attr("pageSize")) : undefined), pageList: (t.attr("pageList") ? eval(t.attr("pageList")) : undefined), remoteSort: (t.attr("remoteSort") ? t.attr("remoteSort") == "true" : undefined), showHeader: (t.attr("showHeader") ? t.attr("showHeader") == "true" : undefined), showFooter: (t.attr("showFooter") ? t.attr("showFooter") == "true" : undefined), scrollbarSize: (t.attr("scrollbarSize") ? parseInt(t.attr("scrollbarSize")) : undefined), loadMsg: (t.attr("loadMsg") != undefined ? t.attr("loadMsg") : undefined), idField: t.attr("idField"), toolbar: t.attr("toolbar"), url: t.attr("url") }); }; var renderView = { render: function (target, container, frozen) { var opts = $.data(target, "datagrid").options; var rows = $.data(target, "datagrid").data.rows; var closFileds = $(target).datagrid("getColumnFields", frozen); if (frozen) { if (!(opts.rownumbers || (opts.frozenColumns && opts.frozenColumns.length))) { return; } } var htmlAry = ["<table cellspacing=\"0\" cellpadding=\"0\" border=\"0\"><tbody>"]; for (var i = 0; i < rows.length; i++) { var cls = (i % 2 && opts.striped) ? "class=\"datagrid-row-alt\"" : ""; var rowStyle = opts.rowStyler ? opts.rowStyler.call(target, i, rows[i]) : ""; var strStyle = rowStyle ? "style=\"" + rowStyle + "\"" : ""; htmlAry.push("<tr datagrid-row-index=\"" + i + "\" " + cls + " " + strStyle + ">"); htmlAry.push(this.renderRow.call(this, target, closFileds, frozen, i, rows[i])); htmlAry.push("</tr>"); } htmlAry.push("</tbody></table>"); $(container).html(htmlAry.join("")); }, renderFooter: function (target, container, frozen) { var opts = $.data(target, "datagrid").options; var rows = $.data(target, "datagrid").footer || []; var cols = $(target).datagrid("getColumnFields", frozen); var htmlAry = ["<table cellspacing=\"0\" cellpadding=\"0\" border=\"0\"><tbody>"]; for (var i = 0; i < rows.length; i++) { htmlAry.push("<tr datagrid-row-index=\"" + i + "\">"); htmlAry.push(this.renderRow.call(this, target, cols, frozen, i, rows[i])); htmlAry.push("</tr>"); } htmlAry.push("</tbody></table>"); $(container).html(htmlAry.join("")); }, renderRow: function (target, fileds, frozen, rowIndex, rowData) { var opts = $.data(target, "datagrid").options; var cc = []; if (frozen && opts.rownumbers) { var tmpIndex = rowIndex + 1; if (opts.pagination) { tmpIndex += (opts.pageNumber - 1) * opts.pageSize; } cc.push("<td class=\"datagrid-td-rownumber\"><div class=\"datagrid-cell-rownumber\">" + tmpIndex + "</div></td>"); } for (var i = 0; i < fileds.length; i++) { var findFiled = fileds[i]; var col = $(target).datagrid("getColumnOption", findFiled); if (col) { var findStyler = col.styler ? (col.styler(rowData[findFiled], rowData, rowIndex) || "") : ""; var strFindStyler = col.hidden ? "style=\"display:none;" + findStyler + "\"" : (findStyler ? "style=\"" + findStyler + "\"" : ""); cc.push("<td field=\"" + findFiled + "\" " + strFindStyler + ">"); var strFindStyler = "width:" + (col.boxWidth) + "px;"; strFindStyler += "text-align:" + (col.align || "left") + ";"; strFindStyler += opts.nowrap == false ? "white-space:normal;" : ""; cc.push("<div style=\"" + strFindStyler + "\" "); if (col.checkbox) { cc.push("class=\"datagrid-cell-check "); } else { cc.push("class=\"datagrid-cell "); } cc.push("\">"); if (col.checkbox) { cc.push("<input type=\"checkbox\"/>"); } else { if (col.formatter) { cc.push(col.formatter(rowData[findFiled], rowData, rowIndex)); } else { cc.push(rowData[findFiled]); } } cc.push("</div>"); cc.push("</td>"); } } return cc.join(""); }, refreshRow: function (target, rowIndex) { var rows = $(target).datagrid("getRows"); this.updateRow.call(this, target, rowIndex, rows[rowIndex]); }, updateRow: function (target, rowIndex, row) { var opts = $.data(target, "datagrid").options; var pnl = $(target).datagrid("getPanel"); var rows = $(target).datagrid("getRows"); var tr = pnl.find("div.datagrid-body tr[datagrid-row-index=" + rowIndex + "]"); for (var tmpfiled in row) { rows[rowIndex][tmpfiled] = row[tmpfiled]; var td = tr.children("td[field=" + tmpfiled + "]"); var cell = td.find("div.datagrid-cell"); var col = $(target).datagrid("getColumnOption", tmpfiled); if (col) { var findStyler = col.styler ? col.styler(rows[rowIndex][tmpfiled], rows[rowIndex], rowIndex) : ""; td.attr("style", findStyler || ""); if (col.hidden) { td.hide(); } if (col.formatter) { cell.html(col.formatter(rows[rowIndex][tmpfiled], rows[rowIndex], rowIndex)); } else { cell.html(rows[rowIndex][tmpfiled]); } } } var findStyler = opts.rowStyler ? opts.rowStyler.call(target, rowIndex, rows[rowIndex]) : ""; tr.attr("style", findStyler || ""); $(target).datagrid("fixRowHeight", rowIndex); }, insertRow: function (target, rowIndex, row) { var opts = $.data(target, "datagrid").options; var data = $.data(target, "datagrid").data; var view = $(target).datagrid("getPanel").children("div.datagrid-view"); var view1 = view.children("div.datagrid-view1"); var view2 = view.children("div.datagrid-view2"); if (rowIndex == undefined || rowIndex == null) { rowIndex = data.rows.length; } if (rowIndex > data.rows.length) { rowIndex = data.rows.length; } for (var i = data.rows.length - 1; i >= rowIndex; i--) { view2.children("div.datagrid-body").find("tr[datagrid-row-index=" + i + "]").attr("datagrid-row-index", i + 1); var tr = view1.children("div.datagrid-body").find("tr[datagrid-row-index=" + i + "]").attr("datagrid-row-index", i + 1); if (opts.rownumbers) { tr.find("div.datagrid-cell-rownumber").html(i + 2); } } var frozenCols = $(target).datagrid("getColumnFields", true); var fitCols = $(target).datagrid("getColumnFields", false); var tr1 = "<tr datagrid-row-index=\"" + rowIndex + "\">" + this.renderRow.call(this, target, frozenCols, true, rowIndex, row) + "</tr>"; var tr2 = "<tr datagrid-row-index=\"" + rowIndex + "\">" + this.renderRow.call(this, target, fitCols, false, rowIndex, row) + "</tr>"; if (rowIndex >= data.rows.length) { var view1BodyInner = view1.children("div.datagrid-body").children("div.datagrid-body-inner"); var view2Body = view2.children("div.datagrid-body"); if (data.rows.length) { view1BodyInner.find("tr:last[datagrid-row-index]").after(tr1); view2Body.find("tr:last[datagrid-row-index]").after(tr2); } else { view1BodyInner.html("<table cellspacing=\"0\" cellpadding=\"0\" border=\"0\"><tbody>" + tr1 + "</tbody></table>"); view2Body.html("<table cellspacing=\"0\" cellpadding=\"0\" border=\"0\"><tbody>" + tr2 + "</tbody></table>"); } } else { view1.children("div.datagrid-body").find("tr[datagrid-row-index=" + (rowIndex + 1) + "]").before(tr1); view2.children("div.datagrid-body").find("tr[datagrid-row-index=" + (rowIndex + 1) + "]").before(tr2); } data.total += 1; data.rows.splice(rowIndex, 0, row); this.refreshRow.call(this, target, rowIndex); }, deleteRow: function (target, rowIndex) { var opts = $.data(target, "datagrid").options; var data = $.data(target, "datagrid").data; var view = $(target).datagrid("getPanel").children("div.datagrid-view"); var view1 = view.children("div.datagrid-view1"); var view2 = view.children("div.datagrid-view2"); view1.children("div.datagrid-body").find("tr[datagrid-row-index=" + rowIndex + "]").remove(); view2.children("div.datagrid-body").find("tr[datagrid-row-index=" + rowIndex + "]").remove(); for (var i = rowIndex + 1; i < data.rows.length; i++) { view2.children("div.datagrid-body").find("tr[datagrid-row-index=" + i + "]").attr("datagrid-row-index", i - 1); var tr = view1.children("div.datagrid-body").find("tr[datagrid-row-index=" + i + "]").attr("datagrid-row-index", i - 1); if (opts.rownumbers) { tr.find("div.datagrid-cell-rownumber").html(i); } } data.total -= 1; data.rows.splice(rowIndex, 1); }, onBeforeRender: function (target, rows) { }, onAfterRender: function (target) { var opts = $.data(target, "datagrid").options; if (opts.showFooter) { var footer = $(target).datagrid("getPanel").find("div.datagrid-footer"); footer.find("div.datagrid-cell-rownumber,div.datagrid-cell-check").css("visibility", "hidden"); } } }; $.fn.datagrid.defaults = $.extend({}, $.fn.panel.defaults, { frozenColumns: null, columns: null, fitColumns: false, toolbar: null, striped: false, method: "post", nowrap: true, idField: null, url: null, loadMsg: "Processing, please wait ...", rownumbers: false, singleSelect: false, pagination: false, pageNumber: 1, pageSize: 10, pageList: [10, 20, 30, 40, 50], queryParams: {}, sortName: null, sortOrder: "asc", remoteSort: true, showHeader: true, showFooter: false, scrollbarSize: 18, rowStyler: function (_1d1, _1d2) { }, loadFilter: function (data) { if (typeof data.length == "number" && typeof data.splice == "function") { return { total: data.length, rows: data }; } else { return data; } }, editors: editorsObj, editConfig: { getTr: function (target, index) { return $(target).datagrid("getPanel").find("div.datagrid-body tr[datagrid-row-index=" + index + "]"); }, getRow: function (target, rowIndex) { return $.data(target, "datagrid").data.rows[rowIndex]; } }, view: renderView, onBeforeLoad: function (param) { }, onLoadSuccess: function () { }, onLoadError: function () { }, onClickRow: function (rowIndex, rowData) { }, onDblClickRow: function (rowIndex, rowData) { }, onClickCell: function (rowIndex, filed, value) { }, onDblClickCell: function (rowIndex, filed, value) { }, onSortColumn: function (sort, order) { }, onResizeColumn: function (filed, width) { }, onSelect: function (rowIndex, rowData) { }, onUnselect: function (rowIndex, rowData) { }, onSelectAll: function (rows) { }, onUnselectAll: function (rows) { }, onBeforeEdit: function (rowIndex, rowData) { }, onAfterEdit: function (rowIndex, rowData, changes) { }, onCancelEdit: function (rowIndex, rowData) { }, onHeaderContextMenu: function (e, filed) { }, onRowContextMenu: function (e, rowIndex, rowData) { } }); })(jQuery);