劍道格，在編輯按鈕改變文字

我有一個劍道格柵，看起來有點像這樣（代碼編輯的清晰度）：劍道格，在編輯按鈕改變文字

var gridList = $('##listBo').kendoGrid({ 

     ... 

     columns: [ 
      ... 
      { 
       command: "edit" 
       , title: 'Edit' // Need to make this text conditional 
       , width: 91 
      } 
     ] 

     ... 

     , editable: { 
       mode: "popup" 
       , template: $("##addEditPopup").html() 
       , window: { 
       open: loadJSOnWindowLaunch 
       , title: "Reservation request" 
      } 
      } 
     , dataBound: function(e) { 
      dataBoundFunction(); 
     } 

    }).data("kendoGrid");

我需要的按鈕說，在某些情況下，「編輯」和根據數據源中的值查看其他人。

我該如何做到最好？

來源

2016-11-11 Junglefish

解決這種情況的一種簡單方法是製作一個自定義命令列，然後使用模板選項，根據您的條件渲染列按鈕。

嘗試這樣的：

$("#grid").kendoGrid({ 
        dataSource: dataSource, 
        pageable: true, 
        height: 550, 
        toolbar: ["create"], 
        columns: [ 
         { field:"ProductName", title: "Product Name" }, 
         { field: "UnitPrice", title:"Unit Price", format: "{0:c}", width: "120px" }, 
         { field: "UnitsInStock", title:"Units In Stock", width: "120px" }, 
         { field: "Discontinued", width: "120px" }, 
         { template: comandTemplate }], 
        editable: "popup" 
       }); 
      }); 
      // render command column button based on condition 
      function comandTemplate(model){ 
       // here i use Discontinued attribute to data model to show 
       // view detail button or edit button 
       if(model.Discontinued==0) 
       { 
        return '<a class="k-button k-button-icontext k-grid-edit" href="#"><span class="k-icon k-edit"></span>Edit</a>'; 
       } 
       else 
       { 
        return '<a class="k-button k-button-icontext" href="javascript:void(0)" onclick="viewDetailsAction()">View Details</a>'; 
       } 
      } 
      // Custom action if view detail button click 
      function viewDetailsAction() 
      { 
       alert("Your custom action for view detail"); 
      }

這裏是工作示例http://dojo.telerik.com/AdAKO

我希望這會幫助你。

來源

2016-11-15 07:34:04

你試過我的解決方案嗎？這是你想要的嗎？ –

嗨。在我問這個問題之前，我嘗試了一些類似的東西。我遇到的問題是，如果您查看我的原始代碼，當按下'編輯'按鈕時，我需要執行'可編輯'節點中的所有內容（即啓動彈出窗口，運行JS函數等）。我怎樣才能使用你的解決方案，並仍然讓這些東西運行？ – Junglefish

嗨邁克爾，如果你檢查我創建的演示，你可以看到編輯彈出窗口工作得很好。如果你想在事件上執行任何功能，你可以像往常一樣。讓我知道你想要在什麼事件上執行什麼功能。 –

你只需要在列添加自定義列這樣

{ 
    template: "# if (property == true) { # <a class="k-button k-grid-edit" 
    href="#"><span class="k-icon k-edit"></span>Edit</a> # } else { # 
    <a class="k-button"><span onClick="callFunction()" 
    </span>View</a> # } #", width: "150px" 
}

其中「財產」是指將用作條件字段，以顯示不同的按鈕的字段。

希望，這將爲你工作。（ThumbsUp）

來源

2016-11-18 12:36:54 Punit

劍道格，在編輯按鈕改變文字

回答

相關問題