rg8*_*g88 4 javascript jquery jqgrid
place_id的custom_value设置为我先点击的任何一行.无论实际值如何,后续单击的行都将使用相同的值.为什么?
例:
place_id foo_name bar_value
10 blah abc
11 blah2 fgr
Run Code Online (Sandbox Code Playgroud)
单击place_id为10的行,然后单击"编辑",出现的表单将包含10place_id值.进行更改并保存,然后单击下一行.10虽然所有其他值都是正确的,但表单仍将具有place_id .
我的代码:
列place_id如下所示:
{name:'place_id', index:'place_id', editable: true, edittype:'custom',
editoptions: { custom_element:myelem,custom_value:myval }}
Run Code Online (Sandbox Code Playgroud)
该myval功能是:
function myval(elem){
return elem.val();
}
Run Code Online (Sandbox Code Playgroud)
我需要的是将myval设置为正在编辑的行的正确place_id.我看着elemFirebug 中的对象,我发现它总是具有第一次点击的行的值,但我不明白为什么我也不知道从哪里可以获取正确的值.任何建议都表示赞赏(我试过在jqgrid论坛上询问,但没有任何结果,所以我转向stackoverflow).
*编辑:如果我使用edittype:'text'而不是edittype:'custom'我得到显示和传递的正确值,但该列是可编辑的,它应该只是可见但不可编辑.
完整代码:
jQuery(document).ready(function(){
jQuery("#list").jqGrid({
url:'/foo/bar/results',
datatype: 'json',
mtype: 'POST',
colNames:['Place ID', 'Site ID', 'Site Name', 'API ID', 'M Type'],
colModel :[
{name:'place_id', index:'place_id', key: true, sorttype:'integer',
width:70, editable: true, edittype:'custom',
editoptions: {custom_element:myelem,custom_value:myval }},
{name:'site_id', index:'site_id', sorttype:'integer', width:70,
editable: true, edittype: 'select', editrule: {required: true},
editoptions:{value:getSites(), size:30}},
{name:'site_name', index:'site_name', width:150, editable: false,
editrule: {required: true}, editoptions: {size:30}},
{name:'api_id', index:'api_id', sorttype:'integer', width:75,
editable: true, edittype: 'text', editrules: {required: true},
editoptions:{size:30}},
{name:'m_type', index:'m_type', width:150, editable: true,
edittype: 'select', editrules: {required: true},
editoptions:{value:{'one':'one','two':'two','three':'three',
'four':'four'},size:30}}
],
editurl:'/foo/bar/editinfo',
height: 'auto',
width: 'auto',
pager: '#pager',
viewrecords: true,
loadonce: true,
rowNum:20,
rowList:[20,40,60,80,100],
caption: 'Meter Listing'
});
// Edit functionality
$("#editfields").click(function(){
var gr = jQuery("#list").jqGrid('getGridParam','selrow');
if( gr != null ) {
jQuery('#list').setGridParam({datatype:'json'});
jQuery("#list").jqGrid('editGridRow',gr,
{editCaption: 'Edit Place Details',height:550,
closeAfterEdit:true,width:600,reloadAfterSubmit:true});
} else {
alert("Please select a row");
}
});
});
function myelem(value,options){
return $('<input type="text" value="'+value+'" disabled="disabled"/>');
}
function myval(elem){
return elem.val();
}
Run Code Online (Sandbox Code Playgroud)
EDIT2:
getSites:
function getSites(){
<?php
$sites = "0:Select";
foreach ($this->sites as $k => $v){
$sites = $sites . ";" . $v['site_id'] . ":" . $v['site_name'];
}
?>
return "<?= $sites ?>";
}
Run Code Online (Sandbox Code Playgroud)
你能尝试包含key: true在place_id列的定义中吗?您可以id从服务器发送的数据中删除.
如果它没有用,那么你应该发布一个完整的代码示例来重现你的问题,我会尝试找到一个解决方法.
更新:有时候复杂问题有一个简单的解决方案.editGridRow功能的另一个参数可以解决您的问题:
recreateForm: true
Run Code Online (Sandbox Code Playgroud)
如果不使用参数,myelem则在第一次编辑所选行时,只会调用一次该函数.然后表单将被缓存而不是重新创建.因此,您将始终编辑同一行.包含参数后,每次recreateForm: true都会创建表单.
顺便说一下,我设置了一些常规设置,我在所有jqGrids中使用每个扩展jQuery.jgrid.defaults,jQuery.jgrid.edit和jQuery.jgrid.view,jQuery.jgrid.del和jQuery.jgrid.nav.例如我总是使用
jQuery.extend(jQuery.jgrid.edit, {
closeAfterAdd: true,
closeAfterEdit: true,
recreateForm: true,
//...
});
Run Code Online (Sandbox Code Playgroud)
那我以后不需要设置这个参数.在写答案期间在自定义编辑类型字段中添加关于自定义编辑的多个输入元素我也有设置,所以我没有看到任何问题.