JQGrid: Сброс столбцов в исходный Заказ и состояние

Question

Я использую jqGrid с опцией sortable:true, а также с помощью плагина columnChooser. Я хотел бы создать кнопку сброса, которая будет

1. REORDER столбцы в исходное состояние
2. Добавить обратно все столбцы, которые могли быть скрыты columnChooser плагин. Это я смог выполнить, используя предоставленный ответ here

Однако, как выполнить первую точку, переупорядочивающую колонку в исходное состояние.

Answer 1

Restore hidden Состояние всех столбцов очень простое, и вы нашли уже соответствующие примеры кода. Таким образом, я отвечаю, как сбросить порядок столбцов.

Проблема заключается в том, что метод remapColumns, который может использоваться для изменения порядка столбцов, использует номера столбцов вместо имен столбцов. Такая же проблема существует во многих других методах или внутренних параметрах jqGrid. Чтобы использовать метод remapColumns, вам необходимо использовать индекс столбцов на основе текущего порядка. После того, как пользователь несколько раз изменил порядок столбцов, было бы трудно предоставить номера столбцов, которые вы хотите иметь относительно текущего порядка столбцов. Было бы намного проще удерживать имена столбцов вместо индексов столбцов.

Я разработал free jqGrid как вилку jqGrid после того, как Тони изменил лицензионное соглашение jqGrid и переименовал его в Guriddo jqGrid JS. Я внедрил много изменений в jqGrid, что мешает мне и реализовало много новых функций. Один из изменений заключался в перемещении всех внутренних опций на сохранение имен вместо индексов, насколько это было возможно, без нарушения совместимости с предыдущими версиями. Я добавил метод remapColumnsByName, что упрощает использование переупорядочения столбцов (см. the answer с the demo).

Реализация ваших требований в бесплатном jqGrid может быть очень простой. Вам нужно просто сохранить исходный порядок столбцов в массиве, а затем использовать его в качестве параметра remapColumnsByName сбросить столбцы

$("#grid1").jqGrid({ 
    ... 
    onInitGrid: function() { 
     var p = $(this).jqGrid("getGridParam"); 
     // save names of columns in custom option of jqGrid 
     p.originalColumnOrder = $.map(p.colModel, function (cm) { 
      return cm.name; 
     }); 
     //alert(JSON.stringify(p.originalColumnOrder)); 
    } 
}).jqGrid("navGrid", { add: false, edit: false, del: false }) 
.jqGrid("navButtonAdd", { 
    buttonicon: "fa-repeat", 
    caption: "", 
    title: "Reset original column order", 
    onClickButton: function() { 
     var $self = $(this), p = $self.jqGrid("getGridParam"); 
     $self.jqGrid("remapColumnsByName", p.originalColumnOrder, true); 
    }}); 

Смотреть демо https://jsfiddle.net/OlegKi/r6b2os5b/2/

Если вы не можете перенести, чтобы освободить jqGrid из-за некоторые причины, то вы должны моделировать то же поведение. Вы должны сохранить исходный порядок столбцов как массив имен столбцов, а затем преобразовать имена в индексы непосредственно перед вызовом remapColumns. Он тоже должен работать.

Answer 2

Мне удалось создать функцию «сбросить столбцы» с помощью нашей сетки, основанной на некоторых ответах, которые я читал в дискуссиях (я хотел бы отдать должное, но это ловушка многих различных решений для разных вопросов и я не отслеживал их всех).

Он восстановит видимость, порядок столбцов и замороженный статус. Также работает, если состояние столбца было изменено с помощью новой функциональности меню столбца.

(dgColModel глобальный переменная, которая содержит мой оригинальный colModel)

function resetColumns(grid) { 
    //remapArray: 0 is the rownumber, 1 is the selection checkbox 
    var i = 0, cmi, l = dgColModel.length, remapArray = [0, 1]; 
    for (; i < l; i++){ 
    cmi = dgColModel[i]; 
    if (typeof cmi.hidden === 'undefined' || cmi.hidden === false){ 
     grid.jqGrid('showCol', cmi.name); 
    } else { 
     grid.jqGrid('hideCol', cmi.name); 
    } 
    if (typeof cmi.frozen === 'undefined' || cmi.frozen === false){ 
     grid.jqGrid('setColProp', cmi.name, { frozen: false }); 
    } else { 
     grid.jqGrid('setColProp', cmi.name, { frozen: true }); 
    } 
    remapArray.push(getColumnIndexByName(grid, cmi.name)); 
    } 
    grid.jqGrid("destroyFrozenColumns"); 
    grid.remapColumns(remapArray, true); 
    grid.jqGrid("setFrozenColumns"); 
} 

function getColumnIndexByName(grid, columnName) 
{ 
    var cm = grid.jqGrid('getGridParam','colModel'),i=0,l=cm.length; 
    for (; i<l; i++) { 
    if (cm[i].name===columnName) { 
     return i; // return the index 
    } 
    } 
    return -1; 
}; 

Надеется, что это может стать реальной функцией сетки где-то вниз линии (colModel может сохраняться, когда сетка инстанциирована), но в среднее время это работает очень хорошо.

Надеюсь, это поможет!

Answer 3

Перегруппируйте колонны в исходное состояние

Я просто наткнулся на этот вопрос, я реализовал эту функцию с помощью простого яваскрипта функции.

Сначала получите порядок столбцов, когда сетка инициализируется:

var initialcolumnorder = $("#Grid").getGridParam('colNames'); 

Вызов ниже функции, где требуется с initialcolumnorder в качестве параметра

function resetColumnOrder(initialcolumnorder) 
{ 
    var currentColumnOrder = $("#Grid").getGridParam('colNames'); 
    var columnMappingArray = []; 
    $.each(initialcolumnorder, function (index, value) { 
     var currentIndex = $.inArray(value, currentColumnOrder); 
     columnMappingArray.push(currentIndex); 
    }); 

    $("#Grid").remapColumns(columnMappingArray, true, false); 
}