我有一个jqGrid Treegrid定义如下:
$('#MyGrid').jqGrid({
colNames: ['Id','Nome','Nivel','Combo',''],
colModel: [
{ hidden: true, name: 'Id' },
{ editable: true, name: 'Nome' },
{ hidden: true, name: 'Nivel' },
{ name: 'Combo', editable: true, edittype: 'select',
editoptions: {
buildSelect: createSelectList ,
dataUrl: '/Home/GetCombo' // <-- to this controller, I want
// to send the id of the row edited to load custom items
// in select object
}},
{ formatter: 'actions', formatoptions: { keys: true },
resizable: false, search: false, sortable: false,
width: 60, viewable: false, name: 'actions' }
],
cellEdit: true,
url: '...',
datatype: 'json',
editurl: '...',
jsonReader: {
repeatitems: false,
id: 'Id',
subgrid: { repeatitems: false }
},
mtype: 'POST',
gridComplete: function() { myOnGridComplete(); },
ajaxSelectOptions: {
data: {
tempid: function () {
// !!! the next line always returns null
return $('#MyGrid').jqGrid('getGridParam', 'selrow');
}
}
},
prmNames: { npage: 'npage' },
rowNum: -1,
ExpandColClick: true,
ExpandColumn: 'Nome',
treeGrid: true,
treeGridModel: 'adjacency',
width: 700,
height: '100%'
});
我的目标是将当前行ID发送到服务器,但是当我使用 $('#MyGrid')。jqGrid('getGridParam','selrow')我总是得到一个null值。
我已经阅读过这些帖子,但没有一个能解决我的问题:
任何sugestions?
事先提前!更新1:
TreeGrid绑定没问题。真正的问题是当我单击叶节点中的编辑按钮时。在这种情况下,我想将其他数据发送到服务器。
我尝试使用ajaxSelectOptions
完成此操作,但此命令始终返回null:$('#MyGrid').jqGrid('getGridParam', 'selrow')
解决方法
这是我在Oleg的帮助之前做的一个解决方法:
第1步:在HTML
中创建隐藏字段步骤2:在myOnGridComplete函数中,我将click事件设置为编辑按钮:
function onGridAjusteDTOComplete()
{
$('#MyGrid').find('span.ui-icon-pencil').each(function() {
$(this).click(function(){
var rowID = $(this).parents('tr').attr('id');
// !!! the next commented line not work in my case
// $('#MyGrid').jqGrid('setSelection', therowid );
$('#myHiddenField').val(rowID); // <-- this works
});
});
}
第3步:从rowID
ajaxSelectOptions
ajaxSelectOptions: "{type: 'GET', contentType: 'application/json; charset=utf-8',dataType: 'json',cache: false, async:false, data: {id: function () { return $('#myHiddenField').val(); }}}"
解决方案
请参阅以下Oleg提供的解决方案。这太棒了。谢谢Oleg。
答案 0 :(得分:0)
我不确定我是否正确理解您的问题。 TreeGrid在加载子节点期间发送自动父节点的id。关于将发送到服务器的nodeid
,parentid
,n_level
参数,请参阅the documentation。所以我不明白为什么你需要另外向服务器发送当前所选行(selrow
)的id。
更新:现在我了解您描述的问题的原因。这是一个非常有趣的问题,可能会有其他人。
真正的解决方案是更改jqGrid的代码以支持一些回调函数,该函数可以构建data
调用中使用的$.ajax
参数,构建<select>
。对jqGrid原始代码的最简单修改就是插入行
var rowid = $.jgrid.stripPref($t.p.idPrefix,
String(options.id).substring(0, String(options.id).length - String(options.name).length - 1));
在the line代码行之前将调用带有$.ajax
的{{1}}。此外,还需要在dataUrl
中添加一个参数:
$.ajax
在进行此类更改后,可以使用
data: $.isFunction(ajaxso.postData) ?
ajaxso.postData.call($t, rowid, String(options.name), vl) :
ajaxso.postData,
The demo证明该方法有效。您可以在Fiddler,Firebug或Developer Tools中看到选项ajaxSelectOptions: {
postData: function (rowid, colName, value) {
return { id: rowid };
}
}
将真正发送到URL。我稍后会将相应的建议发布到trirand(我想对更常见的情况做一些额外的改进)
如果您需要使用当前版本的jqGrid实现解决方案,则可以执行以下操作。您可以“子类化”执行id
请求的方法$.jgrid.createEl
。实施也很简单:
$.ajax
The next demo证明了这一点。
更新2 :我发布了the pull request以支持var originalCreateEl = $.jgrid.createEl,
createElementOptions;
$.extend($.jgrid, {
createEl: function (eltype, options, vl, autowidth, ajaxso) {
if (options.dataUrl) {
createElementOptions = options;
}
return originalCreateEl.call(this,eltype, ptions,vl,autowidth,ajaxso);
}
});
$('#MyGrid').jqGrid({
...
ajaxSelectOptions: {
data: {
id: function () {
var id = createElementOptions.id,
colName = createElementOptions.name;
if (typeof id !== "string" || typeof colName !== "string") {
return null;
}
return id.substring(0, id.length - colName.length - 1);
}
}
}
});
作为postData
ajaxSelectOptions`的属性。该请求现在已提交(请参阅here)。所以jqGrid的下一个版本(更高版本为4.4.1)将具有“开箱即用”的功能。