MVC4 jqGrid寻呼机不显示图标答案

【问题标题】：MVC4 jqGrid pager not showing iconsMVC4 jqGrid寻呼机不显示图标
【发布时间】：2013-12-19 11:45:56
【问题描述】：

我在我的 MVC4 应用程序中使用 jQGrid。一切正常，除了图标没有显示在寻呼机上。我需要帮助才能知道出了什么问题。

这是我的代码：

<link href="@Url.Content("~/Content/themes/jquery-ui.css")" rel="stylesheet" media="screen">
<link href="@Url.Content("~/Content/jquery.jqGrid/ui.jqgrid.css")" rel="stylesheet" media="screen">
<link href="@Url.Content("~/Content/jquery.jqGrid/ui.multiselect.css")" rel="stylesheet" media="screen">

<script src="js/i18n/grid.locale-en.js" type="text/javascript"></script>

<script src="@Url.Content("~/Scripts/i18n/grid.locale-pt.js")"></script>
<script src="@Url.Content("~/Scripts/jquery.jqGrid.min.js")"></script>
<script src="@Url.Content("~/Scripts/ui.multiselect.js")"></script>
<script src="@Url.Content("~/Scripts/jquery.tablednd.js")"></script>
<script src="@Url.Content("~/Scripts/jquery.contextmenu.js")"></script>

<script type="text/javascript">

    jQuery(document).ready(function () {
        $('#myGrid').jqGrid({
            height: 300,
            toolbar: [true, 'bottom'],
            multiselect: true,
            cellEdit: false,
            rowNumbers: true,
            datatype: 'json',
            rowNum: 50,
            rowList: [50, 100, 200],
            url: '@Url.Action("GetGridData", "AdminSysLog")',
            editurl: '@Url.Action("CRUDGridData", "AdminSysLog")',
            contentType: "application/json; charset-utf-8",
            caption: 'System Logs',
            mtype: 'POST',
            shrinkToFit: false,
            pager: '#myPager',
            sortname: 'DateTime',
            sortorder: 'desc',
            viewrecords: true,
            colNames: ['DATETIME', 'LEVEL', 'TYPE', 'SYSTEM', 'USER', 'MESSAGE'],
            colModel: [
                            { name: 'DateTime', align: 'center', width: 140, sortable: true, editable: false, searchoptions: { sopt: ['eq', 'ne', 'cn'] } },
                            { name: 'Severity', align: 'center', width: 50, sortable: true, editable: false, searchoptions: { sopt: ['eq', 'ne', 'cn'] } },
                            { name: 'Type', align: 'center', width: 50, sortable: true, editable: false, searchoptions: { sopt: ['eq', 'ne', 'cn'] } },
                            { name: 'Source', align: 'center', width: 100, sortable: true, editable: false, searchoptions: { sopt: ['eq', 'ne', 'cn'] } },
                            { name: 'User', align: 'center', width: 100, sortable: true, editable: false, searchoptions: { sopt: ['eq', 'ne', 'cn'] } },
                            { name: 'Message', align: 'left', width: 500, sortable: true, editable: false, searchoptions: { sopt: ['eq', 'ne', 'cn'] } },
            ]
        }).navGrid('#myPager', {
            edit: false,
            add: false,
            del: true,
            search: true,
            deltext: "Apaga",
            searchtext: "Busca",
            viewrecords: true
        }
        );
    });


</script>


<table id="myGrid"></table>
<div id="myPager"></div>

<br />
<br />

下面是显示的内容（根本没有图标）：

感谢您的任何帮助。

【问题讨论】：

标签： c# jquery asp.net-mvc asp.net-mvc-4 jqgrid

【解决方案1】：

我想您以错误的方式将 jQuery UI 添加到您的项目中。您应该验证文件夹 /Content/themes/（从中获取 jquery-ui.css）是否包含带有 PNG 文件的子文件夹 images。

【讨论】：

Content/themes 包含文件夹“Content/Themes/base/images”和许多 jquery.ui.* 文件（手风琴、所有、自动完成、...、ui.tabs、ui.主题和 jquery-ui)。我错过了什么吗？
@Mendez：如果您打开jquery-ui.css，您将看到相对路径，例如url(images/ui-bg_inset-hard_100_fcfdfd_1x100.png)。这意味着它必须存在于位置 relative 到 jquery-ui.css 的位置中的 images 目录中。如果您使用~/Content/themes/jquery-ui.css，那么上例中的ui-bg_inset-hard_100_fcfdfd_1x100.png 必须存在于目录~/Content/themes/images 中。

【解决方案2】：

对我来说真的很头疼，要解决它，首先为网格寻呼机寻找 Jquery 的 DEMO 工作，例如： http://www.trirand.com/blog/phpjqgrid/examples/loading_data/million_sql/default.php

，在 Firefox 中，我点击了“检查元素”（在按钮中），然后在 url 图像中搜索文件，然后将文件复制到我的机器中；然后在我的项目中，我点击了“查看背景图片”（按钮）；这就是我正在寻找的正确名称。必要时重命名，将该图像放入：..\Styles\images\

这就是解决方案，

“奥马尔·罗梅罗，墨西哥城”

【讨论】：