Start Building Professional
Web Apps Today


 
Categories Question details Back To List
Question  posted by Steven Lichtenberg on Apr 28, 2008 04:56
open dhtmlx forum
Ok. Here is the generated code:

<html&gt;
<head&gt;
    <script  src='/dhtmlxcommon.js'&gt;</script&gt;      
    <script  src='/dhtmlXTree.js'&gt;</script&gt;
    <script  src='/dhtmlXTree_start.js'&gt;</script&gt;
 </head&gt;
 <body&gt;
     <h1 align='center'&gt;Update Country/Region/States Serviced</h1&gt;
     <p/&gt;
     <form action='updateservice.p' name='servform'&gt;
          <input type='hidden' name='stateserv'/&gt;
          <input type='hidden' name='carrier' value='106'/&gt;
     <div
         class='dhtmlxTree'
         id='treeboxbox_tree'
         setImagePath='/images/imgs/'
         enableCheckBoxes='true'
         enableThreeStateCheckboxes='true'
         enableDragAndDrop='false'
         style='width:350px; height:260px;overflow:auto;padding_left:70px;'&gt;
         <ul&gt;
             <li id='canada'  &gt;Canada
                 <ul&gt;
            <li id='AB'&gt;ALBERTA</li&gt;
            <li id='BC'&gt;BRITISH COLUMBIA</li&gt;
            <li id='MB'&gt;MANITOBA</li&gt;
            <li id='NB'&gt;NEW BRUNSWICK</li&gt;
            <li id='NL'&gt;NEW FOUNDLAND</li&gt;
            <li id='NS'&gt;NOVA SCOTIA</li&gt;
            <li id='NT'&gt;NORTHWEST TERRITORIES</li&gt;
            <li id='ON'&gt;ONTARIO</li&gt;
            <li id='PE'&gt;PRINCE EDWARD ISLAND</li&gt;
            <li id='PQ'&gt;QUEBEC</li&gt;
            <li id='SK'&gt;SASKATCHEWAN</li&gt;
            <li id='YT'&gt;YUKON</li&gt;            
        </ul&gt;
             </li&gt;
             <li&gt;United States
                <ul&gt;
                    <li&gt;Central
                    <ul&gt;
                        <li id='KS'&gt;KS - 660 679</li&gt;
                        <li id='ND'&gt;ND - 580 588</li&gt;
                        <li id='NE'&gt;NE - 680 699</li&gt;
                        <li id='SD'&gt;SD - 570 577</li&gt;
                    </ul&gt;
                    </li&gt;
                    <li&gt;Mid-Altantic
                         <ul&gt;
                         <li id='DC'&gt;DC - 200 205</li&gt;
                         <li id='DE'&gt;DE - 197 199</li&gt;
                         <li id='MD'&gt;MD - 206 219</li&gt;
                         <li id='VA'&gt;VA - 220 246</li&gt;
                         <li id='WV'&gt;WV - 247 268</li&gt;
                         </ul&gt;
                     </li&gt;
                     <li&gt;Midwest
                     <ul&gt;
                         <li id='IA'&gt;IA - 500 528</li&gt;
                         <li id='IL'&gt;IL - 600 629</li&gt;
                         <li id='IN'&gt;IN - 460 479</li&gt;
                         <li id='KY'&gt;KY - 400 427</li&gt;
                         <li id='MI'&gt;MI - 480 499</li&gt;
                         <li id='MN'&gt;MN - 550 567</li&gt;
                         <li id='MO'&gt;MO - 630 659</li&gt;
                         <li id='OH'&gt;OH - 430 458</li&gt;
                         <li id='WI'&gt;WI - 530 549</li&gt;
                     </ul&gt;
                     </li&gt;
                     <li&gt;Mountain
                     <ul&gt;
                         <li id='CO'&gt;CO - 800 819</li&gt;
                         <li id='MT'&gt;MT - 590 599</li&gt;
                         <li id='WY'&gt;WY - 820 831</li&gt;
                     </ul&gt;
                     </li&gt;
                     <li&gt;Northeast
                     <ul&gt;
                         <li id='CT'&gt;CT - 60 69</li&gt;
                         <li id='MA'&gt;MA - 10 27</li&gt;
                         <li id='ME'&gt;ME - 39 49</li&gt;
                         <li id='NH'&gt;NH - 30 38</li&gt;
                         <li id='NJ'&gt;NJ - 70 89</li&gt;
                         <li id='NY'&gt;NY - 100 119</li
                         &gt;<li id='NY'&gt;NY - 120 149</li&gt;
                         <li id='PA'&gt;PA - 150 196</li&gt;
                         <li id='RI'&gt;RI - 28 29</li&gt;
                         <li id='VT'&gt;VT - 50 59</li&gt;
                     </ul&gt;
                     </li&gt;
                     <li&gt;Northwest
                     <ul&gt;
                         <li id='ID'&gt;ID - 832 839</li&gt;
                         <li id='OR'&gt;OR - 970 979</li&gt;
                         <li id='UT'&gt;UT - 840 849</li&gt;
                         <li id='WA'&gt;WA - 980 994</li&gt;
                     </ul&gt;
                     </li&gt;
                     <li&gt;Southeast
                     <ul&gt;
                         <li id='AL'&gt;AL - 350 369</li&gt;
                         <li id='FL'&gt;FL - 320 349</li&gt;
                         <li id='GA'&gt;GA - 300 319</li&gt;
                         <li id='MS'&gt;MS - 386 399</li&gt;
                         <li id='NC'&gt;NC - 270 289</li&gt;
                         <li id='SC'&gt;SC - 290 299</li&gt;
                         <li id='TN'&gt;TN - 370 385</li&gt;
                     </ul&gt;
                     </li&gt;
                     <li&gt;Southwest
                     <ul&gt;
                         <li id='AR'&gt;AR - 720 729</li&gt;
                         <li id='LA'&gt;LA - 700 719</li&gt;
                         <li id='NM'&gt;NM - 870 884</li&gt;
                         <li id='OK'&gt;OK - 730 749</li&gt;
                         <li id='TX'&gt;TX - 750 799</li&gt;
                         <li id='TX'&gt;TX - 885 885</li&gt;
                     </ul&gt;
                     </li&gt;
                     <li&gt;West
                     <ul&gt;
                         <li id='AZ'&gt;AZ - 850 869</li&gt;
                         <li id='CA'&gt;CA - 900 935</li&gt;
                         <li id='CA'&gt;CA - 936 955</li&gt;
                         <li id='CA'&gt;CA - 956 962</li&gt;
                         <li id='NV'&gt;NV - 890 898</li&gt;
                     </ul&gt;
                     </li&gt;                
                 </ul&gt;  
              </li&gt;
             <li id='mexico'&gt;Mexico </li&gt;
        </ul&gt;
     </div&gt;
     <script language='javascript'&gt;
       var mytree = dhtmlXTreeFromHTML('treeboxbox_tree');
       mytree.attachEvent('onCheck',onNodeSelect);
       function onNodeSelect(nodeId){
           document.servform.stateserv.value=mytree.getAllChecked();
           alert(document.servform.stateserv.value);
       }
     </script&gt;
     <input type='Submit' value='Submit' name='test'/&gt;
      </form&gt;
</body&gt;
</html&gt;


I am still having the problem and from what I see, the code is correct.
Answer posted by Support on Apr 28, 2008 05:58
The tree has two ways to be initialized from HTML
a) by using special class name ( will init automatically on page loading )
b) by using dhtmlXTreeFromHTML command
In your case both methods used which cause problem, to resolve it just remove class name from the div tag and all will work correctly.

     <div
         id='treeboxbox_tree'
         setImagePath='./codebase/imgs/'
         enableCheckBoxes='true'
         enableThreeStateCheckboxes='true'
         enableDragAndDrop='false'
         style='width:350px; height:260px;'>