Roo/bootstrap/NavItem.js

[roojs1] / Roo / bootstrap / NavItem.js

diff --git a/Roo/bootstrap/NavItem.js b/Roo/bootstrap/NavItem.js
index cff0ad0..c5cec6d 100644 (file)
--- a/Roo/bootstrap/NavItem.js
+++ b/Roo/bootstrap/NavItem.js
@@ -71,14 +71,17 @@ Roo.extend(Roo.bootstrap.NavItem, Roo.bootstrap.Component,  {
     preventDefault : false,
     tabId : false,
     tagtype : 'a',
+    tag: 'li',
     disabled : false,
     animateRef : false,
     was_active : false,
     
+    navLink: false,
+    
     getAutoCreate : function(){
          
         var cfg = {
-            tag: 'li',
+            tag: this.tag,
             cls: 'nav-item'
             
         };
@@ -127,6 +130,19 @@ Roo.extend(Roo.bootstrap.NavItem, Roo.bootstrap.Component,  {
         
         return cfg;
     },
+    onRender : function(ct, position)
+    {
+       // Roo.log("Call onRender: " + this.xtype);
+        if (Roo.bootstrap.version == 4 && ct.dom.type != 'ul') {
+           this.tag = 'div';
+       }
+       
+        var ret = Roo.bootstrap.NavItem.superclass.onRender.call(this, ct, position);
+       this.navLink = this.el.select('nav-link').first();
+       return ret;
+    },
+      
+    
     initEvents: function() 
     {
         if (typeof (this.menu) != 'undefined') {
@@ -228,8 +244,14 @@ Roo.extend(Roo.bootstrap.NavItem, Roo.bootstrap.Component,  {
         
         if (!state ) {
             this.el.removeClass('active');
+           this.navLink ? this.navLink.removeClass('active') : false;
         } else if (!this.el.hasClass('active')) {
+           
             this.el.addClass('active');
+           if (Roo.bootstrap.version == 4) {
+               this.navLink ? this.navLink.addClass('active') : false;
+           }
+           
         }
         if (fire) {
             this.fireEvent('changed', this, state);