2013-05-29 61 views
1

我已经使用默认的删除按钮进行自定义操作,在服务器端它在删除之前复制行。我想知道如何创建第二个删除按钮,它将删除操作发送到不同的网址,以便在数据库的表上删除。我不想更改我当前服务器端代码上的任何内容,只是想为此按钮发送的删除操作创建一个新代码。我寻求看起来像这样的解决方案(这是X删除图标):如何在导航栏jqgrid上添加第二个自定义删除按钮?

enter image description here

继承人的代码我迄今它没有working.I也希望有一个自定义窗口,以确认DELET行动开始前。任何帮助表示赞赏:

script src="js/jquery-1.9.0.min.js" type="text/javascript"></script> 
<script src="js/i18n/grid.locale-en.js" type="text/javascript"></script> 
<script src="js/jquery.jqGrid.min.js" type="text/javascript"></script> 
<script src="js/jquery-ui-1.10.3.custom.js" type="text/javascript"></script> 
<script src="http://code.jquery.com/jquery-migrate-1.2.1.js"></script> 
<script type="text/javascript">  

$(function(){ 
    $("#list").jqGrid({ 
    url:'request.php', 
    editurl: "jqGridCrud.php", 
    datatype: 'xml', 
    mtype: 'GET', 
    height: 530, 
    width: 850, 
     scrollOffset:0, 



    colNames:['id','Project', 'Assigned To','Assign Date','Check Date','Due Date','Attached','',], 
    colModel :[ 

     {name:'id', index:'id', width:25}, 
     {name:'name', index:'name', width:250, align:'left',editable:true, editoptions:{ 
      size:60} }, 
     {name:'id_continent', index:'id_continent', width:55, align:'right',editable:true,edittype:'select', 
     editoptions:{value: "Henry:Henry; Ramon:Ramon; Paul:Paul" },mtype:'POST' }, 

     {name:'lastvisit', index:'lastvisit', width:70, align:'right',formatter: 'date',srcformat:'yyyy-mm-dd',newformat: 'm/dd/yy',editable:true, edittype: 'text',mtype:'POST' ,editoptions:{size:10, dataInit:function(elem){$(elem).datepicker({dateFormat:'m/dd/yy'});}}} , 


     {name:'cdate', index:'cdate', width:70, align:'right',formatter: 'date',srcformat:'yyyy-mm-dd',newformat: 'm/dd/yy', edittype: 'text',editable:true ,mtype:'POST' ,editoptions:{size:10, dataInit:function(elem){$(elem).datepicker({dateFormat:'m/dd/yy'});}}} , 

     {name:'ddate', index:'ddate', width:70, align:'right',formatter: 'date',srcformat:'yyyy-mm-dd',newformat: 'm/dd/yy',editable:true, edittype: 'text',editoptions:{size:10, dataInit:function(elem){$(elem).datepicker({dateFormat:'m/dd/yy'});}}} , 


     {name:'email', index:'email', width:40,align:'center',sortable:false,mtype:'POST', formatter:function(cellvalue, options, rowObject){ 
      return '<a href="' + cellvalue + '" target="_blank">FILES </a> ' 
     } }, 
     {name:'act',index:'act',width:20 ,align:'center', sortable:false,formatter: "actions", 
formatoptions: { 
    keys: true, 
    delbutton: true, 
    editbutton:false, 
    delOptions: { 
     url: 'jqGridCrud.php', 
     msg: "Remove Selected Project?", 
     bSubmit: "Remove", 
     bCancel: "Cancel" 
    } 
}}, 
    ], 
    pager: '#pager', 


    rowNum:20, 
    rowList:[20,40,80], 
    sortname: 'id', 
    sortorder: 'desc', 
    viewrecords: true, 
    gridview: true, 
    caption: 'Pending Assignments', 



    ondblClickRow: function(rowid) { 

    $(this).jqGrid('editGridRow', rowid, 
         {width:450,Height:400,recreateForm:true,closeAfterEdit:true, 
         closeOnEscape:true,reloadAfterSubmit:false, modal:true,mtype:'post'});} 


      }); 

$.extend($.jgrid.nav, {delicon: "ui-icon-circle-check"}); 

$("#list").jqGrid("navGrid", "#pager", { add: false, search: false, edit:false, refresh:false }) .navButtonAdd('#pager',{ 
    caption:"Delete", 
    buttonicon:"ui-icon-closethick", 
    url: 'jqGridCrud-og.php', 
    onclicksubmit:function() { 
    var $self = $(this), rowid; 

    // get id of selected row or array of ids of selected rows 
    if ($self.jqGrid("getGridParam", "multiselect")) { 
     rowid = $self.jqGrid("getGridParam", "selarrrow"); 
     if (rowid.length === 0) { 
      rowid = null; 
     } 
    } else { 
     rowid = $self.jqGrid("getGridParam", "selrow"); 
    } 

    if (rowid === null) { 
     // display error message because no row is selected 
     $.jgrid.viewModal("#" + 'alertmod_' + this.p.id, 
      {gbox: "#gbox_" + $.jgrid.jqID(this.p.id), jqm: true}); 
     $("#jqg_alrt").focus(); 
    } else { 
     $self.jqGrid("delGridRow", rowid); 
    } 
}, 
    position:"last"}) ; 






    // setup grid print capability. Add print button to navigation bar and bind to click. 
    setPrintGrid('list','pager','Print'); 
    }); 
</script> 






</head> 


<body> 

    <script src="js/jquery.printelement.js" type="text/javascript"></script> 
    <script src="js/printgrid.js" type="text/javascript"></script> 

回答

0

你需要指定需求为delGridRow方法的第一个参数被删除的行的ROWID。所以onclickSubmit的代码应该是关于以下

onclickSubmit: function() { 
    var $self = $(this), rowid; 

    // get id of selected row or array of ids of selected rows 
    if ($self.jqGrid("getGridParam", "multiselect")) { 
     rowid = $self.jqGrid("getGridParam", "selarrrow"); 
     if (rowid.length === 0) { 
      rowid = null; 
     } 
    } else { 
     rowid = $self.jqGrid("getGridParam", "selrow"); 
    } 

    if (rowid === null) { 
     // display error message because no row is selected 
     $.jgrid.viewModal("#" + 'alertmod_' + this.p.id, 
      {gbox: "#gbox_" + $.jgrid.jqID(this.p.id), jqm: true}); 
     $("#jqg_alrt").focus(); 
    } else { 
     $self.jqGrid("delGridRow", rowid); 
    } 
} 
+0

我试过了没有得到任何回应。没有发生。 – NewHistoricForm

+0

@ Oleg我发布我的代码,因为我目前拥有它。可以有一个行动格式化列影响它? – NewHistoricForm

+0

@NewHistoricForm:我输入错误。应该使用'onclickSubmit'而不是'onclicksubmit'。另一个问题:'navButtonAdd'没有'url'参数。你可以使用'delGridRow'的'url'选项:'$ self.jqGrid(“delGridRow”,rowid,{url:'jqGridCrud-og.php'});' – Oleg