jQuery UI Widget - Setting options outside of widget jQuery UI -


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