我正在編寫一個jQuery插件來構建KendoUI網格。一切都很好,直到我不得不在同一頁面中使用2個插件實例。在這種情況下,我需要插件的每個實例都有自己的數據。使用同一個JQuery插件的兩個實例存儲狀態
我讀過jQuery的準則。數據與()存儲數據,而是試圖從插件的代碼之外的訪問時,「getSelectedItem()」是這樣的:
selectedItemGrid1= $("#Grid1").kendoGrid_extended.getSelectedItem();
selectedItemGrid2= $("#Grid2").kendoGrid_extended.getSelectedItem();
我在selectedItemGrid1中獲取Grid2的selectedItem。這裏是我的插件代碼的簡化版本。基本上我想要做的是,只要選中一行網格(kendoGrid定義中的「更改」事件),將新選定的行存儲在插件中,因此當用戶單擊「刪除」按鈕時,讀取該插件將選定行並使用從插件恢復的信息調用刪除操作。
$.fn.kendoGrid_extended = function (options) {
var opts = $.extend({}, $.fn.kendoGrid_extended.defaults, options);
opts.controlId = '#' + this.attr('id');
var gridExtended;
var selectedItem;
var instance = $(this);
//Public accessor for the selectedItem object.
$.fn.kendoGrid_extended.getSelectedItem = function() {
return instance.data('selectedItem');
}
opts.gridDataSource = new kendo.data.DataSource({
type: "json",
serverPaging: true,
serverSorting: true,
sort: sortObject,
serverFiltering: true,
allowUnsort: true,
pageSize: opts.pageSize,
group: opts.group,
transport: {
read: {
url: opts.dataSourceURL,
type: 'POST',
dataType: 'json',
contentType: 'application/json; charset=utf-8',
data: function() { return opts.dataSourceParamsFunction(); }
},
parameterMap: function (options) {
return JSON.stringify(options);
}
},
schema: opts.dataSourceSchema,
});
gridExtended = $(opts.controlId).kendoGrid({
columns: opts.gridColumns,
dataSource: opts.gridDataSource,
pageable: {
refresh: true,
pageSizes: true
},
groupable: opts.groupable,
sortable: { mode: "multiple" },
filterable: false,
selectable: true,
scrollable: true,
resizable: true,
reorderable: true,
columnReorder: SetColumnsReorder,
columnResize: SetColumnsResize,
change: function() {
var gridChange = this;
gridChange.select().each(function() {
selectedItem = gridChange.dataItem($(this));
instance.data('selectedItem', selectedItem);
});
}
});
}
代碼本身它是我的插件的簡化版本。我知道這可能不是編寫插件的最佳方式,因爲我已經閱讀了jQuery插件開發指南。如果你能指向正確的方向或告訴我爲什麼我的代碼無法正常工作,那將是非常棒的。提前感謝!