KENDO GRID: Удалить кнопку без X Icon

Question

Я хочу отобразить кнопку удаления без значка x в сетке Kendo.Есть ли способ сделать это? Примечание. Я использую сетку Kendo 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"))
        ))

.

Вот мой код.Но я не знаю, откуда у меня есть возможность удалить Sleet Icon (x)

Answer 1

Я искал, если какая-либо прямая команда для снятия x символа.Но я все равно не нашел.Поэтому я попытался увидеть GRID HTML-код в Firebug, и я обнаружил, что есть диапазон для значка, который имеет два класса "K-kncon" и "k-delete" .Класс k-icon используется для другого значка, также любимого фильтра или редактирования.И K-удаление только для удаления значка, поэтому я попробовал последующую и его работает:

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

.

Answer 2

Этот подход кажется немного взлома.В идеале, ответ на ОП будет вокруг, как шаблон разметки, генерируемый столбцами типа команд сетки.Я не уверен, как это сделать сам, но может ответить на это с помощью решения только CSS.

Вы можете использовать свойство отображения для управления видимостью элемента, содержащего значок и по существу скрыть его.Используя таблицу от OP, как пример ...

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

.

Вы можете использовать CSS, чтобы написать правило, как ...

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

.

Answer 3

Я решал со следующим (в 2018 году):

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

.

iconclass не имеет значения, вы можете выбрать все, что отличается от «k-icon»