i've been creating own widget, uses jquery ui dialog part of it.
i've extended dialog in order have customization. problem that, when close dialog box, need update option in main widget. _setoptions
method private (within widget), created own not-private method, still unable call extend function.
how can call method widget in extend function?
i'll paste in simplified code it's easier understand:
(function( $ ) { //start of widget $.widget( "window.popout", { options: { viewstate: 1 //declaring 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 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 base destroy function. $.widget.prototype.destroy.call( ); }, setview: function(viewstatepar){ self._setoption( "viewstate" , viewstatepar); } }); //adding button dialog box title in 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 minimise function below }) }; //extending dialog widget add functionality new button $.extend($.ui.dialog.prototype, { minimise: function() { var dialogname = this.element.attr("id"); $('#'+dialogname).dialog("destroy").show();//close dialog , show original div var popout = $('#'+dialogname).popout(); //create variable of popout widget console.log(popout);//console logs check ive got correct element popout.setview(1); //calling setview method on popout variable getting error has no method 'setview' //attempting set options through use of setview functions parameters } }); $("#popoutcontainer").popout( { viewstate: 1 } ); }( jquery ) );
i've made jsfiddle: http://jsfiddle.net/keelz/grupv/25/
thanks in advance help! :)
turns out syntax out bit, need have method trying call inside brackets , quotes here added minimise function in order working:
$('#' + dialogname).popout('setview', 2);
and heres got anser from: jquery - widget public methods
hope can in future!
Comments
Post a Comment