प्रोग्रामिंग jQuery UI जैसे ExtJS

Question

मैं jQuery UI पर एक अमूर्त परत विकसित करने की कोशिश कर रहा हूं जो विजेट को एक्स्टजेस के समान ऑब्जेक्ट्स (या समान) के रूप में परिभाषित करने की अनुमति देता है।

var mydialog = new $.ui.dialog({ 

modal:true, 
renderTo:'body', 
title:'The Windows Tittle', 
content:'The content of the Window' 


}); 

अब मैं कह सकता हूँ:

:

mydialog.show(); 

पहला कदम (मुझे लगता है कि) jQuery के लिए एक कक्षा सृजन समारोह को जोड़ने के लिए किया गया था, इस कक्षाएं बनाने के लिए अनुमति देते हैं यह अवधारणा है

$.MYNAMESPACE.dialog = $.Class ({ 

constructor:function(){} 

//methods and properties 

}); 

और यहां वास्तविक समस्या आती है: मुझे पिछले क्लास परिभाषा के अंदर वास्तविक $ .ui.dialog को जोड़ने के लिए क्या करना है? मेरा मतलब यह था कि मैं एक नया विजेट नहीं बनाना चाहता हूं, मैं बस एक एबस्ट्रक्शन परत बनाने के लिए पूर्वनिर्धारित jQuery UI विजेट्स के पीछे कोड का पुन: उपयोग करना चाहता हूं जो jQuery UI के साथ ओओपी की अनुमति देता है।

अग्रिम धन्यवाद

Answer 1

आप jQuery-ui विजेट कारखाने की कोशिश की? आप फिर से हो सकता है की खोज करने wheel.js

क्या आप विजेट कारखाने

official splash page और api

त्वरित विचार यह क्या कर रहा है के साथ मिल पर slideshow। मैं

//this is instantiating the widget, does not need to be in the same file 
$(function(){ 
    $(".some-selector").miDialog({autoopen:true //because we can}); 
}); 
//this is a definition, not an instantiation of the widget. aka, 
$.widget("mi.miDialog" //namespace 
    ,$.ui.dialog //inherit from this jquery widget 
    ,//start your widget definition 
{ options:{autoopen:false,//overwrite parent default option, while still giving instance option to override our definition's override of parent 
    someInstanceSafeOption: {why:"not",have:"a",subobject:"option"} }, 
//underscore functions are 'private' unless you dig into the prototype manually 
_create :function(){ 
//you'll need this function. guaranteed to run once. 
// upcoming version call parent create 
this._super(); 
//current version call parent create 
$.ui.dialog.prototype._create(this.options); 
this.element.addClass("mi-dialog"); //help with custom styling 
    this._trigger("created"); //trigger custom events 
//register for events here, as _create() will only run once per individual instance 

}, 
_init:function(){ 
//this will run every time someone calls $('some-selector').miDialog(); 
//i have yet to use it much 
}, 
publicFunction: function(some, params){ 
//this function does whatever you want, and is called $('some-selector'.miDialog("publicFunction", some,params); 
}, 
_destroy: function(){ 
//clean up after your widget's create function, if needed. 
}