如何將數據從jqgrid行填充到文本框？

Question

我有一張桌子和使用jqgrid。我想要選擇行，它會自動填寫表稅務箱。老闆有沒有解決辦法，請幫助

<table width="72%" border="0" cellspacing="5" cellpadding="0" style="background-color:#999;"> 

<tr> 
    <th scope="col"></th> 
    <th scope="col">Item Name</th> 
    <th scope="col">Quantity</th> 
    <th scope="col">Rate</th> 
    <th scope="col">M. Unit</th> 
    <th scope="col">Amount</th> 
    <th scope="col"></th> 
    </tr> 
    <tr> 
    <td><input style="border:1px solid #00C; width:85px;" name="itemId" id="itemId" type="hidden" /></td> 
    <td><select style="border:1px solid #00C; width:130px;" name="ItemName" id="ItemName"></select></td> 
    <td><input style="border:1px solid #00C; width:130px;" name="Quantity" id="Quantity" type="text" size="12" /></td> 
    <td><input style="border:1px solid #00C; width:130px;" name="Rate" id="Rate" type="text" size="12" /></td> 
    <td><input style="border:1px solid #00C; width:130px;" name="MeasuringUnit" id="MeasuringUnit" type="text" size="12" /></td> 
    <td><input style="border:1px solid #00C; width:130px;" name="Amount" id="Amount" type="text" size="12" /></td> 
    <td><input style="border:1px solid #00C; width:90px;" name="ItmAdd" id="ItmAdd" type="button" value="Add" size="12" /></td> 
    </tr> 

</table> 

而我的jqGrid電網

jQuery("#list").jqGrid({ 
       cache: false, 
       async: false, 
       url: '/NewOrder/getItemsByOrder/', 
       datatype: 'json', 
       mtype: 'POST', 

       colNames: ['ItemId', 'ItemName', 'Quantity', 'Rate', 'Amount', 'Action'], 
       colModel: [ 
           { name: 'ItemId', index: 'Id', width: 100, align: 'center' }, 
           { name: 'ItemName', index: 'ItemName', width: 100, align: 'center' }, 
           { name: 'Quantity', index: 'Quantity', width: 200, align: 'center' }, 
           { name: 'Rate', index: 'Rate', width: 200, align: 'center' }, 
           { name: 'Amount', index: 'Amount', width: 200, align: 'center' }, 
           { name: 'Action', index: 'Action', width: 100, align: 'center', formatter: 'actions', 
            formatoptions: { 
             keys: true, 
             editbutton: true, 
             updateOptions: function() { 
              alert('Yes Selected'); 
             }, 
             delOptions: { url: '/myServer/MySite' } 
            } 
           } 
          ], 
       cellEdit: true, 
       pager: jQuery('#pager'), 
       rowNum: 10, 
       rowList: [5, 10, 20, 50], 
       sortname: 'ItemId', 
       sortorder: "desc", 
       viewrecords: true, 
       width: 950, 
       imgpath: '/scripts/themes/coffee/images', 
       caption: 'Order Details Grid', 
       /*onSelectRow: function (rowid, status, e) { 
        if(e) 
         alert('Selected' + status); 
        else 
         alert('Not Selected' + status); 
       }*/ 
       onCellSelect: function (rowid, iCol, cellcontent, e) { 
        //var $dest = $(e.target); 
        var grid = jQuery('#list'); 
        var sel_id = grid.jqGrid('getGridParam', 'selrow'); 
        var myCellData = grid.jqGrid('getCell', sel_id, 'ItemName'); 

        alert('Value of = ' + cellcontent + "\n" + "\n" + 'ItemName=' + myCellData); 
        /*if ($td.hasClass("clickableTitle")) { 
        if ($dest.hasClass("ui-icon-locked")) { 
        $dest.removeClass("ui-icon-locked").addClass("ui-icon-unlocked"); 
        } else { 
        $dest.removeClass("ui-icon-unlocked").addClass("ui-icon-locked"); 
        } 
        }*/ 
       } 
      }); 

主要是我想選擇的jqGrid一行，它會填滿我textboxs我怎麼能做到這一點，請幫助老闆。

Answer 1

您應該使用

jqGrid('getGridParam','selrow'); 

這將返回選定行ID。您可以使用此行ID來獲取如下所示的行值。如果沒有選擇行，這將返回null。請參閱here以供參考。

如果要執行編輯或刪除，jqgrid已經在網格中寫入了這些函數。你可以看到DOCUMENTATION。

onSelectRow: function (id) { 
    var myGrid = $('#list'), 
    var selRowId = myGrid.jqGrid('getGridParam', 'selrow'), 
    var ItemId = myGrid.jqGrid('getCell', selRowId, 'ItemId'); 
    var ItemName = myGrid.jqGrid('getCell', selRowId, 'ItemName'); 
    var Quantity = myGrid.jqGrid('getCell', selRowId, 'Quantity'); 
    var Rate = myGrid.jqGrid('getCell', selRowId, 'Rate'); 
    var Amount = myGrid.jqGrid('getCell', selRowId, 'Amount'); 
    var Action = myGrid.jqGrid('getCell', selRowId, 'Action'); 
    document.getElementById('ItemId').value = ItemId; 
    document.getElementById('ItemName').value = ItemName; 
    document.getElementById('Quantity').value = Quantity; 
    document.getElementById('Rate').value = Rate; 
    document.getElementById('Amount').value = Amount; 
    document.getElementById('Action').value = Action; 
}