Ajax 动态更改colModel、colData和ColName
我尝试在用户单击“下个月”按钮或“前个月”按钮后更改colModel、colNames和ColData。但它不起作用 在这里，您可以看到用户单击“上一个月”按钮后的更改。 开头的colname如下示例所示：Ajax 动态更改colModel、colData和ColName,ajax,json,dynamic,Ajax,Json,Dynamic,我尝试在用户单击“下个月”按钮或“前个月”按钮后更改colModel、colNames和ColData。但它不起作用 在这里，您可以看到用户单击“上一个月”按钮后的更改。 开头的colname如下示例所示： “ID”，“姓名”，01.07，02.07，03.07。。。31.07 colModel是为33列创建的，显示以下数据结构 如果用户按下“上一个月”按钮，新的colNames必须显示如下 “ID”，“Name”，01.06，02.06，03.06。。。。30.06 现在只能为32列创建col
“ID”，“姓名”，01.07，02.07，03.07。。。31.07 colModel是为33列创建的，显示以下数据结构 如果用户按下“上一个月”按钮，新的colNames必须显示如下 “ID”，“Name”，01.06，02.06，03.06。。。。30.06 现在只能为32列创建colModel 我首先在PHP中创建colNames和colModel dynamic，实际月份将显示出来 在这里您可以看到html部分 现在我试图改变colNames等等，但它不起作用。使用$（“#grid”）.jqGrid（'setGridParam'，{data:obj.couponStripList.rows}）正确更改日期；但是coNames不会因setLabel而改变，我如何才能改变colModel 第二个json数据 （在评论和编辑中回答。请参阅） OP写道： 我解决了这个问题。它必须是 而不是 在这里可以看到新代码：
函数showMonth（参数、月份、年份）{
控制台日志（月）；
如果（参数=='prevmonth'）{
如果（月份>1）{
月份-=1；
}
}
如果（参数=='nextmonth'）{
如果（月<12）{
月份+=1；
}
}
控制台日志（月）；
$.post（'/price calendar/get jq grid json/locationId//'+serviceId/'+param+'/'+month+'/year/'+year，
函数（数据）{
$（“#网格”）.jqGrid（'clearGridData'）；
var obj=$.parseJSON（数据）；
对于（i=0；i<div id="jqgrid">
<div id="navigation-top">
<input class="button-pos ui-corner-all ui-state-loading ui-state-default" type="submit" name="prevMonth" id="prevMonth" value="<< vorheriger Monat" onClick="showMonth('prevmonth', <?php echo $this->month; ?>, <?php echo $this->year; ?>);" />
<input class="button-pos ui-corner-all ui-state-loading ui-state-default" type="submit" name="nextMonth" id="nextMonth" value="nächster Monat >>" onClick="showMonth('nextmonth', <?php echo $this->month; ?>, <?php echo $this->year; ?>);" />
</div>
<table id="grid"><tr><td></td></tr></table>
</div>
var lastsel;
$(document).ready($(function(){
$.ajax({
url:'/get-jq-grid-json/',
datatype: 'json',
type: 'POST',
success: function(result){
var obj = $.parseJSON(result);
var colD = obj.couponStripList;
var colM = obj.colModelList;
var colN = obj.columnNames;
var lastSel;
$("#grid").jqGrid({
url:'/get-jq-grid-json/',
jsonReader : {
root: "rows",
cell: "",
repeatitems: true,
id: "invid"
},
mytype: 'POST',
datatype: 'local',
data: colD.rows,
colNames: colN,
colModel: colM,
height: 'auto',
width: 'auto',
onSelectRow: function(id) {
if(id && id!==lastSel){
$("#grid").restoreRow(lastSel);
lastSel=id;
}
$("#grid").editRow(id, true);
},
editurl:'/price-calendar/save-jq-grid/locationId/',
loadComplete: function(data){
alert('loaded');
},
loadError: function(xhr,status,error){
alert('error ' + error );
}
});
},
error: function(x, e){
alert(x.readyState + " "+ x.status +" "+ e.msg);
}
});
setTimeout(function() {$("#grid").jqGrid('setGridParam',{datatype:'json'}); },500);
function showMonth(param, month, year){
if(param == 'prevmonth'){
if(month > 1){
month -= 1;
}
}
if(param == 'nextmonth'){
if(month < 12){
month += 1;
}
}
$.post('/price-calendar/get-jq-grid-json/locationId/<?php echo $this->locationId; ?>/serviceId/<?php echo $this->serviceId; ?>/' + param + '/' + month + '/year/' + year,
function(data){
$("#grid").jqGrid('clearGridData');
var obj = $.parseJSON(data);
for($i = 0; $i <= obj.columnNames.length; $i++)
{
var colNames = $("#grid").jqGrid('getGridParam', 'colNames');
$("#grid").jqGrid('setLabel', colNames[$i], obj.columnNames);
}
$("#grid").jqGrid('setGridParam', { data: obj.couponStripList.rows });
$("#grid").trigger("reloadGrid");
});
{
"colModelList":[
{
"name":"id",
"index":"id",
"width":100,
"hidden":true,
"key":true
},
{
"name":"name",
"index":"name",
"width":200
},
{
"name":"date01",
"index":"date01",
"width":45,
"editable":true
},
{
"name":"date02",
"index":"date02",
"width":45,
"editable":true
},
{
"name":"date03",
"index":"date03",
"width":45,
"editable":true
},
{
"name":"date04",
"index":"date04",
"width":45,
"editable":true
},
{
"name":"date05",
"index":"date05",
"width":45,
"editable":true
},
{
"name":"date06",
"index":"date06",
"width":45,
"editable":true
},
{
"name":"date07",
"index":"date07",
"width":45,
"editable":true
},
{
"name":"date08",
"index":"date08",
"width":45,
"editable":true
},
{
"name":"date09",
"index":"date09",
"width":45,
"editable":true
},
{
"name":"date10",
"index":"date10",
"width":45,
"editable":true
},
{
"name":"date11",
"index":"date11",
"width":45,
"editable":true
},
{
"name":"date12",
"index":"date12",
"width":45,
"editable":true
},
{
"name":"date13",
"index":"date13",
"width":45,
"editable":true
},
{
"name":"date14",
"index":"date14",
"width":45,
"editable":true
},
{
"name":"date15",
"index":"date15",
"width":45,
"editable":true
},
{
"name":"date16",
"index":"date16",
"width":45,
"editable":true
},
{
"name":"date17",
"index":"date17",
"width":45,
"editable":true
},
{
"name":"date18",
"index":"date18",
"width":45,
"editable":true
},
{
"name":"date19",
"index":"date19",
"width":45,
"editable":true
},
{
"name":"date20",
"index":"date20",
"width":45,
"editable":true
},
{
"name":"date21",
"index":"date21",
"width":45,
"editable":true
},
{
"name":"date22",
"index":"date22",
"width":45,
"editable":true
},
{
"name":"date23",
"index":"date23",
"width":45,
"editable":true
},
{
"name":"date24",
"index":"date24",
"width":45,
"editable":true
},
{
"name":"date25",
"index":"date25",
"width":45,
"editable":true
},
{
"name":"date26",
"index":"date26",
"width":45,
"editable":true
},
{
"name":"date27",
"index":"date27",
"width":45,
"editable":true
},
{
"name":"date28",
"index":"date28",
"width":45,
"editable":true
},
{
"name":"date29",
"index":"date29",
"width":45,
"editable":true
},
{
"name":"date30",
"index":"date30",
"width":45,
"editable":true
},
{
"name":"date31",
"index":"date31",
"width":45,
"editable":true
}
],
"columnNames":[
"Id",
"Preis",
"01.07",
"02.07",
"03.07",
"04.07",
"05.07",
"06.07",
"07.07",
"08.07",
"09.07",
"10.07",
"11.07",
"12.07",
"13.07",
"14.07",
"15.07",
"16.07",
"17.07",
"18.07",
"19.07",
"20.07",
"21.07",
"22.07",
"23.07",
"24.07",
"25.07",
"26.07",
"27.07",
"28.07",
"29.07",
"30.07",
"31.07"
],
"couponStripList":{
"rows":[
{
"invid":"1",
"id":"1",
"name":"Bild",
"date01":"28.50",
"date02":"28.50",
"date03":"28.50",
"date04":"28.50",
"date05":"28.50",
"date06":"28.50",
"date07":"28.50",
"date08":"28.50",
"date09":"28.50",
"date10":"28.50",
"date11":"28.50",
"date12":"30.95",
"date13":"30.95",
"date14":"30.95",
"date15":"30.95",
"date16":"30.95",
"date17":"30.95",
"date18":"30.95",
"date19":"30.95",
"date20":"30.95",
"date21":"35.50",
"date22":"35.50",
"date23":"35.50",
"date24":"35.50",
"date25":"35.50",
"date26":"35.50",
"date27":"35.50",
"date28":"35.50",
"date29":"35.50",
"date30":"35.50",
"date31":"35.50",
"0":0,
"1":null,
"2":false,
"3":false
}
]
}
}
{
"colModelList":[
{
"name":"id",
"index":"id",
"width":100,
"hidden":true,
"key":true
},
{
"name":"name",
"index":"name",
"width":200
},
{
"name":"date01",
"index":"date01",
"width":45,
"editable":true
},
{
"name":"date02",
"index":"date02",
"width":45,
"editable":true
},
{
"name":"date03",
"index":"date03",
"width":45,
"editable":true
},
{
"name":"date04",
"index":"date04",
"width":45,
"editable":true
},
{
"name":"date05",
"index":"date05",
"width":45,
"editable":true
},
{
"name":"date06",
"index":"date06",
"width":45,
"editable":true
},
{
"name":"date07",
"index":"date07",
"width":45,
"editable":true
},
{
"name":"date08",
"index":"date08",
"width":45,
"editable":true
},
{
"name":"date09",
"index":"date09",
"width":45,
"editable":true
},
{
"name":"date10",
"index":"date10",
"width":45,
"editable":true
},
{
"name":"date11",
"index":"date11",
"width":45,
"editable":true
},
{
"name":"date12",
"index":"date12",
"width":45,
"editable":true
},
{
"name":"date13",
"index":"date13",
"width":45,
"editable":true
},
{
"name":"date14",
"index":"date14",
"width":45,
"editable":true
},
{
"name":"date15",
"index":"date15",
"width":45,
"editable":true
},
{
"name":"date16",
"index":"date16",
"width":45,
"editable":true
},
{
"name":"date17",
"index":"date17",
"width":45,
"editable":true
},
{
"name":"date18",
"index":"date18",
"width":45,
"editable":true
},
{
"name":"date19",
"index":"date19",
"width":45,
"editable":true
},
{
"name":"date20",
"index":"date20",
"width":45,
"editable":true
},
{
"name":"date21",
"index":"date21",
"width":45,
"editable":true
},
{
"name":"date22",
"index":"date22",
"width":45,
"editable":true
},
{
"name":"date23",
"index":"date23",
"width":45,
"editable":true
},
{
"name":"date24",
"index":"date24",
"width":45,
"editable":true
},
{
"name":"date25",
"index":"date25",
"width":45,
"editable":true
},
{
"name":"date26",
"index":"date26",
"width":45,
"editable":true
},
{
"name":"date27",
"index":"date27",
"width":45,
"editable":true
},
{
"name":"date28",
"index":"date28",
"width":45,
"editable":true
},
{
"name":"date29",
"index":"date29",
"width":45,
"editable":true
},
{
"name":"date30",
"index":"date30",
"width":45,
"editable":true
}
],
"columnNames":[
"Id",
"Preis",
"01.06",
"02.06",
"03.06",
"04.06",
"05.06",
"06.06",
"07.06",
"08.06",
"09.06",
"10.06",
"11.06",
"12.06",
"13.06",
"14.06",
"15.06",
"16.06",
"17.06",
"18.06",
"19.06",
"20.06",
"21.06",
"22.06",
"23.06",
"24.06",
"25.06",
"26.06",
"27.06",
"28.06",
"29.06",
"30.06"
],
"couponStripList":{
"rows":[
{
"invid":"1",
"id":"1",
"name":"Bild",
"date01":"28.50",
"date02":"28.50",
"date03":"28.50",
"date04":"28.50",
"date05":"28.50",
"date06":"28.50",
"date07":"28.50",
"date08":"28.50",
"date09":"28.50",
"date10":"28.50",
"date11":"28.50",
"date12":"30.95",
"date13":"30.95",
"date14":"30.95",
"date15":"30.95",
"date16":"30.95",
"date17":"30.95",
"date18":"30.95",
"date19":"30.95",
"date20":"30.95",
"date21":"35.50",
"date22":"35.50",
"date23":"35.50",
"date24":"35.50",
"date25":"35.50",
"date26":"35.50",
"date27":"35.50",
"date28":"35.50",
"date29":"35.50",
"date30":"35.50"
"0":0,
"1":null,
"2":false,
"3":false
}
]
}
}
var colModel= $("#grid").jqGrid('getGridParam', 'colModel');
$("#grid").jqGrid('setLabel', colModel[i]['name'], obj.columnNames[i]);
var colNames = $("#grid").jqGrid('getGridParam', 'colNames');
$("#grid").jqGrid('setLabel', colNames[$i], obj.columnNames);
function showMonth(param, month, year){
console.log(month);
if(param == 'prevmonth'){
if(month > 1){
month -= 1;
}
}
if(param == 'nextmonth'){
if(month < 12){
month += 1;
}
}
console.log(month);
$.post('/price-calendar/get-jq-grid-json/locationId/<?php echo $this->locationId; ?>/serviceId/<?php echo $this->serviceId; ?>/' + param + '/' + month + '/year/' + year,
function(data){
$("#grid").jqGrid('clearGridData');
var obj = $.parseJSON(data);
for(i = 0; i < obj.columnNames.length; i++)
{
var colModel= $("#grid").jqGrid('getGridParam', 'colModel');
var colName = colModel[i]['name'];
$("#grid").jqGrid('setLabel', colName, obj.columnNames[i]);
}
$("#grid").jqGrid('setGridParam', { colModel: obj.colModelList});
$("#grid").jqGrid('setGridParam', { data: obj.colData.rows});
$("#grid").trigger("reloadGrid");
});
}