如何添加编辑和删除图标在jQGrid操作列

有人请帮助我添加编辑和删除图标完全如下面的演示链接所示。 http://www.trirand.net/aspnetmvc/grid/EditRowInlineActionIcons 如何添加编辑和删除图标在jQGrid操作列

以下是我的JQGrid。我尝试添加格式化程序：'actions'， formatoptions：{keys：true，editbutton：true，delbutton：true}

但是在显示编辑和删除图标时没有运气。我想我需要通过图像源进行编辑和删除图标，我不知道。还需要编写一些代码来处理图标的点击事件。任何人都可以给我一个基本的例子来添加编辑和删除图标在“行动”列内联编辑？

只是一个FYI，这不是MVC应用程序，它的ASP.Net4.0。我将这个网格绑定到一个表中，现在所有的代码都在.js文件中。

_bindGridView: function (files) { 
      var lastsel; 
      jQuery("#gridJQ").jqGrid({ 
       datatype: "local", 
       height: 250, 

       colNames: ['Document Name', 'Category', 'Name/Account No.', 'RepID', 'Description', 'ClientView', 'Document Date', 'Actions'], 
       colModel: [ 
        { name: 'documentName', index: 'documentName', width: 200, editable: false }, 
        { name: 'category', index: 'category', width: 100, editable: true, edittype: "select", editoptions: { value: "cl:Client;Ac:Account;Br:Branch"} }, 
        { name: 'nameAccount', index: 'nameAccount', width: 170, editable: true }, 
        { name: 'repId', index: 'repId', width: 70, editable: true, edittype: "select", editoptions: { value: "1:001A;2:001B;3:001C;4:001D"} }, 
        { name: 'description', index: 'description', width: 100, editable: true, edittype: "select", editoptions: { value: "item:Item one;item:Item Two;item:Item Three"} }, 
        { name: 'clientView', index: 'clientView', width: 90, editable: true, edittype: "checkbox", editoptions: { value: "Yes:No"} }, 
        { name: 'documentDate', index: 'documentDate', width: 150, editable: true, editoptions: { dataInit: function (el) { 
         setTimeout(function() { 
          $(el).datepicker({ 
           autoPopUp: 'button', 
           showOn: "both", 
           buttonImage: "~/Images/myCal.jpg", 
           buttonImageOnly: true, 
           buttonText: 'Calendar' 
          }); 
         }, 10); 
        }, size:10, maxlength:100 
        } 
        }, 

        { name: 'actions', index: 'actions', width: 70, formatter:'actions', 
       formatoptions: {keys: true, editbutton:true,delbutton:true } } 

       ], 

       onSelectRow: function (id) { 
        if (id && id !== lastsel) { 
         jQuery('#gridJQ').jqGrid('restoreRow', lastsel); 
         jQuery('#gridJQ').jqGrid('editRow', id, true); 
         lastsel = id; 
        } 
       }, 
       editurl: "UploadDocument.aspx", 
       caption: "FileUpload Grid" 

      });

来源

2013-08-05 Naveen Reddy

您需要添加的选项列选项，如

colModel: [{ 
    name: 'documentName', 
    index: 'documentName', 
    width: 200, 
    editable: false, 

    //add the following in one of the colModel config 
    formatter: 'actions', 
    formatoptions: { 
     keys: true, 
     editformbutton: true 
    } 
}

Demo

来源

2013-08-06 04:51:22 zsong

我将如何增加一个行动是什么？说我也需要一个“视图”。 –

如何添加编辑和删除图标在jQGrid操作列

回答

相关问题