我正在使用JQuery 2.0.3和jquery-migrate-1.4.1。 添加JQuery migrate js之后，JQGrid添加，编辑寻呼机按钮，不在分页器按钮点击上显示添加/编辑表单。
我无法降级JQuery，因为我在我的页面中使用了bootstrap多选下拉按钮，这需要Jquery 1.9及更高版本。
如何使JQGrid寻呼机按钮起作用。 PLZ。建议。
找到我的代码：
<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
pageEncoding="ISO-8859-1"%>
<%@page import="org.samsung.network.util.Constants" %>
<%@page import="java.sql.Connection" %>
<%@page import="java.sql.PreparedStatement" %>
<%@page import="java.sql.ResultSet" %>
<%@page import="java.sql.SQLException" %>
<%@page import="javax.sql.DataSource" %>
<%@page import="javax.naming.InitialContext" %>
<%@page import="javax.naming.Context" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Test</title>
<link rel="stylesheet" type="text/css" media="screen" href="/NSTest_Dev/css/smoothness/jquery-ui-1.8.6.custom.css" />
<link rel="stylesheet" type="text/css" media="screen" href="/NSTest_Dev/css/bootstrap-3.2.0-min.css"/>
<link rel="stylesheet" type="text/css" media="screen" href="/NSTest_Dev/css/ui.jqgrid.css" />
<link rel="stylesheet" type="text/css" media="screen" href="/NSTest_Dev/css/common.css" />
<link rel="stylesheet" type="text/css" media="screen" href="/NSTest_Dev/css/demos_m.css" />
<link rel="stylesheet" type="text/css" media="screen" href="/NSTest_Dev/css/bootstrap-multiselect.css"/>
<script src="//ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js"></script>
<script type="text/javascript" src="/NSTest_Dev/js/jquery-migrate-1.4.1.min.js"></script>
<script type="text/javascript" src="/NSTest_Dev/js/i18n/grid.locale-en.js"></script>
<script type="text/javascript" src="/NSTest_Dev/js/jquery.form.js"></script>
<script type="text/javascript" src="/NSTest_Dev/js/jquery.jqGrid.min.js"></script>
<script type="text/javascript" src="/NSTest_Dev/js/bootstrap.min.js"></script>
<script type="text/javascript" src="/NSTest_Dev/js/bootstrap-multiselect.js"></script>
<script type="text/javascript">
jQuery(document).ready(function() {
<%if(session.getAttribute("FromDevID") != null && session.getAttribute("ToDevID") != null ){%>
$('#from').val('<%=(String)session.getAttribute("FromDevID")%>');
$('#to').val('<%=(String)session.getAttribute("ToDevID")%>');
$('#sec').val('search');
<%}%>
$('#jqg_calltest').jqGrid('GridUnload');
$("#jqg_calltest").jqGrid({
//url from wich data should be requested
url: 'calltest_json.jsp',
postData: {
fromDate: function() { return jQuery("#from").val(); },
toDate: function() { return jQuery("#to").val(); },
section : function() { return jQuery("#sec").val(); },
sItem : function() { return jQuery('#sItem :selected').val();},
sItemTxt : function() { return jQuery("#sItemTxt").val(); },
locationid : function() { return jQuery("#sLocation").val(); },
testgroupid : function() { return jQuery("#sTestGroup").val(); },
},
//type of data
datatype: 'json',
//url access method type
mtype: 'POST',
multiselect: true,
//columns names
colNames: ['Device ID', 'IMEI','Call Action','Phone Number', 'Calling To','Receiving From','Granularity','Periodicity','Mute Duration(in Mins)','Request Received','Device Status','Remarks', 'Location','Test Group','Restart', 'Stop'],
//columns model
colModel: [
{ name: 'devid', index: 'devid', align: 'center', width: 60, editable: true, sortable: false },
{ name: 'imei', index: 'imei', align: 'center', width: 120, sortable: false, editable: true},
{ name: 'call_action', index: 'call_action', align: 'center', width: 70, sortable: false, editable: true },
{ name: 'phone_number', index: 'phone_number', align: 'center', width: 100, sortable: false, editable: true },
{ name: 'call_number', index: 'call_number', align: 'center', width: 100, sortable: false, editable: true },
{ name: 'call_receive', index: 'call_receive', align: 'center', width: 100, sortable: false, editable: true },
{ name: 'granularity', index: 'granularity', align: 'center', width: 65, sortable: false, editable: true },
{ name: 'periodicity', index: 'periodicity', align: 'center', width: 65, sortable: false, editable: true },
{ name: 'duration', index: 'duration', align: 'center', width: 65, sortable: false, editable: true },
{ name: 'gcmstatus', index: 'gcmstatus', align: 'center', width: 80, sortable: false, editable: false,formatter: gcmStatusFormatter},
{ name: 'dstatus', index: 'dstatus', align: 'center', width: 90, sortable: false, editable: false,formatter: deviceStatusFormatter},
{ name: 'remarks', index: 'remarks', align: 'center', width: 230, sortable: false, editable: false, formatter: remarksFormatter},
{ name: 'LID', index: 'LID', align: 'center', width: 80, sortable: false, editable: false, formatter: remarksFormatter},
{ name: 'TGID', index: 'TGID', align: 'center', width: 80, sortable: false, editable: false, formatter: remarksFormatter},
{ name: 'restart', index: 'restart', align: 'center', width: 80, sortable: false, editable: false, formatter: restartBtnFormatter },
{ name: 'stop', index: 'stop', align: 'center', width: 80, sortable: false, editable: false, formatter: stopBtnFormatter }
],
//pager for grid
pager: $('#jqg_calltestpager'),
//number of rows per page
rowNum: 100,
rowList: [10,25,40,75,100, 500, 1000, 1500],
sortname: 'DeviceID',
sortorder: 'ASC',
autowidth: true,
shrinkToFit: false,
viewrecords: true,
loadonce: false,
rownumbers: true,
rownumWidth: 40,
height: 600,
//width: 1200,
caption: " Call Test Data",
emptyrecords: 'No data to display!',
loadtext: 'Loading...',
// autoid : true,
afterInsertRow: function (rowid, data) {
// To Restart Row Test
var grid = $("#jqg_calltest");
var iCol = getColumnIndexByName (grid, "restart");
$("td:eq("+iCol+")","#"+rowid).click(function () {
//$("td:eq(10)","#"+rowid).click(function () {
var strdata ="";
var rowData =jQuery('#jqg_calltest').jqGrid("getRowData", rowid);
strdata = strdata +rowData.devid+"&";
strdata = strdata + rowData.imei+"&";
strdata = strdata +rowData.call_action+"&";
strdata = strdata + rowData.call_number+"&";
strdata = strdata + rowData.call_receive+"&";
strdata = strdata + ",";
$.ajax({
type: "POST",
url: "SendCallMessage",
dataType:"json",
data:{
calldata: strdata
},
success: function(response, textStatus, jqXHR) {
// display an success message if needed
alert("Call Test for Device ID: "+rowData.devid +" has been Restarted");
},
error: function(jqXHR, textStatus, errorThrown) {
// display an error message in any way
alert("ERROR Restarting Call Test!!!");
}
});
});
//To Stop Row Test
iCol = getColumnIndexByName (grid, "stop");
$("td:eq("+iCol+")","#"+rowid).click(function () {
//$("td:eq(11)","#"+rowid).click(function () {
var strdata ="";
var rowData =jQuery('#jqg_calltest').jqGrid("getRowData", rowid);
strdata = strdata +rowData.devid+"&";
strdata = strdata + rowData.imei;
strdata = strdata + ",";
//alert(strdata);
$.ajax({
type: "POST",
url: "SendStopCallMessage",
dataType:"json",
data:{
stoppingdata: strdata
},
success: function(response, textStatus, jqXHR) {
// display an success message if needed
alert("Call Test for Device ID: "+rowData.devid +" has been stopped");
},
error: function(jqXHR, textStatus, errorThrown) {
// display an error message in any way
alert("ERROR Stopping Call Test!!!");
}
});
});
},
loadComplete : function(){
var selRowIds = jQuery("#jqg_calltest").jqGrid('getGridParam', 'selarrrow');
totalcount = 0;
failcount = 0;
for(var i=0;i<selRowIds.length;i++){
totalcount++;
var celValue = jQuery("#jqg_calltest").jqGrid ('getCell', selRowIds[i], 'dstatus');
if(celValue.indexOf("DISCONNECTED")>=0){
failcount++;
}
}
$("label[for='lblCount']").text(failcount + '/' + totalcount);
$("#jqg_calltest").jqGrid("setLabel", "rn", "RN");
},
onSelectRow: function (id, status) {
// var selRowId = jQuery("#jqg_calltest").jqGrid ('getGridParam', 'selrow');
var celValue = jQuery("#jqg_calltest").jqGrid ('getCell', id, 'dstatus');
if (status) { // selected
if(celValue.indexOf("FAIL")>=0){
failcount++;
}
totalcount ++;
}else{
if(celValue.indexOf("FAIL")>=0){
failcount--;
}
totalcount --;
}
$("label[for='lblCount']").text(failcount + '/' + totalcount);
},
onSelectAll:function(id,status){
if(status){
totalcount = id.length;
failcount = 0;
for(i=0;i<id.length;i++){
var celValue = jQuery("#jqg_calltest").jqGrid ('getCell', id[i], 'dstatus');
if(celValue.indexOf("FAIL")>=0){
failcount++;
}
}
}else{
totalcount = 0;
failcount = 0;
}
$("label[for='lblCount']").text(failcount + '/' + totalcount);
}
});
jQuery("#jqg_calltest").jqGrid('navGrid', '#jqg_calltestpager', {
edit : true, add : true, del : true,search : false, refresh:false, refreshstate: "current"},
//edit options
{
beforeShowForm: function(form) {
$('#tr_imei', form).hide();
$('#tr_devid', form).hide();
//$('#tr_imei', formid).attr("disabled", "disabled");
},
afterSubmit: function (response) {
if (response.status == 200) {
$(this).jqGrid('setGridParam',
{ datatype: 'json' }).trigger('reloadGrid', [{current:true}]);//Reloads the grid after edit
//failcount = 0;
//totalcount = 0;
return [true, ''];
}
else {
$(this).jqGrid('setGridParam',
{ datatype: 'json' }).trigger('reloadGrid', [{current:true}]); //Reloads the grid after edit
//failcount = 0;
//totalcount = 0;
return [false, response.responseText];
//Captures and displays the response text on th Edit window
}
},
onclickSubmit: function(rp_ge, postdata) {
rp_ge.url = 'calltest_json.jsp?section=edit';
},
closeOnEscape: true,//Closes the popup on pressing escape key
reloadAfterEdit: true,
closeAfterEdit: true,
drag: true,
},
//add options
{
afterShowForm: function (form) {
$('#tr_imei', form).show();
$('#tr_devid', form).show();
},
afterSubmit: function (response) {
var myInfo = '<div class="ui-state-highlight ui-corner-all">'+
'<span class="ui-icon ui-icon-info" ' +
'style="float: left; margin-right: .3em;"></span>' +
response.responseText +
'</div>',
$infoTr = $("#TblGrid_" + $.jgrid.jqID(this.id) + ">tbody>tr.tinfo"),
$infoTd = $infoTr.children("td.topinfo");
$infoTd.html(myInfo);
$infoTr.show();
// display status message to 3 sec only
setTimeout(function () {
$infoTr.slideUp("slow");
}, 5000);
//failcount = 0;
//totalcount = 0;
return [true, "", ""]; // response should be interpreted as successful
},
errorTextFormat: function (response) {
var txt = response.statusText;
var restxt = response.responseText;
if(response.status == 406){
return '<span class="ui-icon ui-icon-alert" ' +
'style="float:left; margin-right:.3em;"></span>' +
"Device ID Already Exists";
}
else {
return '<span class="ui-icon ui-icon-alert" ' +
'style="float:left; margin-right:.3em;"></span>' +
"IMEI Already Exists";
}
},
onclickSubmit: function(rp_ge, postdata) {
var totalrecords = $('#jqg_calltest').getGridParam("records") ;
rp_ge.url = 'calltest_json.jsp?section=add&devidmax='+ totalrecords;
},
closeOnEscape: true,//Closes the popup on pressing escape key
reloadAfterSubmit: true,
closeAfterSubmit: true,
closeAfterAdd: true,
drag: true,
},
//del options
{
beforeShowForm: function ($form) {
var rowids = jQuery('#jqg_calltest').jqGrid('getGridParam', 'selarrrow');
$("td.delmsg", $form[0]).html("Delete selected Record with Device ID<b>: " +
rowids + "</b>?");
},
afterSubmit: function (response, postdata) {
if (response.status == 200) {
$('#jqg_calltest').jqGrid('setGridParam',
{ datatype: 'json' }).trigger('reloadGrid', [{current:true}]);//Reloads the grid after edit
//failcount = 0;
// totalcount = 0;
return [true, ''];
}
else {
$('#jqg_calltest').jqGrid('setGridParam',
{ datatype: 'json' }).trigger('reloadGrid', [{current:true}]); //Reloads the grid after edit
// failcount = 0;
//totalcount = 0;
return [false, response.responseText];
//Captures and displays the response text on th Edit window
}
},
onclickSubmit: function(rp_ge, postdata) {
var selIds = jQuery("#jqg_calltest").jqGrid('getGridParam', 'selarrrow');
var strdata ='';
for(var i = 0; i < selIds.length; i++){
var rowData =jQuery("#jqg_calltest").jqGrid("getRowData", selIds[i]);
strdata = strdata + rowData.imei;
strdata = strdata + ",";
}
rp_ge.url = 'calltest_json.jsp?section=delete&imei='+ strdata;
},
closeOnEscape: true,
closeAfterDelete: true,
reloadAfterDelete: true,
},
//search options
{
},
// veiw options
{
width: 500, height: 'auto',
closeOnEscape: true
});
});
var failcount = 0;
var totalcount = 0;
function restartBtnFormatter(cellvalue, options, rowObject) {
return "<input type='button' value='Restart' class='btn btn-primary'/>";
}
function stopBtnFormatter(cellvalue, options, rowObject) {
return "<input type='button' value='Stop' class='btn btn-primary'/>";
}
function gcmStatusFormatter(cellvalue, options, rowObject) {
if(cellvalue == "YES")
return '<span style="color:green"><B>'+cellvalue+'</B></span>';
else if(cellvalue == "NA")
return '<span style="color:blue"><B>'+cellvalue+'</B></span>';
else
return '<span style="color:red"><B>'+cellvalue+'<B></span>';
}
function deviceStatusFormatter(cellvalue, options, rowObject) {
if(cellvalue == "CONNECTED")
return '<span style="color:green"><B>'+cellvalue+'</B></span>';
else if(cellvalue == "NA")
return '<span style="color:blue"><B>'+cellvalue+'</B></span>';
else
{
return '<span style="color:red"><B>'+cellvalue+'<B></span>';
}
}
function remarksFormatter(cellvalue, options, rowObject) {
return '<B>'+cellvalue+'<B>';
}
$(function(){
getColumnIndexByName = function (grid, columnName) {
var cm = grid.jqGrid('getGridParam', 'colModel'), i, l = cm.length;
for (i = 0; i < l; i++) {
if (cm[i].name === columnName) {
return i; // return the index
}
}
return -1;
}
});
function clearResults() {
//debugger;
//failcount = 0;
//totalcount = 0;
$('form').submit(function (e) {
e.preventDefault();
});
var selIds = jQuery("#jqg_calltest").jqGrid('getGridParam', 'selarrrow');
if (selIds.length <= 0) {
alert("Please select atleast one row!!!!");
return;
}
else{
var strdata ='';
var strclearCols = '';
for(var i = 0; i < selIds.length; i++){
var rowData =jQuery("#jqg_calltest").jqGrid("getRowData", selIds[i]);
strdata = strdata +rowData.devid+"&";
strdata = strdata + rowData.imei+"&";
strdata = strdata + "calltest"+"&";
strdata = strdata + ",";
}
var clearClomns = $('#clearRes').val();
// alert(clearClomns);
if(clearClomns == null){
alert("Please select at least one item from clear results dropdown!!!!");
return;
}else{
for(var i = 0; i < clearClomns.length; i++){
strclearCols = strclearCols + clearClomns[i]+",";
}
}
$.ajax({
type: "POST",
url: "ClearResults",
dataType:"json",
data:{
clearRemarksData: strdata,
clearFieldsData : strclearCols
},
success: function(response, textStatus, jqXHR) {
// display an success message if needed
alert("Cleared Results Successfully");
//$("#clearRes").multiselect('refresh');
$("#clearRes option:selected").prop("selected", false);
$("#clearRes").multiselect('refresh');
$('#jqg_calltest').jqGrid('setGridParam', {datatype : 'json'}).trigger('reloadGrid', [{current:true}]);
},
error: function(jqXHR, textStatus, errorThrown) {
// display an error message in any way
alert("ERROR Clearing Results!!!!");
$('#jqg_calltest').jqGrid('setGridParam', {datatype : 'json'}).trigger('reloadGrid', [{current:true}]);
}
});
}
};
$(function () {
$('#clearRes').multiselect({
includeSelectAllOption: true,
// enableFiltering:true,
// buttonClass: 'btn btn-default',
nonSelectedText: 'Clear Results',
/* templates: {
button: '<span class="dropdown-menu dropdown-menu-right" data-toggle="dropdown">Clear Results</span>'
} */
});
});
</script>
</head>
<body>
<table id="jqg_calltest">
<tr>
<td />
</tr>
</table>
<div id="jqg_calltestpager"></div>
<br/>
<select id="clearRes" multiple="multiple" >
<option value="ReceivedGCMStatus">Clear Request Recvd.</option>
<option value="DeviceStatus">Clear Device Status</option>
<option value="Remarks">Clear Remarks</option>
</select>
<input type="submit" value="Clear" class="btn btn-primary" onclick="clearResults()"/>
<input type="hidden" value="overview" id="sec"/>
</body>
</html>