Я кодирую плагин jQuery для создания сетей KendoUI. Все было в порядке, пока мне не пришлось использовать 2 экземпляра плагина на одной странице. В этом случае мне нужно, чтобы каждый экземпляр плагина имел свои собственные данные.
Я прочитал инструкции jQuery для хранения данных с помощью.data(), но при попытке доступа извне кода плагина в getSelectedItem() следующим образом:
selectedItemGrid1= $("#Grid1").kendoGrid_extended.getSelectedItem();
selectedItemGrid2= $("#Grid2").kendoGrid_extended.getSelectedItem();
Я получаю selectedItem из Grid2 в selectedItemGrid1. Вот упрощенная версия моего плагина. В основном, что я хотел сделать, в любое время выбирается строка сетки (событие "change" в определении 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 для разработки плагинов. Было бы здорово, если бы вы могли указать мне в правильном направлении или сказать мне, почему мой код не работает. Заранее большое спасибо!
Я, наконец, решил, что добавляет скрытый ввод с уникальным идентификатором в сетку помощника. На этом скрытом входе я сохраняю все данные, которые я хочу быть постоянными с JQuery.data().
Поэтому, если я создаю 2 сетки с помощью плагина, каждая сетка будет добавлена примерно так:
<input type="hidden" id="uniqueIdHere" />
Я думаю, что вам не нужен этот "публичный аксессор", который вы написали, я думаю, вы действительно можете получить его так:
selectedItemGrid1= $("#Grid1").data('selectedItem);
selectedItemGrid2= $("#Grid2").data('selectedItem);
На стороне вам не нужно обертывать этот элемент экземпляра в объект jQuery. Вы все еще можете использовать остальные методы jQuery, проверьте пример.