0

我想用我自己的来更改操作列中 jqGrid 的删除图标Icon(newTrash-icon.png)。我已经看到 jqGrid 从一个 png 图标文件加载图标。如何用其他一些垃圾桶图标替换默认垃圾桶图标。

我尝试了下面的代码，但它不起作用。

在我的gridComplete

$('.ui-icon-trash').removeClass('ui-icon-trash').addClass('ui-icon-customtrash');

在我的 CSS

.ui-icon-customtrash {
    background: url("~/Images/newTrash-icon.png");
    background-position: -64px -16px;

}

我希望显示下面的图标来代替默认的删除图标

newTrash-icon.png

4

2 回答 2

1

您可以做的只是使用navGriddelicon选项：

$("#list").jqGrid("navGrid", "#pager", {delicon: "ui-icon-customtrash"});

演示使用delicon: "ui-icon-scissors"并显示

在此处输入图像描述

更新：演示使用您发布的图标演示了相同的内容。它显示

在此处输入图像描述

我使用了以下 CSS

.ui-state-default .ui-icon-customtrash {
    background: url("http://i.stack.imgur.com/Gii7J.png");
    background-position: 0 0;

}
于 2013-10-10T23:48:58.833 回答
0

我找到了我的答案。我已经使用 IcoMoon 应用程序 ( http://icomoon.io/app/ ) 替换了内联操作图标（删除和注释图标）。我从 IcoMoon 网站上选择了我需要的不同图标，并创建了一个样式表，我下载并添加到我的应用程序中。并使用 IcoMoon 提供的类名（“idoc-icon-trash”），我在 afterInsertRow 事件和 boooom 中添加了以下代码。如图所示。

$("#gridJQ .ui-icon-trash").removeClass('ui-icon ui-icon-trash').addClass('idoc-icon-trash');

.idoc-icon-trash {
    font-size: 19px;
    color: #022462;
}

在此处输入图像描述

于 2013-10-12T01:23:30.547 回答