我有一张桌子并使用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中选择一行,它会填满我的文本框,我怎么能这样做,请帮助老板。
答案 0 :(得分:2)
你应该使用
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;
}