Вызов методов объекта конфигурации, который передается функции в JavaScript / jQuery - PullRequest
Новая
       11

Вызов методов объекта конфигурации, который передается функции в JavaScript / jQuery

0 голосов
/ 30 июня 2011

У меня есть функция, которая принимает объект конфигурации, который, в свою очередь, генерирует модальное диалоговое окно с пользовательским интерфейсом jQuery, например: 

function modalDialog(settings) {

    var options = $.extend({
        selector: '.dialog',                        // the dialog element selector 
        disabled: false,                            // disables(true) or enables (false) the dialog
        autoOpen: false,                            // dialog opens automatically when called (true), (false) dialog hidden until .dialog(open) method called 
        closeOnEscape: true,                        // dialog closes when focused and ESC key pressed
        closeText: 'close',                         // specifies text for close button
        draggable: false,                           // (true) dialog draggable by the title bar
        resizable: false,                           // dialog is resizable
        height: 'auto',                             // height of dialog in px
        minHeight: false,                           // min-height in px
        maxHeight: false,                           // max-height in px
        width: 300,                                 // width of dialog in px
        minWidth: 150,                              // min-width in px
        maxWidth: false,                            // max-width in px          
        modal: true,                                // disables other items on page
        hide: null,                                 // the effect to be used when dialog is closed
        show: null,                                 // the effect to be used when dialog is opened
        position: 'center',                         // specifies where dialog should be displayed: single string, array of co-ordiantes, array of string values
        title: '',                                  // dialog title.  Any valid HTML may be used
        zIndex: 1000,                               // starting z-index for the dialog
        stack: true                                 // specifies if dialogs will stack on other dialogs
    }, settings || {});

    $(options.selector).dialog({
        disabled: options.disabled,                         
        autoOpen: options.autoOpen,                          
        closeOnEscape: options.closeOnEscape,                       
        closeText: options.closeText,                           
        draggable: options.draggable,                           
        resizable: options.resizable,                           
        height: options.height,                             
        minHeight: options.minHeight,                           
        maxHeight: options.maxHeight,                           
        width: options.width,                                   
        minWidth: options.minWidth,                             
        maxWidth: options.maxWidth,                                 
        modal: options.modal,                               
        hide: options.hide,                                 
        show: options.show,                                 
        position: options.position,                         
        title: options.title,                                   
        zIndex: options.zIndex,                             
        stack: options.stack,
        create: function(event, ui){
            if (typeof options.createCall == 'function') {
                options.createCall.call(this);
            }           
        },
        open: function(event, ui){
            if (typeof options.openCall == 'function') {
                options.openCall.call(this);
            }           
        },
        beforeClose: function(event, ui){
            if (typeof options.beforeCloseCall == 'function') {
                options.beforeCloseCall.call(this);
            }           
        },  
        close: function(event, ui){
            if (typeof options.closeCall == 'function') {
                options.closeCall.call(this);
            }           
        },
        focus: function(event, ui){
            if (typeof options.focusCall == 'function') {
                options.focusCall.call(this);
            }           
        }       
    }); 
}

Вероятно, в проекте, над которым я работаю, будет много модальностей, поэтому я подумал, что было бы неплохо хранить объекты конфигурации внутри литерала объекта, а не генерировать их на лету. Примерно так: 

icisSite.modalStore = {
    tradeFlowGraph: {
        selector: '.rtx-TradeFlowGraphs',
        title: 'Fertilizer Trade Flow graphs',
        width: 800,
        openCall: function(){
            carouselLink
            .eq(0)
            .trigger('click');
        }
    }
}

Тогда можно создать модал, передав ссылку на сохраненный объект: 

modalDialog(icisSite.modalStore.tradeFlowGraph);

Проблема, с которой я столкнулся, заключается в том, что метод openCall не вызывается при передаче функции modalDialog таким способом. Это работает, когда объект конфигурации передается следующим образом, и я не знаю почему: 

modalDialog({
    selector: '.rtx-TradeFlowGraphs',
    title: 'Fertilizer Trade Flow graphs',
    width: 800,
    openCall: function(){
        carouselLink
        .eq(0)
        .trigger('click');
    }   
});

Хотя передача таких параметров не является проблемой, было бы неплохо хранить их все централизованно в литерале объекта, который доступен постоянно, а не создавать и передавать объекты ad hoc.

1 Ответ

0 голосов
/ 30 июня 2011

Похоже, что введение литерала объекта icisSite.modalStore в область jQuery устраняет проблему.

Так что оборачиваем его в заводскую функцию так:

$ (функция () {

icisSite.modalStore = { tradeFlowGraph: {
селектор: .rtx-TradeFlowGraphs,
title: «Графики торговых потоков удобрений», ширина: 800,
openCall: function () { carouselLink .eq (0) .trigger ( 'щелчок'); }}}});

...