質問

kendoグリッドにXアイコンなしで削除ボタンを表示したい。それをする方法はありますか? 注:剣道MVCグリッドを使用しています。

@(Html.Kendo().Grid<RxConnectEntities.DeleteFileDTO>().Name("deleteList")
    .Columns(columns =>
    {
        columns.Bound(p => p.DeleteFaxID).Hidden(true);
        columns.Bound(p => p.FaxName).Width(100).Title("File Name");
        columns.Bound(p => p.PerformedDateTime).Width(75).Title("Archive Date").Format("{0:MM/dd/yyyy}");
        columns.Command(command => { command.Destroy().Text("Move"); }).Width(50);
        columns.Bound(p => p.FilePath).Hidden(true);
    })
    .Editable(editable => editable.Mode(GridEditMode.InLine).DisplayDeleteConfirmation("Are you sure want to Move this Finance File?"))
    .Pageable(p => p.PageSizes(true))
        .Scrollable()
        .Sortable()
        .Selectable(selectable => selectable.Mode(GridSelectionMode.Single).Type(GridSelectionType.Row))
        .Events(events => events.Change("onChange"))
        .Groupable()
    .Filterable(filterable => filterable.Extra(false).Operators(operators => operators.ForString(str => str.Clear().StartsWith("Starts with").Contains("contains").IsEqualTo("Is equal to"))))
    .HtmlAttributes(new { style = "height:738px;" })
        .DataSource(dataSource => dataSource
        .Ajax().ServerOperation(true)
        .PageSize(20)
        .Model(m => m.Id(p => p.DeleteFileID))
        .Read(read => read.Action("GetFileList", "Fax"))
    .Destroy(update => update.Action("MoveFileFromArchiveToQueue", "Operation"))
        ))
.

これは私のコードです。しかし、削除アイコンを削除するオプションがある場所からわかりません(x)

役に立ちましたか?

解決

Xシンボルを削除するための直接コマンドがあれば検索されました。しかし、私はとにかく見つけませんでした。だから私はFirebugでグリッドHTMLコードを見ようとしました、そして、私は 2クラス "kアイコン"と "k-delete" を持つアイコンのスパンがあることがわかりました。K-Iconクラスは、フィルタや編集などの他のアイコンに使用されます。そしてK-Deleteは削除アイコンのみですので、以下を試してみてください:

<script>
$(document).ready(function () {
  var grid = $('#deleteList').data("kendoGrid");
  grid.bind('dataBound', function (e) {
    this.element.find('.k-delete').remove();
  });
});
</script>
.

他のヒント

このアプローチはハックの少しのようです。理想的には、OPの回答は、グリッドのコマンドタイプの列によって生成されたマークアップをテンプレートする方法のまわりです。私は自分自身をどのようにするかはわかりませんが、CSSのみの解決策とこれに答えることができます。

表示プロパティを使用して、アイコンを含む要素の可視性を制御でき、基本的にそれを非表示にすることができます。例としてのテーブルを使用して...

@(Html.Kendo().Grid<RxConnectEntities.DeleteFileDTO>().Name("deleteList")...
.

CSSを使用してルールを書くことができます...

#deleteList .k-delete { display: none; }
.

次のことで解決しました(2018年):

columns.Command(command => { command.Destroy().Text("Move").IconClass("k-no-icon"); }).Width(50);
.

iconclassは関係ありません、あなたは "kアイコン"

とは異なるものを選ぶことができます。

ライセンス: CC-BY-SA帰属
所属していません StackOverflow
scroll top