JqG​​rid搜索弹出窗口未显示

时间:2013-06-14 06:22:46

标签: asp.net-mvc jqgrid-asp.net

当我点击 jqGrid 中的搜索按钮时,不会显示搜索弹出窗口。我已经给了search=true,我做了另一个项目它的工作正常。我没有弄到什么问题。有什么遗失。请任何人帮忙。 或者任何人都可以帮助如何在jquery中手动搜索功能。

插件

<link  href="@Url.Content("~/Content/ui.jqgrid.css")" rel="stylesheet" type="text/css" />
<script src="@Url.Content("~/Scripts/grid.locale-en.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery.jqGrid.min.js")" type="text/javascript"</script>

查看代码:

@using (Html.BeginForm())
{

    <table id="Channelslistgrid" cellpadding="0" cellspacing="0">
    </table>
    <div id="pager" name="pager" style="text-align: center;">
    </div>
}

代码:

<script type="text/javascript">
    $(function () {

        $("#Channelslistgrid").jqGrid({
            colNames: ['Title', 'Description',  'LogoFileName' ],
            colModel: [
                        { name: 'Title', index: 'ChannelName', sortable: true, align: 'left', width: '200',
                            editable: false, edittype: 'text',search:true,searchoptions:{sopt:['eq']}

                        },
                        { name: 'Description', index: 'Description', sortable: false, align: 'left', width: '120',
                            editable: false, edittype: 'text',search:true,searchoptions:{sopt:['eq']}

                        },

                        { name: 'Logo', index: 'Logo', align: 'left', formatter: unitsInStockFormatter, sortable: false, width: '100',
                                editable: false,search:false

                            }

                  ],
            pager: jQuery('#pager'),
            sortname: 'Title',
            rowNum: 15,
            rowList: [15, 20, 25],
            sortorder: "desc",
            height: 345,
            viewrecords: true,
            rownumbers: true,
            caption: 'ChannelsList',
            width: 660,
            url: "@Url.Content("Urlpathgiven")",
            datatype: 'json',
            mtype: 'GET'
        })
        jQuery("#Channelslistgrid").jqGrid('navGrid', '#pager', { edit: false, add: false, del: false, search: true, refresh: true },
            { closeOnEscape: true, reloadAfterSubmit: true, closeAfterEdit: true, left: 400, top: 300 },
            { closeOnEscape: true, reloadAfterSubmit: true, closeAfterAdd: true, left: 450, top: 300, width: 520 },
            { closeOnEscape: true, reloadAfterSubmit: true, left: 450, top: 300 },
            {closeAfterSearch:true,closeAfterReset:true,left: 450, top: 300}

            );

    });
</script>

1 个答案:

答案 0 :(得分:0)

在Bundle.Config中包含所有脚本网址和样式路径。

        bundles.Add(new ScriptBundle("~/bundles/bundleName").Include(
                    "~/js/jquery.jqGrid.src.js",
                    "~/js/jquery-ui-1.8.2.custom.min.js",
                    "~/js/i18n/grid.locale-en.js"));

        bundles.Add(new StyleBundle("~/css").Include("~/css/ui.jqgrid.css");

在Layout.cshtml文件末尾添加

        @Scripts.Render("~/bundles/jquery")
        @Scripts.Render("~/bundles/jqueryval")
        @Scripts.Render("~/bundles/jqueryui")
        @Scripts.Render("~/bundles/bundleName")

谢谢, BPL