2012-11-08 42 views
0

我想在我的Jqgrid中添加多個刪除功能與MVC在這裏有我的當前網格的代碼在行動有兩件事查看和刪除,但我想要一個複選框,並出側網格之一當點擊它時,選中的項目應該被刪除,並且在刪除操作之前還需要幫助。jqgrid在mvc與多個刪除

$(文件)。就緒(函數()

{

@if (ViewBag.Filters != string.Empty) 
    { 
     @Html.Raw(ViewBag.Filters); 
    } 

    $("#jq-grid").jqGrid({ 
     url: '/Home/GetList',//Service URL to fetch data 
     datatype: 'json',//Data Type which service will return 
     mtype: 'GET', 
     postData://Data that will be posted with every request 
     { 
      filters: function() { 
       return $.toJSON([ 
           //Here add the parameters which you like to pass to server 
           { Key: "EmployeeName", Value: $("#txtEmployeeName").val() }, 
           { Key: "Id", Value: $("#txtId").val() } 
           ]); 
       } 
     }, 
     colNames: ['Employee Id', 'EmployeeName','empPhoto', 'Action'],//Column Names 
     colModel: [//Column details 
        { name: "Employee Id", index: "Employee Id", width: "220px" }, 
        { name: "Employee Name", index: "EmployeeName", width: "220px" }, 
        { name: "empPhoto", index: "empPhoto", width: "50px" ,formatter:imageFormat }, 
        //Do not allow sorting on Action Column 


        { name: "Action", index: "Action", sortable: false, width: "220px" } 


        ], 

     autowidth: true,//Do not use auto width 
     sortname: '@ViewBag.EmployeeGridRequest.sidx',//This will persist sorting column 
     sortorder: '@ViewBag.EmployeeGridRequest.sord', // This will persist sorting order 
     imgpath: '',//if some images are used then show grid's path 
     caption: 'Employee Grid List',//Grid's Caption, you can set it to blank if you do not want this 
     scrollOffset: 0, 
     rowNum: @ViewBag.EmployeeGridRequest.rows, //Total Pages 
     page: @ViewBag.EmployeeGridRequest.page, // Current Page 
     rowList: [@ViewBag.EmployeeGridRequest.rowList], // Page Selection Options 
     viewrecords: true, 
     // height: "100%", 
     altRows: true,//Use alternate row colors 
     altclass: 'jqgaltrow',//Alternate row class 
     hoverrows: true, //Do not hover rows on mouse over 
     pager: $('#jq-grid-pager'),//Div in which pager will be displayed 
     toppager: true, 

     pgbuttons: true,//Show next/previous buttons 
     loadtext:'Loading Data please wait ...', 
     //loadui :'block',//enable by default, block will disable inputs, remove this line if you do not want to block UI 
     loadComplete: function (response) //Incase you want to perform some action once data is loaded 
     { 

     } 
    }); 
}); 

回答

0

這是一個方法,我發現在溶液中的jqGrid API提供了無內置了之後,希望這有助於。我把這種做法,因爲我想允許的是通過業務規則,並提醒在哪裏發現問題的記錄用戶的刪除記錄。

  #jqGrid delete button 
      //Delete selected devices from jqgrid standard checkbox 
      jQuery("#jqDevice").jqGrid('navButtonAdd', '#jqDevicePager', { 
       caption: "", 
       title: "Delete selected records", 
       buttonicon: "ui-icon-trash", 
       position: "first", 
       onClickButton: function(){ 

        //alert("edit button clicked"); 
        var selIds = $("#jqDevice").getGridParam("selarrrow"); 
        var len = selIds.length; 

        $("#dialogDeleteConfirm").dialog({ 
         buttons : { 
         "Confirm" : function() { 
          //loop through each rows selected and delete 
          if(selIds.length > 0){ 
           for(var i = len - 1; i >= 0; i--) { //traverse the selarrow array in reverse order. 
            //alert("Deleting Device... " + selIds[i]); //Test 
            $.ajax({ 
             type: 'POST', 
             data: "deviceID=" + selIds[i], 
             url: '/Device/DeleteDeviceByID', 
             async: false, 
             success: function(data, textStatus){ 
              //successfully deleted row 
              $("#jqDevice").delRowData(selIds[i]); 
              alert("Successfully deleted records..."); 
             }, 
             error: function (jqXHR, textStatus, errorThrown) {  
              alert(JSON.parse(jqXHR.responseText));         
             } 
            }); 
           } 
          }else{ 
           alert("No rows selected."); 
          } 
          //Close Dialog after user confirms delete action 
          $(this).dialog("close"); 
         }, 
         "Cancel" : function() { 
          $(this).dialog("close"); 
         } 
         } 
        });     
       } 
      }); 


      # Controller Action 
      public ActionResult DeleteDeviceByID(int deviceID) 
      { 
       try 
       { 
        //update LastModBy before deleting 
        Device device = _deviceRepository.GetDevice(deviceID); 
        device.LastModBy = User.Identity.Name; 
        _deviceRepository.SaveChanges(); 

        _deviceRepository.DeleteDevice(deviceID); 
       } 
       catch (Exception ex) 
       { 
        //throw new Exception (ex.Message.Replace(Environment.NewLine, string.Empty)); 
        //return Json(new { success = false, message = ex.Message.Replace(Environment.NewLine, string.Empty) }); 
        //Good way to raise error in JSON format 
        Response.StatusCode = (int)HttpStatusCode.BadRequest; 
        return Json("There was a problem deleting ID - " + deviceID + " : " + ex.Message.Replace(Environment.NewLine, string.Empty) + 
         "\r\n\r\n Please try again. If the problem continues, please contact ... for further assistance."); 

       } 

       return Json(new { success = true }); 
      } 
+0

爲了渲染上的jqGrid你需要親複選框perty multiselect:true – libarra