是否可以更改jqGrid的edittype的editoptions值：「select」？

Question

我正在使用jqGrid 3.8.1。我想根據另一個組合框的選定值更改組合框的下拉值。這就是爲什麼我正在尋找如何更改edittype:"select"的editoptions:value。

下面是樣品的jqGrid代碼：

<%@ page pageEncoding="UTF-8" contentType="text/html;charset=UTF-8"%> 
<script type="text/javascript" src="<c:url value="/js/jquery/grid.locale-ja.js" />" charset="UTF-8"></script> 
<link type="text/css" rel="stylesheet" href="<c:url value="/css/jquery/ui.jqgrid.css" />"/> 
<script src="<c:url value="/js/jquery/jquery.jqGrid.min.js" />" type="text/javascript"></script> 
<table id="rowed5"></table> 
<script type="text/javascript" charset="utf-8"> 
var lastsel2; 
$("#rowed5").jqGrid({ 
    datatype: "local", 
    height: 250, 
    colNames:['ID Number','Name', 'Stock', 'Ship via','Notes'], 
    colModel:[ 
     {name:'id',index:'id', width:90, sorttype:"int", editable: true}, 
     {name:'name',index:'name', width:150,editable: true,editoptions:{size:"20",maxlength:"30"}}, 
     {name:'stock',index:'stock', width:60, editable: true,edittype:"checkbox",editoptions: {value:"Yes:No"}}, 
     {name:'ship',index:'ship', width:90, editable: true,edittype:"select",editoptions:{value:"FE:FedEx;IN:InTime;TN:TNT;AR:ARAMEX;AR1:ARAMEX123456789"}},  
     {name:'note',index:'note', width:200, sortable:false,editable: true,edittype:"textarea", editoptions:{rows:"2",cols:"10"}}  
    ], 
    caption: "Input Types", 
    resizeStop: function (newwidth, index) { 
     var selectedRowId = $("#rowed5").getGridParam('selrow'); 
     if(selectedRowId) { 
      //resize combobox proportionate to column size 
      var selectElement = $('[id="' + selectedRowId + '_ship"][role="select"]'); 
      if(selectElement.length > 0){ 
       $(selectElement).width(newwidth); 
      } 
     } 
    } 
    , 
    onSelectRow: function(id){ 
     if(id && id!==lastsel2){ 
      //$(this).saveRow(lastsel2, true); 
      $(this).restoreRow(lastsel2); 
      $(this).editRow(id,true); 

      lastsel2=id; 

      $(this).scroll(); 

      //resize combobox proportionate to column size 
      var rowSelectElements = $('[id^="' + id + '_"][role="select"]'); 
      if(rowSelectElements.length > 0) { 
       $(rowSelectElements).each(function(index, element){ 
        var name = $(element).attr('name'); 
        var columnElement = $('#rowed5_' + name); 
        if(columnElement.length > 0) { 
         var columnWidth = $(columnElement).width(); 
         $(element).width(columnWidth); 
        } 
       }); 
      } 
     } 
    } 
}); 
var mydata2 = [ 
     {id:"12345",name:"Desktop Computer",note:"note",stock:"Yes",ship:"FedEx"}, 
     {id:"23456",name:"Laptop",note:"Long text ",stock:"Yes",ship:"InTime"}, 
     {id:"34567",name:"LCD Monitor",note:"note3",stock:"Yes",ship:"TNT"}, 
     {id:"45678",name:"Speakers",note:"note",stock:"No",ship:"ARAMEX123456789"}, 
     {id:"56789",name:"Laser Printer",note:"note2",stock:"Yes",ship:"FedEx"}, 
     {id:"67890",name:"Play Station",note:"note3",stock:"No", ship:"FedEx"}, 
     {id:"76543",name:"Mobile Telephone",note:"note",stock:"Yes",ship:"ARAMEX"}, 
     {id:"87654",name:"Server",note:"note2",stock:"Yes",ship:"TNT"}, 
     {id:"98765",name:"Matrix Printer",note:"note3",stock:"No", ship:"FedEx"} 
     ]; 
for(var i=0;i < mydata2.length;i++) { 
$("#rowed5").jqGrid('addRowData',mydata2[i].id,mydata2[i]); 
} 
</script> 

場景：

1. 所有ship將被顯示爲初始負載。
2. 如果股票列更改爲Yes,ship將只顯示FedEx,TNT。
3. 如果股票列更改爲No,ship將只顯示InTime,ARAMEX,ARAMEX123456789。

如何更改選項？

Answer 1

我解決了它的試錯法。想要分享它，請參閱下面的代碼片段。 更改在onSelectRow函數上。

onSelectRow: function(id){ 
    if(id && id!==lastsel2){ 
     //$(this).saveRow(lastsel2, true); 
     $(this).restoreRow(lastsel2); 

     // get the selected stock column value before the editRow 
     var stockValue = $("#rowed5").jqGrid('getCell', id, 'stock'); 
     if(stockValue == 'Yes') { 
      $("#rowed5").jqGrid('setColProp', 'ship', { editoptions: { value: 'FE:FedEx;TN:TNT'} }); 
     } else if(stockValue == 'No') { 
      $("#rowed5").jqGrid('setColProp', 'ship', { editoptions: { value: 'IN:InTime;AR:ARAMEX;AR1:ARAMEX123456789'} }); 
     } 

     $(this).editRow(id,true); 

     lastsel2=id; 

     $(this).scroll(); 

     //resize combobox proportionate to column size 
     var rowSelectElements = $('[id^="' + id + '_"][role="select"]'); 
     if(rowSelectElements.length > 0) { 
      $(rowSelectElements).each(function(index, element){ 
       var name = $(element).attr('name'); 
       var columnElement = $('#rowed5_' + name); 
       if(columnElement.length > 0) { 
        var columnWidth = $(columnElement).width(); 
        $(element).width(columnWidth); 
       } 
      }); 
     } 
    } 
}