Скрытые столбцы в jqGrid

Question

Есть ли способ скрыть столбец в таблице jqGrid, но он будет отображаться только для чтения при редактировании строки в модальном диалоговом окне редактора форм?

Answer 1

Эта функция встроена в jqGrid.

настройте функцию сетки следующим образом.

$('#myGrid').jqGrid({
   ...
   colNames: ['Manager', 'Name', 'HiddenSalary'],
   colModel: [               
               { name: 'Manager', editable: true },
               { name: 'Price', editable: true },
               { name: 'HiddenSalary', hidden: true , editable: true, 
                  editrules: {edithidden:true} 
               }
             ],
   ...
};

Существуют и другие правила редактирования, которые можно применять, но эта базовая настройка скрывает зарплату менеджера в виде сетки, но разрешает редактирование при отображении формы редактирования.

Answer 2

Я просто хочу расширить предложение queen3 , применяя следующее:

editoptions: { 
              dataInit: function(element) { 
                          $(element).attr("readonly", "readonly"); 
                        } 
             }

Сценарий № 1 :

• Поле должно быть видно в сетке
• Поле должно быть видно в виде
• Поле должно быть только для чтения

Решение

colModel:[
        {  name:'providerUserId',
               index:'providerUserId', 
               width:100,editable:true, 
               editrules:{required:true}, 
               editoptions:{ 
                            dataInit: function(element) { 
                                  jq(element).attr("readonly", "readonly"); 
                             } 
                           }
            },
],

providerUserId отображается в сетке и отображается при редактировании формы. Но вы не можете редактировать содержимое.

---

Сценарий № 2 :

• Поле не должно быть видно в сетке
• Поле должно быть видно в виде
• Поле должно быть только для чтения

Решение

colModel:[
           {name:'providerUserId',
            index:'providerUserId', 
            width:100,editable:true, 
            editrules:{
                         required:true, 
                         edithidden:true
                      },
            hidden:true, 
            editoptions:{ 
                  dataInit: function(element) {                     
                             jq(element).attr("readonly", "readonly"); 
                          } 
                     }
         },
        ]

Обратите внимание, что в обоих случаях я использую jq для ссылки на jquery вместо обычного $. В моем HTML есть следующий скрипт для изменения переменной, используемой jQuery:

<script type="text/javascript">
    var jq = jQuery.noConflict();
</script>

Answer 3

Вы можете использовать следующий код, чтобы скрыть столбец таблицы ..

JQuery("tableName").hideCol("colName");

И вы можете использовать следующий код, чтобы показать его снова.

JQuery("tableName").showCol("colName");

По вашему вопросу вы можете вызвать код hideCol () для document.ready () и привязать код showCol () к событию редактирования / щелчка диалога.

Answer 4

Полагаю, эта ветка довольно старая, но если кто-нибудь еще наткнется на этот вопрос ... Мне нужно было получить значение из выбранной строки таблицы, но я не хотел показывать столбец, из которого была получена строка. Я использовал hideCol, но у меня была та же проблема, что и у Энди, где это выглядело грязно. Чтобы это исправить (назовите это хаком), я просто заново установил ширину сетки.

jQuery(document).ready(function() {

       jQuery("#ItemGrid").jqGrid({ 
                ..., 
                width: 700,
                ...
        }).hideCol('StoreId').setGridWidth(700)

Поскольку ширина моей строки автоматическая, при сбросе ширины таблицы она сбрасывает ширину столбцов, но исключает скрытую, поэтому они заполняют пробел.

Answer 5

Чтобы скрыть столбец сетки

jQuery("#validGrid").jqGrid('hideCol',str);

Answer 6

Попробуйте использовать edithidden: true, а также сделайте

editoptions: { dataInit: function(element) { $(element).attr("readonly", "readonly"); } }

Или см. Вики jqGrid для пользовательского редактирования, вы можете установить любой тип ввода, даже метку, я думаю.

Answer 7

Это немного старый, этот пост. Но это мой код, чтобы показать / скрыть столбцы. Я использую встроенную функцию для отображения столбцов и просто отмечаю их.

Функция, которая отображает отображаемые / скрытые столбцы. #JqGrid - это имя моей сетки, а columnChooser - это средство выбора столбцов jqGrid.

  function showHideColumns() {
        $('#jqGrid').jqGrid('columnChooser', {
            width: 250,
            dialog_opts: {
                modal: true,
                minWidth: 250,
                height: 300,
                show: 'blind',
                hide: 'explode',
                dividerLocation: 0.5
            } });