it-roy-ru.com

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

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

54
maxpower47

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

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

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

79
Bobby Borszich

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

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

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

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

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

22
Anthony M. Powers

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

jQuery(document).ready(function() {

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

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

7
Aaron

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

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

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

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

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

1
queen3

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

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