问题：为什么下拉框没有出现在单元格中，下面（即列“value2”）。单元格为空白。（其他单元格正确显示正确的值）
在我的“未经训练”的眼中，我似乎使用了正确的技术，如 jqgrid 演示中所示。
--但是，不幸的是，该列中没有出现下拉框。（即，请参阅下面我的 jqgrid 配置中的“value2”列）。
jqgrid 表配置的哪一部分阻止下拉小部件出现在单元格中？
注意：我在“输入类型”演示中显示的行定义建模......即，
{name:'ship',index:'ship', width:90, editable: true,edittype:"select",editoptions:{value:"FE:FedEx;IN:InTime;TN:TNT;AR:ARAMEX"}},
感谢您的任何帮助！！
s
更新：
这是我处理复选框的方式（如下）。我希望以类似的方式处理下拉列表......（如下片段）
$("#xyzgrid").jqGrid({
.
.
.
colModel: [
{ name: 'valw',
label: 'valw',
index: 'valw',
width: 50,
formatter: 'checkbox',
editable:true,
edittype:"checkbox",
editoptions: {value: 'true:false'},
formatoptions: {disabled:false}},
],
.
.
.
});
$("#xyzgrid > tbody > tr > td > input[type=checkbox]")
{
$(this).change( function(e){
var t = $(e.target);
var row = t.closest("tbody").children().index(t.closest("tr")); //...row index...
var rowids = $('#xyzgrid').jqGrid('getDataIDs'); //a zero-based array containing rowids of visible rows...
var rowid = rowids[row-1];
var rowdata = $("#xyzgrid").getRowData(rowid);
$("#xyzgrid").jqGrid('setRowData', rowid, rowdata);
});
};
$("#submit").click(function()
{
var gridData1 = $("#xyzgrid").jqGrid('getGridParam', 'data');
var gridData1String = JSON.stringify(gridData1);
$.ajax({
type: "POST",
url: suburl1,
data: "gridData1String=" + gridData1String,
dataType: "text",
async: true,
success: function() {
alert("Submitted");
},
error: function(xhr, ajaxOptions, thrownError) {
alert("xhr status=" + xhr.status);
alert("thrownError=" + thrownError);
}
});
});
这是我的 JQGrid 配置：
var geturl1 = 'data/getGridData1';
$("#abcgrid").jqGrid({
url: geturl1,
mtype: 'POST',
datatype: "json",
jsonReader: {
root: "data",
page: "pageNo",
total: "pages",
records: "rows",
repeatitems: false,
cell: "",
id: "value0"
},
colNames: ['value0', 'value1', 'value2'],
colModel: [
{name: 'value0', index: 'value0', width: 100},
{name: 'value1', index: 'value1', width: 100},
{
name: 'value2',
index: 'value2',
width: 100,
editable: true,
edittype:"select",
editoptions: {value:"AAA:AAA;BBB:BBB;CCC:CCC"}
}
],
rowNum:5,
rowList:[10,20,30],
pager: '#pager',
sortname: 'value1',
viewrecords: true,
sortorder: "desc",
caption:"abctest grid...",
rownumbers: true,
loadonce: true
});
更新#2：
这是我的 jqgrid 的最新“工作”版本。当用户单击“提交”按钮时，会出现唯一的问题。显然，用户进行的最后一次下拉编辑使该行处于“编辑”模式...因此，该值不包含在发往服务器的帖子中...
下面是“工作”代码（感谢 AJ 和 Oleg）...
<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:c="http://java.sun.com/jsp/jstl/core">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>abctest</title>
<link rel="stylesheet" type="text/css" media="screen" href="css/redmond/jquery-ui-1.10.2.custom.css" />
<link rel="stylesheet" type="text/css" media="screen" href="css/ui.jqgrid.css" />
<script src="js/jquery-1.9.1.js" type="text/javascript"></script>
<script src="js/jquery-ui-1.10.2.custom.js" type="text/javascript"></script>
<script src="js/jquery.jqGrid.min.js" type="text/javascript"></script>
<script src="js/grid.locale-en.js" type="text/javascript"></script>
<script src="js/jquery.json-2.4.js" type="text/javascript"></script>
<script src="js/jquery.validate.js" type="text/javascript"></script>
<script type="text/javascript">
/* <![CDATA[ */
$(document).ready(function() {
var grid = $("#abcgrid").jqGrid({
url: 'data/getGridData1',
mtype: 'POST',
datatype: "json",
cellsubmit: 'clientArray',
editurl: 'clientArray',
cellEdit: true,
jsonReader: {
root: "data",
page: "pageNo",
total: "pages",
records: "rows",
repeatitems: false,
cell: "",
id: "value0"
},
colNames: ['value0', 'value1', 'value2'],
colModel: [
{
name: 'value0',
index: 'value0',
width: 100
},
{
name: 'value1',
index: 'value1',
width: 100
},
{
name: 'value2',
index: 'value2',
width: 100,
stype: 'select',
formatter: 'select',
editable: true,
edittype: "select",
editoptions: {value: "AAA:AAA;BBB:BBB;CCC:CCC"}
}
],
rowNum: 5,
rowList: [10, 20, 30],
pager: '#pager',
sortname: 'value1',
viewrecords: true,
sortorder: "desc",
caption: "abctest grid...",
rownumbers: true,
loadonce: true
});
$("#submit").click(function()
{
var gridData1 = $("#abcgrid").jqGrid('getGridParam', 'data');
var gridData1String = JSON.stringify(gridData1);
alert("gridData1String=" + gridData1String);
$.ajax({
type: "POST",
url: 'data/postGridData1',
data: "gridData1String=" + gridData1String,
dataType: "text",
async: true,
success: function() {
reloadgrid($("#abcgrid"));
alert("Submitted");
},
error: function(xhr, ajaxOptions, thrownError) {
alert("xhr status=" + xhr.status);
alert("thrownError=" + thrownError);
}
});
});
});
function reloadgrid(grid)
{
grid.jqGrid('setGridParam', {loadonce: false, datatype: 'json'}).trigger('reloadGrid', [{page: 1}]);
grid.jqGrid('setGridParam', {loadonce: true});
return false;
}
/* ]]> */
</script>
</head>
<body>
<form id="form1">
<div>
<div>
<input type="submit" id="submit" value="Submit Grid Edits" />
</div>
<div>
<table id="abcgrid"></table>
<div id="pager" ></div>
</div>
</div>
</form>
</body>
</html>