Uncaught exception: (NS_ERROR_INVALID_POINTER)

Suite and Optimus Suite 5
#1

Hello to all.

First off all I have to say that this is a great product, and all my gratitude for the people who made it.

My problem now is this:

I have an aplication in which I put a tab bar in a form. The form is on multiple tabs that are activated or deactivated or there content change base on the user generated events on previous form elements.

something like this: [code]

form elementes 1 2
other form elements
other form elements
Others form elements

[/code]
I also initiate the other dhtmlx obj…

When I change the state of ‘example’ in a specific order I receive this error in all browsers:(IE6, IE8, Chorme, FireFox…);

The order is: 1,2,0 (by value).

— this string is from Firefox FireBug —
uncaught exception: [Exception… “Component returned failure code: 0x80004003 (NS_ERROR_INVALID_POINTER)” nsresult: “0x80004003 (NS_ERROR_INVALID_POINTER)” location: “JS frame :: domain.xx/web/dhtmlx/dhtmlx.js :: anonymous :: line 1740” data: no]
Line 0

If you have any idea will be grate. Thank You.

#2

Hello

there isn’t “c4” container on the page. Try to comment the following line to solve the issue:

//tabbar.setContent(‘t4’, ‘c4’);

#3

I posted wrong, the last container is c4. In post I wrote c3_s. My bad.

#4 
<form>
<div id='tabbar'></div>

<div id='c1'>form elementes
<select name='example' onchange='validateTabs(this.value)'>
    <option value='0'></option>
    <option value='1'>1</option>
    <option value='2'>2</option>
</select>
</div>

<div id='c2' style='display:none;'>other form elements</div>
<div id='c2_s' style='display:none;'>other form elements</div>

<div id='c3' style='display:none;'>
     <div id='gridObj'></div>
     <div id='toolbarObj'></div>
</div>

<div id='c3_s' style='display:none;'>
     <div id='gridObj_S'></div>
     <div id='toolbarObj_S'></div>
</div>

<div id='c4'>Others form elements</div>
</form> 

<script>
var tabbar=new dhtmlXTabBar("tabbar","top");
        tabbar.setImagePath("/web/dhtmlx/imgs/");
        tabbar.addTab("t1","Title1","130px");
        tabbar.addTab("t2","Title2","130px");
        tabbar.addTab("t3","Title3","130px");
        tabbar.addTab("t4","Title4","130px");
        tabbar.setContent('t1', 'c1');
        tabbar.setContent('t4', 'c4');
        tabbar.setSkinColors("#EFEFEF","#FAFAFA");


function validateTabs(offerType) {
    switch (offerType) {
        case '1':

        tabbar.setContent('t2', 'c2');
        tabbar.setContent('t3', 'c3');
        tabbar.enableTab('t2');
        tabbar.enableTab('t3');
        tabbar.setTabActive('t2');
        break;
        
        case '2': 
        tabbar.setContent('t2', 'c2_s');
        tabbar.setContent('t3', 'c3_s');
        tabbar.enableTab('t2');
        tabbar.enableTab('t3');
        tabbar.setTabActive('t2');
        break;
        
        default:
        tabbar.disableTab('t2',true);
        tabbar.disableTab('t3',true);
    }

validateTabs(0);
</script>
#5

There is the following mistake:

tabbar.setContent(‘t2’, ‘c2’);
tabbar.setContent(‘t2’, ‘c2_s’); /-> element with id = ‘c2’ is removed/
tabbar.setContent(‘t2’, ‘c2’); /you try to add non-existent element/

To solve the issue:

var elems = {}
elems.c2 = document.getElementById(“c2”);
elems.c3 = document.getElementById(“c3”);
elems.c2_s = document.getElementById(“c2_s”);
elems.c3_s = document.getElementById(“c3_s”);

function validateTabs(offerType) {
switch (offerType) {
case ‘1’:

    tabbar.setContent('t2',elems.c2);
    tabbar.setContent('t3',elems.c3);
    tabbar.enableTab('t2');
    tabbar.enableTab('t3');
    tabbar.setTabActive('t2');
    break;
   
    case '2':
    tabbar.setContent('t2',elems.c2_s);
    tabbar.setContent('t3', elems.c3_s);
    tabbar.enableTab('t2');
    tabbar.enableTab('t3');
    tabbar.setTabActive('t2');
    break;
   
    default:
    tabbar.disableTab('t2',true);
    tabbar.disableTab('t3',true);
}

}