jqgrid cách hiển thị thông báo phía máy chủ

Question

Tôi đang sử dụng jqGrid để hiển thị dữ liệu ở định dạng bảng, sử dụng JSP và servlet.

EDIT

Tôi muốn hiển thị lỗi từ máy chủ, khi hoạt động như insert, update, delete được thực hiện. (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 Mã

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 

cho ví dụ trên

• sau inserting kỷ lục từ jqGrid, sau đó No message is shown trong lưới nếu bản ghi là inserted successfully
• error Status: 'Unauthorized'. Error code: 401 được hiển thị nếu servlet không chèn bản ghi vào cơ sở dữ liệu.

Câu hỏi của tôi là:

• sau inserting kỷ lục từ jqGrid, nếu hồ sơ được chèn sau đó làm thế nào tôi nên hiển thị thông báo cung cấp thông tin cho người sử dụng mà dữ liệu được chèn vào.
• và làm thế nào tôi nên cho thông điệp tới người dùng mà Error while inserting (mà error code tôi nên sử dụng cho việc này?)

Cảm ơn trước .....

Answer 1

Tôi đã đề xuất trong the old answer và trong another one để sử dụng hàng ẩn hiện tại của dạng lưới (tr.tinfo) để hiển thị thông tin không phải là lỗi.Bởi vì các câu trả lời không nổi tiếng, tôi lặp lại cùng một thông tin ở đây, nhưng tôi sẽ cố gắng giải thích chi tiết hơn.

Trước hết, điều quan trọng là phải hiểu yếu tố nào có biểu mẫu Chỉnh sửa/Thêm tiêu chuẩn. Sử dụng công cụ nhà phát triển của trình duyệt IE hay Chrome, Firebug hoặc nhiều công cụ khác một dễ dàng có thể tìm hiểu mà Add/Edit biểu mẫu được tạo bởi jqGrid chứa hai hàng ẩn trên đỉnh của hình thức:

Đầu tiên hàng sẽ được sử dụng theo mặc định làm địa điểm cho thông báo lỗi. Người ta có thể sử dụng errorTextFormat để tùy chỉnh thông tin một chút.

Nếu phản ứng máy chủ chứa mã lỗi trạng thái HTTP (> = 400) sau đó gọi lại errorTextFormat sẽ được gọi và bạn có thể sử dụng

errorTextFormat: function (response) { 
    return response.responseText; 
} 

hoặc một cái gì đó giống như

errorTextFormat: function (response) { 
    return '<span class="ui-icon ui-icon-alert" ' + 
       'style="float:left; margin-right:.3em;"></span>' + 
       response.responseText; 
} 

để hiển thị thông báo lỗi như

Trong cùng một cách, người dùng có thể sử dụng afterSubmit gọi lại để hiển thị thông báo trạng thái sau khi gửi dữ liệu đã chỉnh sửa/thêm nếu phản hồi của máy chủ chứa thành công HTTP status code. Việc thực hiện afterSubmit có thể là về sau

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 
} 

Mã sẽ hiển thị thông báo trạng thái trong 3 giây chỉ abd sau đó sử dụng jQuery.slideUp hoạt hình để ẩn nó. Nó sẽ trông giống như

Tôi hy vọng đó là những gì bạn cần.

Answer 2

Tôi đã làm somthing tương tự trên một cuộc gọi chỉnh sửa đến máy chủ của tôi vì vậy tôi nghĩ điều này sẽ hoạt động theo cách rất giống với tiện ích bổ sung.

Trên bộ điều khiển sau khi chỉnh sửa/xóa/thêm cuộc gọi, bạn sẽ xác định xem có thông báo nào được chuyển cho người dùng hay không và thông qua JSON (XML trong trường hợp của bạn) quay lại lưới.

Ex

if (infoDialogTrigger) { 
     return Json(new { success = true, showMessage = true, message = "Updating your Inventory and we are displaying this info box" }); 
    }//if 
    else { 
     return Json(new { success = true, showMessage = false, message = "" }); 
    }//else 

Trong bạn jqGrid bạn sẽ phải chỉnh sửa/xóa/thêm chức năng:

function EditCollectionItem (rowid, grid){ 
     $(grid).jqGrid('editGridRow', rowid, 
     { 
      viewPagerButtons: false, 
      editData: { }, 
      afterComplete: function (response) { 
       var DialogVars = $.parseJSON(response.responseText); //parse the string that was returned in responseText into an object 
       //if there was a failure with the update, or there was information to pass to the user 
       if (!DialogVars.success || DialogVars.showMessage) { 
        alert(DialogVars.message); 
       } 
      } //afterComplete 
     }); //$(grid).jqGrid('editGridRow 
    }//function EditCollectionItem (rowid, grid){ 

Vì vậy, trong ví dụ trên nếu cuộc phẫu thuật đã thất bại bạn có thể hiển thị một thông điệp với a success = false hoặc nếu hoạt động đã hoàn tất nhưng bạn muốn chuyển một số thông tin bổ sung cho người dùng, bạn cũng có thể với sucess = true & & showMessage = true.

Đây là ví dụ JSON về bản chỉnh sửa nhưng khái niệm và logic phải giống nhau đối với XML và thao tác thêm/xóa.