javascript - YUI TabView: "add tab" button stuck on the left side when all tabs are closed -


i'm using yui tabview widget adding , removing tabs described in yuilibrary-tabview-add-remove.

i've noticed "bug" or maybe missing functionality: when close tabs , add new tab, "add tab" button stuck on left side of tab bar, , new tabs sorted on right side. if don't close tabs, button stay on right side no matter what.

now, i've added workaround: when adding new tab, no-tabs state detected , dom li-item sorted jquery after() method. finally, newly added tab selected:

onaddclick : function(e) {   e.stoppropagation();   var tabview = this.get('host'), input = this.gettabinput();   tabview.add(input, input.index);    // when no tabs present, move 'add button' end after adding new tab   if ( tabview.size() == 1) {     var addtabbutton = $('#addtabbutton');     addtabbutton.next().after(addtabbutton);     tabview.selectchild(0);   }; } 

however, i'm not happy solution. might there more elegant way solve issue?

your solution valid. i'd write using yui because loading yui , jquery expensive in kweight , maintenance cost (you , coworkers need master 2 libraries).

one clean option create node in initializer , keep reference can move around later:

initializer: function (config) {   var tabview = this.get('host');    // create node before rendering , keep reference   this._addnode = y.node.create(this.add_template);    tabview.after('render', this.afterrender, this);    tabview.get('contentbox')     .delegate('click', this.onaddclick, '.yui3-tab-add', this); },  _appendaddnode: function () {   var tabview = this.get('host');   tabview.get('contentbox').one('> ul').append(this._addnode); },  afterrender: function (e) {   this._appendaddnode(); },  onaddclick: function (e) {   e.stoppropagation();    var tabview = this.get('host'), input = this.gettabinput();   tabview.add(input, input.index);    // when no tabs present, move 'add button' end after adding new tab   if ( tabview.size() == 1) {     // _addnode present, using append() it'll moved     // last place in list     this._appendaddnode();   }; } 

here's working version: http://jsbin.com/ilim/2/


Comments

Popular posts from this blog

assembly - 8086 TASM: Illegal Indexing Mode -

Java, LWJGL, OpenGL 1.1, decoding BufferedImage to Bytebuffer and binding to OpenGL across classes -

javascript - addthis share facebook and google+ url -