Эффект jQueryUI и jqGrid - PullRequest
       1

Эффект jQueryUI и jqGrid

2 голосов
/ 09 января 2012

У меня есть сайт, созданный с использованием jQuery и jQueryUI. Все диалоги используют одинаковые эффекты для отображения и скрытия. Однако я не могу установить эффект для тех диалогов, созданных методами editGridRow и viewGridRow jqGrid. Интересно, есть ли что-нибудь, чтобы добавить эффект показа / скрытия в те диалоги, созданные jqGrid.

---- Обновление

Спасибо Олегу за его хитрости в работе с jqGrid. Я успешно изменил свой веб-сайт, чтобы иметь постоянное влияние на отображение диалогов. Короче говоря, мне нужно удалить / обновить встроенный стиль диалога, и это должно быть создано после эффекта. Вот несколько кодов:

$(function () {
        var cssLeft;
        var cssTop;

        $.extend($.jgrid, {
            showModal: function (h) {
                if (cssLeft) {
                    h.w.css("left", cssLeft).css("top", cssTop);
                }
                h.w.show("fold", function() {
                    var htmlEditor = $("#item", h.w);
                    if (htmlEditor) {
                        htmlEditor.tinymce({
                            script_url: "/Scripts/tinymce.3.4.5/tiny_mce.js",
                            mode: "none",
                            theme: "advanced",
                            plugins: "autolink,lists,layer,advhr,advimage,advlink,emotions,inlinepopups,insertdatetime,media,searchreplace,contextmenu,paste,directionality,fullscreen,noneditable,visualchars,nonbreaking,xhtmlxtras",
                            theme_advanced_buttons1: "bold,italic,underline,strikethrough,|,justifyleft,justifycenter,justifyright,justifyfull,|,formatselect,fontselect,fontsizeselect",
                            theme_advanced_buttons2: "cut,copy,paste,|,search,replace,|,bullist,numlist,|,outdent,indent,blockquote,|,undo,redo,|,link,unlink,anchor,image,cleanup,|,forecolor,backcolor",
                            theme_advanced_buttons3: "hr,removeformat,visualaid,|,sub,sup,|,charmap,emotions,media,advhr,|,fullscreen",
                            theme_advanced_buttons4: "insertlayer,moveforward,movebackward,absolute,|,styleprops,|,cite,abbr,acronym,del,ins,attribs,|,visualchars,nonbreaking,blockquote,pagebreak,|,insertfile,insertimage",
                            theme_advanced_toolbar_location: "top",
                            theme_advanced_toolbar_align: "left",
                            theme_advanced_resizing: true,
                            theme_advanced_statusbar: false
                        });
                    }
                });
            },
            closeModal: function (h) {
                if (!cssLeft) {
                    cssLeft = h.w.css("left");
                    cssTop = h.w.css("top");
                }
                h.w.css("left", "inherit").css("top", "inherit");
                h.w.hide("blind").attr("aria-hidden", "true");
                var htmlEditor = $("#item", h.w);
                if (htmlEditor) {
                    if (htmlEditor.tinymce()) {
                        htmlEditor.tinymce().remove();
                    }
                }
                if (h.o) {
                    h.o.remove();
                }
            }
        });

1 Ответ

2 голосов
/ 09 января 2012

Хороший вопрос!

Внутренне jqGrid использует jqModal , который будет частью jqGrid (как модуль jqModal.js). Для реализации анимационных эффектов вы можете перезаписать методы $.jgrid.showModal и $.jgrid.closeModal.

В демоверсии , например, используется следующий код

$.extend($.jgrid, {
    showModal : function(h) {
        h.w.show("slow");
    },
    closeModal : function(h) {
        h.w.hide("slow").attr("aria-hidden", "true");
        if(h.o) {h.o.remove();}
    }
});

Я думаю, вы можете легко изменить код вышеупомянутых функций, чтобы реализовать те же эффекты для отображения и скрытия, которые вы используете на своем сайте.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...