kendo-ui
  • kendo-grid
  • 2014-11-04 111 views 0 likes 
    0

    如何更改默認的編輯,刪除,更新和取消按鈕,並用我的圖標替換按鈕?KendoUI - 網格式默認編輯,刪除,更新和取消按鈕

    我的命令代碼:

    command: [ 
         { 
          name: 'edit', 
          template: "<a if-role-permission=\"['PERMISSION_WORKFLOW_DEFINITION_DELETE']\" class='k-grid-edit k-grid-update k-button' style='width: 26px; height: 26px; vertical-align: middle; text-align: center;' ><span style='margin: 4px;' class='glyphicon glyphicon-edit'></span></a>" 
         }, 
         { 
          name: 'destroy', 
          template: "<a if-role-permission=\"['PERMISSION_WORKFLOW_DEFINITION_DELETE']\" class='k-grid-delete k-button' style='width: 26px; height: 26px; vertical-align: middle; text-align: center;' ><span style='margin: 4px;' class='glyphicon glyphicon-remove-circle'></span></a>" 
         } 
        ] 
    } 
    

    回答

    0

    嘗試這樣,

    這僅僅是劍道網格中添加按鈕,

    .k-add 
    { 
        background: url("/Content/images/loading.gif") no-repeat scroll 0 0 rgba(0, 0, 0, 0) !important  
    } 
    

    電網

    $("#grid").kendoGrid({ 
    toolbar: [{ name: "create", text: "Add" }], 
    column:[{command:[ { 
            name: 'edit', 
            template: "<a if-role-permission=\"['PERMISSION_WORKFLOW_DEFINITION_DELETE']\" class='k-grid-edit k-grid-update k-button' style='width: 26px; height: 26px; vertical-align: middle; text-align: center;' ><span style='margin: 4px;' class='glyphicon glyphicon-edit'></span>update</a>" 
            }, 
            { 
            name: 'destroy', 
            template: "<a if-role-permission=\"['PERMISSION_WORKFLOW_DEFINITION_DELETE']\" class='k-grid-delete k-button' style='width: 26px; height: 26px; vertical-align: middle; text-align: center;' ><span style='margin: 4px;' class='glyphicon glyphicon-remove-circle'></span>cancel</a>" 
            }]}] 
    }); 
    

    注意:如果您這樣做,它會影響您所有的grid add按鈕圖標。

    +0

    我認爲它只會改變按鈕上的圖標(可以改變整個應用程序中的這些按鈕)。但是,如何從(更新,取消)按鈕中刪除文本? – lukisp 2014-11-04 09:55:46

    +0

    @lukisp查看我更新的代碼。 – Jaimin 2014-11-04 10:00:46

    +0

    我想在命令按鈕中執行此操作(請參閱我的問題,我通過了我的代碼)。我的網格中只有兩個命令按鈕(編輯和銷燬)。他們更改爲更新,取消編輯或創建模式。我想刪除他們的標籤。 – lukisp 2014-11-04 10:39:52

    0

    嘗試定義以下樣式:

    .k-button { 
        min-width: 32px !important; 
        padding: 0!important; 
    } 
    

    你可能就縮小到您的網格,甚至在某些按鈕。

    這裏檢查它:http://jsfiddle.net/OnaBai/wv2x2uxv/1/

    0

    你可以通過CSS

    .k-grid tbody .k-button { 
        min-width: 12px; 
        width: 27px; 
        height: 27px; 
        overflow: hidden; 
    } 
    
    0
    columns : [ 
    { title: "&nbsp;", width: "83px", template: "<a class='k-button' name='DeleteButton'><span class='k-icon k-i-x'></span>Delete</a>" } 
    ] 
    

    這會給一個按鈕,可以有任何措辭(把span標籤之間的文本),圖標隱藏文本給出的是kix,這是Telerik的刪除按鈕圖標...你可以找到更多here

    這個按鈕可以被名稱引用,或者如果你給它一個ID,它可以被引用。 它不需要在命令內澄清。

    相關問題