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

Я просто хочу расширить предложение 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>

Эта функция встроена в 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} 
               }
             ],
   ...
};

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

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

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

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

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

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

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

jQuery(document).ready(function() {

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

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

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

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

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

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

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

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

Функция, которая отображает отображаемые / скрытые столбцы. #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
            } });