Results 1 to 7 of 7

Thread: How to check if a tab already exists

  1. #1
    Ext User
    Join Date
    Apr 2008
    Posts
    83
    Vote Rating
    0
      0  

    Default How to check if a tab already exists

    Hi,

    I want to update the tab if it already exists and will create a new tab if it does not exist. Please help how can I check that.
    Code:
    if(strCommand == 'home.partSearch') {	    
    	        var resultHTML = "<div id = 'parts-grid'>";
    	        var tabTitle;	       
    	        alltabs.add({           
    	          title: 'Results',
    	                layout:'fit',
    	                forceFit: true,
    	                id:index,
    	                html: resultHTML,
    	                closable: true       
    	              });
    	              
    	         alltabs.setActiveTab(1);
    	        
    	     }

  2. #2
    Ext User
    Join Date
    Apr 2008
    Posts
    83
    Vote Rating
    0
      0  

    Default Another piece of code

    Code:
    var alltabs;	
    							
    		var searchHTML = "<table><tr><td><div id = 'search-form'></div></td>" +
    			   	 		 "<td><div id='form-ct-itemselector'></div></td></tr></table>";
    					
    			
    	  	var tabs = new Ext.TabPanel({
    	        renderTo: document.body,	        
    	        activeTab: 0,
    	        width:1230,
    	        height:750,	        	       
    	        plain:true,
    	        defaults:{autoScroll: true},
    	        items:[{
    	                title: 'Search',
    	                layout:'fit',
    	                forceFit: true,
    	                html: searchHTML
    	            }]
    	    });
    	   alltabs = tabs;

  3. #3
    Ext User para's Avatar
    Join Date
    Apr 2007
    Location
    Redmond, WA
    Posts
    918
    Vote Rating
    0
      0  

    Default

    You need a unique identifier for each tab. Most of the time the 'id' config is used.
    Then its simply something like:
    Code:
    if(strCommand == 'home.partSearch') {	    
    	        var resultHTML = "<div id = 'parts-grid'>";
    	        var tabTitle;	       
    	        var tabId;
    	        var tabExists = false;
    	        for(var i=0; i<alltabs.items.length && !tabExists; i++) {
    	            if(alltabs.items[0].id == tabId) {
    	                tabExists = true;
    	            }
    	        }
    	        if(!tabExists) {
    	        alltabs.add({    
    	          id: tabId,       
    	          title: 'Results',
    	                layout:'fit',
    	                forceFit: true,
    	                id:index,
    	                html: resultHTML,
    	                closable: true       
    	              });
    	              
    	         alltabs.setActiveTab(1);
    	        }	        
    	     }

  4. #4
    Ext User
    Join Date
    Jul 2007
    Location
    Florida
    Posts
    9,996
    Vote Rating
    8
      0  

    Default

    search before posting.....this has been answered a few times very recently.

  5. #5
    Ext User
    Join Date
    Apr 2008
    Posts
    83
    Vote Rating
    0
      0  

    Default thanks

    thanks it is working

  6. #6
    Sencha Premium Member
    Join Date
    May 2014
    Location
    New York
    Posts
    9
    Vote Rating
    24
      0  

    Default

    why reinvent the wheel.. there is API for that ...
    Code:
    ....
    var c=tabPanel.getComponent(tabId)
    if(c && tabPanel.contains(c)){
        Ext.toast('tab contains  '+tabId);
        tabPanel.setActiveTab(tabId);
    }else {
        Ext.toast('tab adding new '+tabId);
        var tab = tabPanel.add({
            title: 'Tab ' + label,
            html: label,
            id:tabId
        });
    
        tabPanel.setActiveTab(tabId);
    }

  7. #7
    Sencha User
    Join Date
    Nov 2013
    Location
    Mauritius
    Posts
    2
    Vote Rating
    0
      0  

    Default

    var tabId = 'panel-'+record.get('Id');
    var tabExists = false;
    var toBeActive;


    for(var i=0; i< tabPanel.items.length && !tabExists; i++) {
    if(tabPanel.items.items[i].id == tabId) {
    tabExists = true;
    toBeActive = i;
    }
    }


    if(!tabExists) {
    var tab = tabPanel.add({
    title: record.get('Name'),
    items: mainForm,
    closable: true,
    id:'panel-'+record.get('Id')
    });




    tabPanel.setActiveTab(tab);
    }else{
    tabPanel.setActiveTab(toBeActive);
    }

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •