1

無料のjqgrid 4.8を使用しています。モーダル ダイアログ内で jqgrid を使用します。ページャーの削除ボタンを使用しようとすると、すべてのダイアログが無効になります。

http://jsfiddle.net/9ezy09ep

$(function ()
{
    $("#Ecran").dialog(
    {
        dialogClass: 'Ecran',
        autoOpen: false,
        width: 500,
        height:400,
        modal: true,
        open: function (event, ui) {
            $("#jqGrid").jqGrid({
                url: 'http://trirand.com/blog/phpjqgrid/examples/jsonp/getjsonp.php?callback=?&qwery=longorders',
                mtype: "GET",
                datatype: "jsonp",
                colModel: [
                    { label: 'OrderID', name: 'OrderID', key: true, width: 75 },
                    { label: 'Customer ID', name: 'CustomerID', width: 150 },
                    { label: 'Order Date', name: 'OrderDate', width: 150 },
                    { label: 'Freight', name: 'Freight', width: 150 },
                    { label:'Ship Name', name: 'ShipName', width: 150 }
                ],
                viewrecords: true,
                width: 480,
                height: 250,
                rowNum: 20,
                pager: "#jqGridPager"
            });

            jQuery("#jqGrid").jqGrid('navGrid', '#jqGridPager', {
                del: true, add: false, edit: false,
                beforeRefresh: function () {},
                afterRefresh: function () {}},                  
                {}, // default settings for edit
                {}, // default settings for add
                {}, // delete
                {}, // search options
                {}
            );

        },
        close:function () {}
    });
});

何か案は ？ありがとう

4

2 に答える 2

2

jQuery UI ダイアログ内で jqModal を使用することが問題の原因だと思います。jqGrid は jQuery プラグインです。したがって、jQuery UIの CSS だけを使用するわけではありません。jQuery UI ダイアログは使用しません。

行を含めることをお勧めします

$.fn.jqm = false;

jqModal モジュールをオフにし、jQuery UI 機能を使用します。http://jsfiddle.net/9ezy09ep/7/を参照してください。説明したテスト ケースの無料の jqGrid のコードを改善するために、後で詳しく問題を調べます。

更新: 無料の jqGrid でいくつかの追加の変更を行いました。これにより、代替ソリューションが可能になります。次のようなコードを使用できるようになりました

$.jgrid.jqModal = $.jgrid.jqModal || {};
$.extend(true, $.jgrid.jqModal, {toTop: true});

jqModal モジュールの動作を変更します。次のデモは結果を示していますhttp://jsfiddle.net/OlegKi/9ezy09ep/9/

于 2015-03-25T18:07:18.677 に答える
0

jqGrid は、モーダル ダイアログを作成するときにui-dialogクラスを利用する必要があります。

jquery.jqGrid.min.jsファイルを変更する必要があります。

バージョン 5.0.0 に従って、

次の行にui-dialogクラスを追加するだけで、

modal: { modal: "ui-widget ui-widget-content ui-corner-all ",

例えば

modal: { modal: "ui-widget ui-widget-content ui-corner-all ui-dialog",

無料の jqGrid バージョンに従って、

次の行にui-dialogクラスを追加します。

 dialog: {
                ...
                window: "ui-widget ui-widget-content ui-corner-all ui-front",
                ...

例えば

 dialog: {
                ...
                window: "ui-widget ui-widget-content ui-corner-all ui-front ui-dialog",
                ...
于 2016-01-28T20:08:47.053 に答える