JQGrid datatype as Ajax function not getting called
JQGrid
datatype as Ajax
function not getting called. once I tried to debug using firebug, found out that those lines are not executed.
Please let me know the issue with my code.
jQuery("#list").jqGrid({
//url:'example.xml',
datatype: function() {
$.ajax({
url: "example.xml",
data: "{}",
dataType: "xml",
mtype: "GET",
complete: function(jsondata, stat) {
alert((jsondata.responseText));
if (stat == "success") {
alert("ew");
}
},
error: function() {
alert("error")
开发者_JAVA技巧 }
});
},
colNames: ['QueueName', 'SLA Associated', 'SLA met', 'SLA Breached', 'SLA MET %', 'SLA Breached %'],
colModel: [{
name: 'QueueName',
index: 'QueueName',
width: 150
}, {
name: 'SLAAssociated',
index: 'SLAAssociated',
width: 150
}, {
name: 'SLAmet',
index: 'SLAmet',
width: 150
}, {
name: 'SLABreached',
index: 'SLABreached',
width: 150
}, {
name: 'SLAMETPer',
index: 'SLAMETPer',
width: 150
}, {
name: 'SLABreachedPer',
index: 'SLABreachedPer',
width: 150
}],
pager: jQuery('#pager1'),
rowNum: 1,
rowList: [5, 10],
imgpath: 'themes/basic/images'
});
In Header I add as follows
<html xmlns="http://www.w3.org/1999/xhtml">
<link rel="stylesheet" type="text/css" media="screen" href="themes/basic/grid.css" />
<link rel="stylesheet" type="text/css" media="screen" href="themes/jqModal.css" />
<link rel="stylesheet" type="text/css" media="screen" href="css/report.css" />
<script src="jquery.js" type="text/javascript"></script>
<script src="jquery.jqGrid.js" type="text/javascript"></script>
<script src="js/jqModal.js" type="text/javascript"></script>
<script src="js/jqDnR.js" type="text/javascript"></script>
Hi Please find my entire HTML Code. is there any issues with this code ? the Ajax function I called in the datatype is not get executed.
jQuery(document).ready(function() {
jQuery("#list").jqGrid({
datatype: function(postData) {
$.ajax({ // THis function is not getting called @ any time.
url: '1234.xml',
type: 'POST',
dataType: 'xml',
data: postdata,
error: function() {
alert(1);
},
complete: function(xmlData, stat) {
alert(0);
},
});
},
colNames: ['Inv No', 'Date', 'Amount', 'Tax', 'Total', 'Notes'],
colModel: [{
name: 'invid',
index: 'invid',
width: 55
}, {
name: 'invdate',
index: 'invdate',
width: 90
}, {
name: 'amount',
index: 'amount',
width: 80,
align: 'right'
}, {
name: 'tax',
index: 'tax',
width: 80,
align: 'right'
}, {
name: 'total',
index: 'total',
width: 80,
align: 'right'
}, {
name: 'note',
index: 'note',
width: 150,
sortable: false
}],
pager: jQuery('#pager'),
rowNum: 10,
rowList: [10, 20, 30],
sortname: 'id',
sortorder: "desc",
viewrecords: true,
pager: jQuery('#pager'),
imgpath: 'themes/basic/images',
caption: "My first grid"
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<title>jqGrid Demo</title>
<link rel="stylesheet" type="text/css" media="screen" href="themes/basic/grid.css" />
<link rel="stylesheet" type="text/css" media="screen" href="themes/jqModal.css" />
<script src="jquery.js" type="text/javascript"></script>
<script src="jquery.jqGrid.js" type="text/javascript"></script>
<script src="js/jqModal.js" type="text/javascript"></script>
<script src="js/jqDnR.js" type="text/javascript"></script>
<body>
<table id="list" class="scroll" cellpadding="0" cellspacing="0"></table>
<div id="pager" class="scroll" style="text-align:center;"></div>
</body>
your function needs to take in the postdata as a parameter
datatype: function(postData) {
$.ajax({
url: "example.xml",
data: postData,
dataType: "xml",
mtype: "GET",
complete: function(jsondata, stat) { alert((jsondata.responseText));
if (stat == "success") {
alert("ew");
}
},
error : function () {alert("error")}
});
},
精彩评论