Ukryte kolumny w jqGrid

Question

Czy istnieje sposób na ukrycie kolumny w tabeli jqGrid, ale czy jest ona wyświetlana jako tylko do odczytu, gdy wiersz jest edytowany w oknie dialogowym modemu edytora formularzy?

Answer 1

prostu chcą rozwinąć queen3 „s sugestia, stosując następujące załatwia sprawę:

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

Scenariusz # 1:

• Pole musi być widoczny w sieci
• Pole musi być widoczne w formularzu
• Pole musi być tylko do odczytu

Rozwiązanie:

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

providerUserId jest widoczna w sieci i widoczny podczas edycji formularza. Ale nie możesz edytować zawartości.

---

Scenariusz nr 2:

• Pole nie może być widoczna w sieci
• Pole musi być widoczne w postaci
• Pole musi być tylko do odczytu

Rozwiązanie:

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"); 
          } 
        } 
     }, 
     ] 

Zauważ, że w obu przypadkach używam jq do odwoływania się do jquery zamiast zwykłego $. W moim HTML Mam następujący skrypt do modyfikacji zmiennej używanej przez jQuery:

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

Answer 2

Można użyć następującego kodu, aby ukryć kolumnę tabeli ..

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

I można użyć następującego kodu, aby pokazać go ponownie.

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

za pytanie, można wywołać hideCol() kod na document.ready(), można powiązać showCol() kod na edycję okna dialogowego/kliknij zdarzenie.

Answer 3

Ta funkcja jest wbudowana w jqGrid.

skonfiguruj swoją funkcję siatki w następujący sposób.

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

Istnieją inne editrules, które mogą być stosowane, ale ta podstawowa konfiguracja ukryje wynagrodzenie menedżera w widoku siatki, ale pozwoliłyby edycję, gdy został wyświetlony formularz edycji.

Answer 4

spróbuje użyć edithidden: true, a także zrobić

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

Albo zobaczyć jqGrid wiki do edycji niestandardowych można skonfigurować dowolny typ wejścia, nawet etykieta myślę.

Answer 5

Ten wątek jest dość stary, jak sądzę, ale na wypadek, gdyby ktoś inny natknął się na to pytanie ... Musiałem pobrać wartość z wybranego wiersza tabeli, ale nie chciałem pokazywać kolumny, która rząd był z. Używałem hideCol, ale miałem ten sam problem, co Andy, gdzie wyglądało to niechlujnie. Aby to naprawić (nazwijmy to hackem), po prostu ponownie ustawiam szerokość siatki.

jQuery(document).ready(function() { 

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

Ponieważ moje szerokości wiersza są automatyczne, kiedy zresetować szerokość tabeli to zresetować szerokości kolumn, ale wykluczyć ukryty jeden, więc wypełnić luki.

Answer 6

Aby ukryć kolumnę siatki

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

Answer 7

To jest trochę stary, ten post. Ale to jest mój kod do pokazywania/ukrywania kolumn. Używam wbudowanej funkcji do wyświetlania kolumn i po prostu zaznacz je.

Funkcja wyświetlająca wyświetlane kolumny/ukryte kolumny. #jqGrid to nazwa mojej siatki, a columnChooser to selektor kolumn jqGrid.

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