我使用以下代码添加新记录。
jQuery("#list").jqGrid('editGridRow',"new",{height:545, width:425,recreateForm:true,reloadAfterSubmit:false,addedrow:'first',closeAfterAdd:true,top:110,left:350,modal:true});
我正在使用reloadAfterSubmit:false,这意味着当新记录添加到网格时,我所拥有的ID字段为空白。
有人可以解释如何获取新记录的ID并将其放入网格中的ID字段。
我找到了之前的答案here,这似乎是我正在寻找的但我无法理解如何让它发挥作用。文档说afterSubmit: function (response,postdata) {return [true, '', new_id];}
,但我没有如何实现它。
我很新,所以我需要把它放得非常简单。
感谢您的帮助。
更新:
服务器响应:
response.responseText
(!)注意:未定义的偏移量:在 32 的D:\ wamp \ www \ EstimateTracker \ UpdateEstimates.php中为1
调用堆栈
#TimeMemoryFunctionLocation
10.0036402872 {main}().. \ UpdateEstimates.php : 0
(!)注意:未定义的偏移量:在 32 的D:\ wamp \ www \ EstimateTracker \ UpdateEstimates.php中为2
调用堆栈
#TimeMemoryFunctionLocation
10.0036402872 {main}().. \ UpdateEstimates.php : 0
串
更新2:
$(function () {
$("#list").jqGrid({
url:'GetEstimates.php',
datatype: 'xml',
mtype: 'GET',
colNames:['ID','Campaign Name','ClientsID','Client Name','Buyer Name','Client Ref','Description','Sales','Estimator', 'Date Received', 'Date Required','Status','Product Type','Date Submitted','Price (£)', 'Keren No.','Reason Lost','Won Price (£)','Notes'],
colModel :[ {name:'ID', key:true,index:'ID', width:45,align:'center',editable:true,editoptions:{readonly:true,size:10, height:5}, {name:'CampaignName', index:'CampaignName', width:175, align:'left',editrules:{required:true},editable:true,editoptions:{size:35}}, {name:'ClientsID', index:'ClientsID', width:120, align:'left',editable:true,hidden:true}, {name:'ClientName', index:'ClientName', width:120, align:'left',editrules: required:true,custom_func:notEmpty,custom:true},editable:true,edittype:'select', editoptions:{dataUrl:'ClientDropDownGrid.php',dataInit: function () {
var thisval = $("#ClientsID").val();
$.get('GetBuyersGrid.php?id='+thisval, function(data) {
var res = $(data).html();
$("select#BuyerName").html(res);
}); // end get
}//end func
,dataEvents:[{type:'change',fn: function(e) {
var thisval = $(e.target).val();
$.get('GetBuyersGrid.php?id='+thisval, function(data){
var res = $(data).html();
$("select#BuyerName").html(res);
}); // end get
}//end func
} // end type
] // dataevents
}},
{name:'BuyerName', index:'BuyerName', width:100, align:'left',editable:true,edittype:'select',editoptions:{dataUrl:'BuyerDropDownGrid.php'}},
{name:'ClientEstimateRef', index:'ClientEstimateRef', width:125, align:'left', align:'left',editable:true,editoptions:{size:25}},
{name:'Description', index:'Description', width:125, align:'left', align:'left',editable:true,editoptions:{size:25}},
{name:'SalesName', index:'SalesName', width:100, align:'left',editrules:{required:true,custom_func:notEmpty,custom:true},editable: true,edittype:'select',editoptions:{dataUrl:'SalesDropDownGrid.php'},formoptions:{elmsuffix: '<a id="AddSales" href="AddSales.php">Add Sales</a>' }},
{name:'EstimatorName', index:'EstimatorName', width:100, align:'left',editrules:{required:true,custom_func:notEmpty,custom:true},editable: true,edittype:'select',editoptions:{dataUrl:'EstimatorDropDownGrid.php'} },
{name:'DateReceived', index:'DateReceived', width:80, align:'center',editrules:{required:true,custom_func:isValidDateRec,custom:true},editable:true,editoptions: {size: 15, maxlength: 10,dataInit: function(element) {$(element).datepicker({dateFormat: 'dd/mm/yy'}) } }},
{name:'DateRequired', index:'DateRequired', width:80, align:'center',editrules:{required:true},editable:true,editoptions: {size: 15, maxlength: 10,dataInit: function(element) {$(element).datepicker({dateFormat: 'dd/mm/yy'}) } }},
{name:'Status', index:'Status', width:100, align:'left',editable: true,edittype:'select',editoptions:{dataUrl:'StatusDropDownGrid.php', defaultValue:'4'} },
{name:'ProductType', index:'ProductType', width:100, align:'left',editrules:{required:true,custom_func:notEmpty,custom:true},editable: true,edittype:'select',editoptions:{dataUrl:'ProductTypeDropDownGrid.php'} },
{name:'DateSubmitted', index:'DateSubmitted', width:80, hidden:false, align:'center',editable:true,editoptions: {size: 15, maxlength: 10,dataInit: function(element) {$(element).datepicker({dateFormat: 'dd/mm/yy'}) } }},
{name:'Price', index:'Price', width:60, align:'right',editrules:{required:true,custom_func:isCurrency,custom:true},editable:true, formatter:currencyFmatter, unformat:unformatCurrency,editoptions:{size:15,defaultValue:'0.00'}, formoptions:{elmsuffix: 'GBP'}},
{name:'KerenNo', index:'KerenNo', width:80, align:'left',editable:true,editoptions:{size:20}},
{name:'ReasonLost', index:'ReasonLost', width:120, align:'left',editable: true,edittype:'select',editoptions:{dataUrl:'ReasonLostDropDownGrid.php'} },
{name:'WonPrice', index:'WonPrice', width:60, align:'right',editrules:{required:true,custom_func:isCurrency,custom:true},editable:true, formatter:currencyFmatter, unformat:unformatCurrency, editoptions:{size:15,defaultValue:'0.00'}, formoptions:{elmsuffix:'GBP'}},
{name:'Notes', index:'Notes', width:125, align:'left', align:'left',editable:true,edittype:'textarea',editoptions:{dataInit: function(elem){$(elem).width(200); $(elem).height(45);}}}
//{name:'total', index:'total', width:80, align:'right'},
//{name:'note', index:'note', width:150, sortable:false}
],
pager: '#pager',
rowNum:20,
rowList:[10,20,30],
sortname: 'ID',
sortorder: 'asc',
viewrecords: true,
gridview: true,
caption: 'Estimates',
width:880,
height:400,
multiselect:true,
editurl:'UpdateEstimates.php',
shrinkToFit:false
});
//edit row
$("#editButton").click(function(){
var gr = jQuery("#list").jqGrid('getGridParam','selrow');
if( gr != null ) jQuery("#list").jqGrid('editGridRow',gr,{height:545, width:425,recreateForm:true,reloadAfterSubmit:false,closeAfterEdit:true,top:110,left:350,viewPagerButtons:false,modal:true,beforeShowForm: function(form) { $('#tr_DateSubmitted', form).show();}});
else alert("Please Select Row");
});
//add row
$("#addButton").click(function(){
//var gr = jQuery("#list").jqGrid('getGridParam','selrow');
jQuery("#list").jqGrid('editGridRow',"new",{height:545, width:425,recreateForm:true,reloadAfterSubmit:false,afterSubmit: function(response){return [true,'','45765'];},addedrow:'first',closeAfterAdd:true,top:110,left:350,modal:true});
});
});
答案 0 :(得分:1)
The answer不包含您包含的代码。它只是描述afterSubmit
应该以某种方式从服务器响应获取新添加的行的ID ,然后返回[true, '', new_id]
,其中new_id
是id新行。
在最简单的形式中,您可以在服务器响应的正文中返回新添加的行的id。所以id的值可能在response.responseText
。如果你应该使用
afterSubmit: function (response) {
return [true, '', response.responseText];
}
答案 1 :(得分:0)
您可以尝试使用此新记录功能:
jQuery("#list").jqGrid('editGridRow',"new",{
height:545,
width:425,
recreateForm:true,
addedrow:'first',
closeAfterAdd:true,
top:110,
left:350,
modal:true,
afterComplete: function(response, postdata, formid) {
//force update of row data @ row 0 and column = ID, change the name of ID if your column name is different.
//We are using row 0 because we are assuming your new data is not in the first row
$('#list').jqGrid('setCell', 0, 'ID','','','',true);
}
});
这应该在您提交后重新加载网格,如果您的提交成功并且您的更改已保存到您的数据源,那么当网格重新加载时,它将填充新保存的数据,包括新ID。
要将新ID显示为第一条记录,您需要在网格中设置sortname: 'ID'
选项以及sortorder: 'desc'
。然后,当您重新加载网格时,最高ID将首先显示。
**编辑**
看起来您可以使用setCell
方法,并将forceup
属性设置为true。看看这里:
http://www.trirand.com/jqgridwiki/doku.php?id=wiki:methods