JQGrid - How to use EditUrl

Question

I'm trying to use a delete button to delete selected items from a JQGrid. The javascript code looks as below

  <script type="text/javascript">
$(function(){ 
    $("#list").jqGrid({
        url:'<%=request.getContextPath()%>/MyGridServlet?action=fetchData',
        editurl:'<%=request.getContextPath()%>/MyGridServlet?action=deleteData',
        datatype: 'xml',
        mtype: 'POST',
        colNames:['Inv No','Date', 'Amount','Tax','Total','Notes'],
        colModel :[ 
            {name:'invid', index:'invid', width:55,editable:true, editrules:{required:true,number:true}}, 
            {name:'invdate', index:'invdate', width:90, editable:true, editrules:{required:true}}, 
            {name:'amount', index:'amount', width:80, align:'right',editable:true, editrules:{required:true,number:true}}, 
            {name:'tax', index:'tax', width:80, align:'right',editable:true, editrules:{required:true,number:true}}, 
            {name:'total', index:'total', width:80, align:'right',editable:true, editrules:{required:true,number:true}}, 
            {name:'note', index:'note', width:150, sortable:false,editable:true, editrules:{required:false}} 
        ],
        pager: '#pager',
        multiselect: true,
        loadonce: true,
        height: '100%',
        weight:'100%',
        rowNum:10,
        rowTotal: 2000,
        rowList:[10,20,30],
        sortname: 'invid',
        sortorder: 'desc',
        viewrecords: true,
        gridview: true,
        scrollable: false,
        caption: 'My first grid',
        ondblClickRow: function(rowid) {
            grid.jqGrid('editGridRow',rowid, editParam);
            return;
        }
    });                 
    jQuery("#list").jqGrid('navGrid','#pager',{add:false,del:false,edit:true});
    jQuery("#list").jqGrid('filterToolbar',{stringResult: true,searchOnEnter : false});
}); 
function deleteData(){
    alert("testing");
    var gr = jQuery("#list").jqGrid('getGridParam','selrow');
    if( gr != null ) jQuery("#list").jqGrid('delGridRow',gr,{reloadAfterSubmit:false});
    else alert("Please Select Row to delete!");
}

The Servlet Code looks like below

    package com.test.servlets;
import java.io.IOException;
import java.io.PrintWriter;
import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
public class MyGridServlet extends HttpServlet {

    /** 
     * Processes requests for both HTTP <code>GET</code> and <code>POST</code> methods.
     * @param request servlet request
     * @param response servlet response
     * @throws ServletException if a servlet-specific error occurs
     * @throws IOException if an I/O error occurs
     */
    protected void processRequest(HttpServletRequest request, HttpServletResponse response)
            throws ServletException, IOException {
        response.setContentType("text/html;charset=UTF-8");
        PrintWriter out = response.getWriter();
        try {

            if (request.getParameter("action").equals("deleteData")) {
                response.setContentType("text/xml;charset=UTF-8");
                String status = request.getParameter("status");
                String rows = request.getParameter("rows");
                String page = request.getParameter("page");
                int totalPages = 0;
                int totalCount = 15;
                if (totalCount > 0) {
                    if (totalCount % Integer.parseInt(rows) == 0) {
                        totalPages = totalCount / Integer.parseInt(rows);
                    } else {
                        totalPages = (totalCount / Integer.parseInt(rows)) + 1;
                    }
                } else {
                    totalPages = 0;
                }
                out.print("<?xml version='1.0' encoding='utf-8'?>\n");
                out.print("<rows>");
                out.print("<page>" + request.getParameter("page") + "</page>");
                out.print("<total>" + totalPages + "</total>");
                out.print("<records>" + 15 + "</records>");
                int srNo = 1;
                for (int i = 0; i < 5; i++) {
                    out.print("<row id='" + i + "'>");
                    out.print("<cell>" + request.getParameter("invid") + "</cell>");
                    out.print("<cell>Nov 15, 2011</cell>");
                    out.print("<cell>00$</cell>");
                    out.print("<cell>0$</cell>");
                    out.print("<cell>00$</cell>");
                    out.print("<cell>000</cell>");
                    out.print("</row>");
                }
                out.print("</rows>");

        } finally {
            out.close();
        }
    }
 }

Now when I run this, this works till the Delete Prompt i.e. when user clicks the Delete button, onclick the deleteData() function gets invoked, the alert "testing" gets displayed and the confirmation for delete box also pops up and when the user confirms for delete, I can see the error parsererror Status: 'parsererror'. Error code: 200 on screen.

What I'm trying to achieve is that on button click, the servlet should get invoked, in the servlet, I want to delete data from db and then return. How can I achieve this ? Also what should the Servlet return in response ?

Answer 1

What does the ajax response look like from the server (use Chrome network tab or Firebug to view it)? Is there actually a request being generated? The servlet does not need to return anything for the editurl - the response really should be blank. jqGrid should reload the data from your "url" source to rebuild the grid, post-delete.