Javascript jqGrid面临的问题:无法保存行数据,以可编辑模式显示
问题:我正在使用自定义按钮在jqgrid中保存行数据,已编辑的行仍以可编辑模式显示 我是这方面的新手&不知道我哪里出了问题 方法: 已在saveRow上使用saveparameters,但未触发successfunc 我的职能: 函数Fun_get:该函数使用Fetchxml从系统获取数据。 函数textFormatter:此函数正在解析fetchxml数据。 函数PopulateGrid:填充JqGrid 我的代码片段:Javascript jqGrid面临的问题:无法保存行数据,以可编辑模式显示,javascript,html,css,jqgrid,Javascript,Html,Css,Jqgrid,问题:我正在使用自定义按钮在jqgrid中保存行数据,已编辑的行仍以可编辑模式显示 我是这方面的新手&不知道我哪里出了问题 方法: 已在saveRow上使用saveparameters,但未触发successfunc 我的职能: 函数Fun_get:该函数使用Fetchxml从系统获取数据。 函数textFormatter:此函数正在解析fetchxml数据。 函数PopulateGrid:填充JqGrid 我的代码片段: <html> <head> <title
<html>
<head>
<title id="Description">JQGrid Demo.</title>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<link href="jquery.ui.css" rel="stylesheet" type="text/css">
<link href="ui.jqgrid.css" rel="stylesheet" type="text/css">
<script src="jquery.1.10.2.jquery.min.js" type="text/javascript"></script>
<script src="jquery.min.js" type="text/javascript"></script>
<script src="jquery.ui.min.js" type="text/javascript"></script>
<script src="grid.locale.en.js" type="text/javascript"></script>
<script src="jquery.js" type="text/javascript"></script>
<script src="jqGrid.src.js" type="text/javascript"></script>
<script type="text/javascript">
var serverUrl = GetGlobalContext().getServerUrl();
var ltcId;
function textFormatter(cellvalue, options, rowObject) {
/// <summary>
/// Text column formatter
/// </summary>
if (cellvalue != null) {
return cellvalue.value;
}
else {
return "";
}
}
function Fun_get() {
if (window.parent.Xrm.Page.data.entity.getId() != "" && window.parent.Xrm.Page.data.entity.getId() != null) {
var accountid = window.parent.Xrm.Page.data.entity.getId();
}
var FetchXml = "<fetch mapping='logical'>"
+ "<entity name='contact'>"
+ "<attribute name='contactid' alias='ConId'/>"
+ "<attribute name='firstname' alias='FN'/>"
+ "<attribute name='lastname' alias='LN'/>"
+ "<attribute name='emailaddress1' alias='Email'/>"
+ "<order descending='false' attribute='emailaddress1'/>"
+ "<filter type='and'>"
+ "<condition attribute='parentcustomerid' operator='eq' value='" + accountid + "'></condition>"
+ "</filter>"
+ "</entity>"
+ "</fetch>";
//Fetchxml call
var _oService = new FetchUtil("", serverUrl);
_oService.Fetch(FetchXml, sendQueryCallBack);
}
function sendQueryCallBack(results) {
var lastsel;
var outPutId = "#tbloutput";
var editlist = [];
var result1 = results;
jQuery(outPutId).jqGrid("clearGridData", true);
//debugger;
jQuery(outPutId).jqGrid({
width: 150,
datatype: "local",
colNames: ['First Name','Last Name','Email','ConId'],
colModel: [
{ name: 'FN', width: 100, index: 'FN',editable:true, formatter: textFormatter, sorttype: textFormatter },
{ name: 'LN', width: 100, index: 'LN',editable:true, formatter: textFormatter, sorttype: textFormatter },
{ name: 'Email', width: 100, index: 'Email',editable:true, formatter: textFormatter, sorttype: textFormatter },
{ name: 'ConId', width: 100, index: 'ConId',hidden:true,editable:true, formatter: textFormatter, sorttype: textFormatter }
],
scrollOffset:0,
rowNum:5,
width: 450,
height: 100,
viewrecords: true,
caption: "CONTACTS",
editurl: 'clientArray',
onSelectRow: function(id){
//debugger;
if(id && id!==lastsel)
{
saveparameters =
{
"successfunc" : function( response ) {
alert('Row saved');
},
"url" : 'clientArray',
"extraparam" : {},
"aftersavefunc" : function( response ) {
alert('After save');
},
"errorfunc": null,
"afterrestorefunc" : null,
"restoreAfterError" : true,
"mtype" : "POST"
}
jQuery(outPutId).jqGrid('saveRow', lastsel, saveparameters );
lastsel=id;
}
}
});
if (result1.length > 0) {
for (var x = 0; x < result1.length; x++) {
jQuery(outPutId).jqGrid('addRowData', x + 1, result1[x].attributes);
}
}
}
//To Save the row data
function save() {
saveparameters =
{
"successfunc" : function( response ) {
alert('Row saved');
},
"url" : 'clientArray',
"extraparam" : {},
"aftersavefunc" : function( response ) {
alert('After save');
},
"errorfunc": null,
"afterrestorefunc" : null,
"restoreAfterError" : true,
"mtype" : "POST"
}
var rowIndex = jQuery(tbloutput).jqGrid('getGridParam', 'selrow');
jQuery(tbloutput).jqGrid('saveRow', rowIndex, saveparameters, 'clientArray');
};
//To Edit the row data
function edit(){
var id = jQuery(tbloutput).jqGrid('getGridParam', 'selrow');
jQuery(tbloutput).jqGrid('editRow',id,false);
}
</script>
</head>
<body onload=javascript:Fun_get()>
<table id="tbloutput">
<tbody></tbody></table>
<div id="pager" style="height: 30px; font-size: small;"></div></div>
<div>
</br>
<button id="edit" style="border-color: rgb(113, 169, 210); color: white; background-color: rgb(113, 169, 210);" onclick="edit();" type="submit">Edit</button>
<button id="save" style="border-color: rgb(113, 169, 210); color: white; background-color: rgb(113, 169, 210);" onclick="save();" type="submit">save</button>
</div>
</body>
</html>
为了更进一步,我创建了一个简单的jqgrid示例&让我惊讶的是,它工作得非常好。让我惊讶的是,只有当我使用数组或json数据时,这种方法才有效。我不知道上述方法有什么问题。我会再次发布,如果我得到的根本原因。。。我请求其他人也对此进行调查。谢谢