4

MVC Webアプリケーションを使用しているKendoUIグリッドがありますが、すべて正常に機能していますが、UIに条件付きで表示されるカスタムコマンドボタンを追加し、コントローラーでコマンドを実行して必要なパラメーターを渡すだけです。

columns.Command(command => command.Custom("UnlockAccount").SendDataKeys(true).Click())

コマンドは上記のように指定されていますが、DataItemsIsLockedプロパティがtrueの場合にのみボタンを表示したいと思います。

また、コントローラーで呼び出しとメソッドを実行する方法もわかりません。剣道のサイトでこれのデモを見つけることができず、これを前進させる方法がわかりません。

4

4 に答える 4

4

条件付きコマンドボタンにクライアントテンプレートを使用する具体的な例を次に示します。

const string ShowUpdateButton = "#if (IsNetReversal == false) {#<a class='k-button k-button-icontext k-grid-edit' href='\\#'><span class='k-icon k-edit'></span>Update</a>#}#";
const string ShowReverseButton = "#if (IsNetReversal == false) {#<a class='k-button k-button-icontext k-grid-reverse' href='/JournalDetail/Reverse/#: ID #'  ><span class='k-icon k-reverse'></span>Reverse</a>#}#";
const string ShowDeleteButton = "#if (IsAdjustment == true) {#<a class='k-button k-button-icontext k-grid-delete' href='\\#'><span class='k-icon k-delete'></span>Delete</a>#}#";

テンプレートはインラインで実行できますが、定数を宣言してからstring.formatを使用してそれらを連結すると、（特に複数のボタンの場合）簡単になります。

col.Template(o => o).ClientTemplate(string.Format("{0}{1}{2}", ShowUpdateButton, ShowDeleteButton, ShowReverseButton));

利点は、ポップアップエディターで機能するのに対し、jqueryハックは、ユーザーが編集をキャンセルしたときに条件付きステータスを無視することです。ポップアップエディタからキャンセルすると、ビューモデルまたはKendoがグリッド行を保存する場所からグリッド行が復元され、jquery/javascriptハックの前のボタン状態になります。上記の方法では、クライアントテンプレートのHTML出力をコピーしたため、標準コマンドも自動配線されます。

欠点は、剣道がコマンドボタンのパターンを変更すると、クライアントテンプレートが失敗する可能性があることです。私はこれ以外のいくつかの方法を疲れさせました、そしてこの方法の欠点は他の方法より良いようです。

剣道フォーラムに関する注意：この投稿の日付の時点では、サポートにお金を払っていない人がフォーラムに投稿することを許可していないようです。代わりに、ここに質問を投稿することをお勧めします。彼らはスタックオーバーフローを監視しており、私の経験では、ここでより迅速に質問に答えているようです。

于 2014-01-09T22:07:01.953 に答える
3

代わりに、ClientTemplateメソッドを介してテンプレート列を使用してください。

条件付きテンプレートについては、フォーラムで何度も取り上げられています。コマンド列はそれほど柔軟ではありません。

于 2013-02-18T18:10:13.643 に答える
2

Kendoの2018年12月のリリースでは、条件付きでカスタムボタンをより簡単に表示できるようになりましたが、それでもJavaScriptに依存して機能します。この関数は、dataGridの前に定義する必要があります。そうしないと、問題が発生します。

function showCommand(dataItem) {
        console.log("determining to hide or show" + dataItem);
        // show the Edit button for the item with Status='New'
        if (dataItem.Status == 'New') {
            return true;
        }
        else {
            return false;
        }       
}

次に、グリッドのコード。

.Columns (columns => {
columns.Command (
        command => command.Custom ("Approve")
        .Visible ("showCommand")
        .Click ("approveFunc")
    )
    .Width (100)
    .HeaderTemplate ("Actions")
})
于 2019-07-10T17:38:55.227 に答える
0

Visibleプロパティでカスタムコマンドボタンの表示を制御できます。

columns.Command(command => command.Custom("UnlockAccount").SendDataKeys(true).Click().Visible("unlockAccountVisible"))

Visibleプロパティは、JS関数名を受け入れ、現在のdataItemを引数として渡します。ボタンの可視性を評価するJS関数：

<script>
  function unlockAccountVisible(dataItem) {
  // show the UnlockAccount button only when data item property IsLocked == true
  return dataItem.IsLocked;
  }
</script>

詳細については、コマンドボタンを条件付きで表示するkendo-uiのドキュメント記事を参照してください。

于 2019-01-17T14:32:07.113 に答える