jqgrid如何显示服务器端消息 [英] jqgrid how to show server side messages
问题描述
我正在使用 jqGrid
以表格格式显示数据,使用 JSP
和 servlet
。
编辑
我想要展示执行插入,更新,删除
等操作时服务器出错。 (数据类型:xml)
JQGrid
jQuery(#list10_d)。jqGrid({
身高:250,
宽度:600,
url: 'Assignment?action = Assign',
datatype:xml,
colNames:['Sr.No。','PID','DATE','EMPID'],
colModel :[{name:'srNo',index:'srNo',width:30,sortable:false},
{name:'PID',index:'PID',width:0,sortable:true,editable :false},
{name:'DATE',index:'DATE',width:75,sortable:true,editable:true,editoptions:{dataInit:function(el){setTimeout(function(){$ (el).datepicker({dateFormat:dd-M-yy,showButtonPanel:true,changeYear:true,changeMonth:true})。attr('readonly','readonly');},200);}}} ,
{名称:'EMPID',索引:'EMPID',宽度:150,可排序:true,可编辑:true}
],
rowNum:10,
rowList:[10,20,50,100],
pager:'#pager10_d',
sortname:'PID',
viewrecords :true,
sortorder:asc,
},
multiselect:true,
editurl:Assignment?action = Edit,
caption :Assignment
})。navGrid('#pager10_d',{edit:false,add:true,del:false,addtext:'Assign'},
{},
{ modal:true,jqModal:false,closeOnEscape:true,savekey:[true,13],closeOnEscape:true,recreateForm:true,width:500,mtype:'POST',url:'Assignment',editData:{action:'分配',PID:function(){return PID;}},
afterSubmit:function(response){
alert('After Submit \\\
'+'statusText:'+ response.statusText);
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.statusText +'Inserted'+
'< / div>',
$ infoTr = $(#TblGrid_+ $ .jgrid.jqID(this.id)+> tbody> tr.tinfo),
$ infoTd = $ infoTr。儿童( td.topinfo);
$ infoTd.html(myInfo);
$ infoTr.show();
//仅显示状态消息3秒
setTimeout(function(){
$ infoTr.slideUp(slow);
},5000);
return [true,,]; //响应应解释为成功
},
errorTextFormat:function(response){
alert('错误文本格式:\ n'+'statusText:'+ response.statusText) ;
返回'< span class =ui-icon ui-icon-alert'+
'style =float:left; margin-right:.3em;>< ; / span>'+
response.statusText;},
{closeOnEscape:true,recreateForm:true,mtype:'POST',url:'Assignment',delData:{action:'Delete', PID:function(){return PID;}}},
{});
Servlet代码
if(request.getParameter(action)。equalsIgnoreCase(Assign))
{
PID = request.getParameter(PID);
String DATE = request.getParameter(DATE);
字符串EMPID = request.getParameter(EMPID);
字符串查询=插入ASSIGN(PID,DATE,EMPID)值('+ PID +','+ DATE +','+ EMPID');
boolean b = insert.InsertData(query);
如果(b)
{
System.out.println(新记录成功添加!:+查询);
response.setContentType(text / xml);
response.setCharacterEncoding(UTF-8);
//response.sendError(200,成功);
response.setStatus(200,成功插入);
}
else
{
System.out.println(无法添加记录!:+查询);
response.setContentType(text / xml);
response.setCharacterEncoding(UTF-8);
//response.sendError(399,未成功插入);
response.setStatus(404,插入时出错);
}
} // INSERT
以上示例
- 在
从jqgrid插入
记录后,没有显示消息
在
网格中如果记录已成功插入
-
错误状态:'未经授权。如果servlet无法在数据库中插入记录,则显示错误代码:401
。
我的问题是:
- 从jqgrid插入
插入
记录后,如果插入记录那么我该怎么办?显示消息,向用户提供插入数据的信息。 - 如何在插入时向用户发出
错误消息(
错误代码
我应该用它吗?)
提前致谢... ..
我建议在。 afterSubmit
的实现可以是以下
afterSubmit:function(响应){
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();
//仅显示状态消息3秒
setTimeout(function(){
$ infoTr.slideUp(slow);
},3000);
return [true,,]; //响应应解释为成功
}
代码将显示状态消息3秒只有abd然后使用 jQuery.slideUp 动画来隐藏它。它看起来像
我希望这就是你所需要的。
I am using jqGrid
to show data in tabular format, using JSP
and servlet
.
EDIT
I want to show errors from server, when operations like insert, update, delete
are performed. (datatype: "xml")
JQGrid
jQuery("#list10_d").jqGrid({
height:250,
width:600,
url:'Assignment?action=Assign',
datatype: "xml",
colNames:['Sr. No.','PID', 'DATE', 'EMPID'],
colModel:[{name:'srNo',index:'srNo', width:30,sortable:false},
{name:'PID',index:'PID',width:0, sortable:true,editable:false},
{name:'DATE',index:'DATE', width:75,sortable:true,editable:true,editoptions: { dataInit: function(el) { setTimeout(function() { $(el).datepicker({dateFormat:"dd-M-yy",showButtonPanel: true,changeYear: true,changeMonth: true}).attr('readonly','readonly'); }, 200); }}},
{name:'EMPID',index:'EMPID', width:150,sortable:true,editable:true}
],
rowNum:10,
rowList:[10,20,50,100],
pager: '#pager10_d',
sortname: 'PID',
viewrecords: true,
sortorder: "asc",
},
multiselect: true,
editurl: "Assignment?action=Edit",
caption:"Assignment"
} ).navGrid('#pager10_d',{edit:false,add:true,del:false,addtext:'Assign '},
{},
{modal:true,jqModal: false,closeOnEscape:true,savekey: [true,13],closeOnEscape:true, recreateForm: true,width:500,mtype:'POST', url: 'Assignment',editData:{action: 'Assign',PID: function () {return PID;}},
afterSubmit: function (response) {
alert('After Submit \n' +'statusText: '+ response.statusText);
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.statusText + 'Inserted'+
'</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);
return [true, "", ""]; // response should be interpreted as successful
},
errorTextFormat: function (response) {
alert('Error Text Format: \n' +'statusText: '+ response.statusText);
return '<span class="ui-icon ui-icon-alert" ' +
'style="float:left; margin-right:.3em;"></span>' +
response.statusText;},
{closeOnEscape:true, recreateForm: true,mtype: 'POST',url: 'Assignment',delData: {action: 'Delete',PID: function () {return PID;}}},
{}) ;
Servlet Code
if(request.getParameter("action").equalsIgnoreCase("Assign"))
{
PID = request.getParameter("PID");
String DATE= request.getParameter("DATE");
String EMPID= request.getParameter("EMPID");
String query = "insert into ASSIGN(PID,DATE,EMPID) values('"+ PID +"','"+ DATE +"','"+ EMPID"')";
boolean b = insert.InsertData(query);
if(b)
{
System.out.println("New record added successfully! : "+query);
response.setContentType("text/xml");
response.setCharacterEncoding("UTF-8");
//response.sendError(200, "success");
response.setStatus(200, "Inserted successfully");
}
else
{
System.out.println("Failed to add Record! : "+query);
response.setContentType("text/xml");
response.setCharacterEncoding("UTF-8");
//response.sendError(399, "not Inserted successfully");
response.setStatus(404, "Error while inserting");
}
}//INSERT
for above example
- after
inserting
record from jqgrid, thenNo message is shown
in grid if record isinserted successfully
error Status: 'Unauthorized'. Error code: 401
is shown if servlet fails to insert record in database.
My Question is that:
- after
inserting
record from jqgrid, if the record is inserted then how should i show message giving information to user that data is inserted. - and how should I give message to user that
Error while inserting
(whicherror code
should i use for this?)
Thanks in advance.....
I suggested in the old answer and in another one to use existing hidden row of grid form (tr.tinfo
) to display information which is not error. Because the answers are not well known I repeat the same information here, but I'll try to explain all more detailed.
First of all it's important to understand which elements has the standard Edit/Add form. Using Developer Tools of IE or Chrome, Firebug or many other tool one can easy find out that the Add/Edit form created by jqGrid contains two hidden rows on top of the form:
The first row will be used per default as the place for error message. One can use errorTextFormat
to customize the information a little.
If the server response contains error HTTP status code (>=400) then the callback errorTextFormat
will be called and you can use
errorTextFormat: function (response) {
return response.responseText;
}
or something like
errorTextFormat: function (response) {
return '<span class="ui-icon ui-icon-alert" ' +
'style="float:left; margin-right:.3em;"></span>' +
response.responseText;
}
to display error message like
In the same way one can use afterSubmit
callback to display status message after submitting of edited/added data if the server response contains successful HTTP status code. The implementation of afterSubmit
could be about the following
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");
}, 3000);
return [true, "", ""]; // response should be interpreted as successful
}
The code will display the status message for 3 sec only abd then uses jQuery.slideUp animation to hide it. It will look like
I hope it's what you need.
这篇关于jqgrid如何显示服务器端消息的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!