0
我一直在創建自己的小部件，它使用jQuery UI對話框作爲其一部分。jQuery UI小部件 - 在小部件jQuery UI外部設置選項
我已經擴展了對話框以便進行一些自定義。我的問題是，當我關閉對話框時，我需要更新我的主窗口小部件中的一個選項。 _setOptions方法是私有的（在小部件中），所以我創建了我自己的非私有方法，但我仍然無法從我的擴展函數中調用它。
如何在我的擴展函數中從我的小部件中調用方法？
我會在一些簡單的代碼粘貼所以它更容易理解：提前http://jsfiddle.net/Keelz/GRuPv/25/
感謝您的幫助：
(function($) {
//Start of my widget
$.widget("window.popOut", {
options: {
viewState: 1
//Declaring the initial options value
},
_create: function() {
this._openDialog();
},
_setOption: function(key, value) {
this.options[ key ] = value;
},
//My open button
_openDialog: function(){
var self = this;
this.testButton = $('<button></button>')
.addClass('testGateStateButton')
.click(function(){
self._setOption("viewState" , 2);
//viewState option changed to 2
self._createPopOutWindow();
})
.appendTo('#body-container');
},
//creation of dialog box
_createPopOutWindow: function(){
$(this.element).dialog({
options: {
},
autoOpen: true,
title:'',
dialogClass: "no-close",
position: {
my: "center",
at: "center",
of: $("body") },
create: function(event, ui) {
}
}
);
},
destroy: function() {
// Call the base destroy function.
$.Widget.prototype.destroy.call(this);
},
setView: function(viewStatePar){
self._setOption("viewState" , viewStatePar);
}
});
//adding another button to the Dialog box title in the dialog init function
var _init = $.ui.dialog.prototype._init;
$.ui.dialog.prototype._init = function() {
var self = this;
var dialog_id = this.uiDialogTitlebar.next().attr('id');
_init.apply(this, arguments);
this.uiDialogTitlebar.append('<button id='+ dialog_id +'minBtn role="button" aria-disabled="false" title="Minimise">'+
'<span class="ui-button-icon-primary ui-icon ui-icon-minus"></span></button>');
$('#' + dialog_id + 'minBtn').click(function(){
self.minimise();
//calling the minimise function below
})
};
//extending the dialog widget to add the functionality for my new button
$.extend($.ui.dialog.prototype, {
minimise: function() {
var dialogName = this.element.attr("id");
$('#'+dialogName).dialog("destroy").show();//close the dialog and show the original div
var popout = $('#'+dialogName).popOut(); //create a variable of the popOut widget
console.log(popout);//console logs to check ive got the correct element
popout.setView(1); //calling the setView method on my popout variable but getting the error has no method 'setView'
//attempting to set the options through the use of the setView functions parameters
}
});
$("#popOutContainer").popOut({ viewState: 1 });
}(jQuery));
我也做了一個的jsfiddle！ :)