剣道グリッド:Xアイコンなしでボタンを削除します
-
21-12-2019 - |
質問
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アイコン"
とは異なるものを選ぶことができます。所属していません StackOverflow