Page 1 of 2 12 Last
  • Jump to page:
    #1
  1. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Nov 2012
    Posts
    14
    Rep Power
    0

    Help with an org chart program


    Ok so this is what I have so far. Its been a real pain in the butt however I wanted to challenge myself. I am not getting the results I thought i would. Just wanted to see if anyone has any recommendations to help me along here. I have included a pic of the output i am getting.



    There should be 2 employees outputting under "Kristin" as well and i think its a sorting issue but im not sure how to fix it.


    PHP Code:
    <!--this selects the table and stores it as the variable content_set -->
                   <?php                   
                        $lev1_set 
    mysql_query("SELECT id, name, title, supername 
                                                FROM level1
                                                ORDER BY name DESC"
    $connection);                    
                        
    $lev2_set mysql_query("SELECT id, name, title, supername 
                                                FROM level2
                                                ORDER BY name DESC"
    $connection);
                        
    $lev3_set mysql_query("SELECT id, name, title, supername 
                                                FROM level3
                                                ORDER BY name DESC"
    $connection);
                        
    $lev4_set mysql_query("SELECT id, name, title, supername 
                                                FROM level4
                                                ORDER BY name DESC"
    $connection);
                    
    ?>
                    
                    <?php
                    
                        $l1_rownum 
    mysql_num_rows($lev1_set);
                        
    $l2_rownum mysql_num_rows($lev2_set);
                        
    $l3_rownum mysql_num_rows($lev3_set);
                        
    $l4_rownum mysql_num_rows($lev4_set);
                        
                        
    $l1_count 0;
                        
    $l2_count 0;
                        
    $l3_count 0;
                        
    $l4_count 0;
                        
                    
    ?>

                    <!--content output starts here-->
                    
                    <?php    
                            
    while (($lev1 mysql_fetch_assoc($lev1_set)) && ($lev1['supername'] == "none")){
                                echo   
    "<div id='outer_bubble'>
                                        <div id='bubble'> " 

                                        
    $lev1['name'] .
                                         
    "<br />
                                        
    {$lev1['title']} <br />
                                        </div>"
    ;
                                        
    $l2ver 0;
                                        
    $parent1 $lev1['name'];
                                        
    $lev2_set mysql_query("SELECT id, name, title, supername 
                                                FROM level2
                                                ORDER BY name DESC"
    $connection);

                                        while ((
    $lev2 mysql_fetch_assoc($lev2_set)) && ($lev2['supername'] == $parent1)) {
                                            if (
    $l2ver == 0) {
                                                echo 
    "<br />";
                                            }    else {
                                                echo 
    "</div>";
                                            }
                                            echo   
    "<div id='outer_bubble'>
                                                    <div id='bubble'> " 

                                                    
    $lev2['name'] .
                                                    
    "<br />
                                                    
    {$lev2['title']} <br />
                                                    </div>"
    ;
                                                    
    $l3ver 0;
                                                    
    $parent2 $lev2['name'];
                                                    
    $l2ver++;
                                                    
    $lev3_set mysql_query("SELECT id, name, title, supername 
                                                                            FROM level3
                                                                            ORDER BY name ASC"
    $connection);
                                                                            
                                                    while ((
    $lev3 mysql_fetch_assoc($lev3_set)) && ($lev3['supername'] == $parent2)) {
                                                        if (
    $l3ver == 0) {
                                                            echo 
    "<br />";
                                                        }    
                                                        echo   
    "<div id='outer_bubble'>
                                                                <div id='bubble'> " 

                                                                
    $lev3['name'] .
                                                                
    "<br />
                                                                
    {$lev3['title']} <br />
                                                                </div>"
    ;
                                                                
    $l4ver 0;
                                                                
    $parent3 $lev3['name'];
                                                                
    $l3ver++;
                                                                echo 
    "</div>";
  2. #2
  3. --
    Devshed Expert (3500 - 3999 posts)

    Join Date
    Jul 2012
    Posts
    3,957
    Rep Power
    1046
    Hi,

    simply echo $lev3_set in the inner while loop, execute it and see what it says. Obviously there are no entries with name = "Kristin Logan".

    Apart from that, there are several issues in your code:

    You require all children of a specific node to follow each other, because every while loop will end as soon as there's a node that has a different supernode. This makes no sense and will most certainly fail sooner or later. In fact, the condition should be in the query where it belongs.

    Your database design also is problematic. You obviously have a lot of similar and redundant data (like the four tables that all do the same). You should make one table for the persons. The level should be stored in a column or simply calculated (it's the distance to the root node).

    And you shouldn't repeat the same code for every level. This just produces unnessary code and limits the diagram to a certain depth. Instead, use a general approach to traverse the tree. If the tree won't be too big, you could use a recursive function:

    PHP Code:
    function displayChildren($node_id) {
        
    // query to get the children for $node_id
        // loop through children, display them and call displayChildren() for each one

  4. #3
  5. No Profile Picture
    Contributing User
    Devshed Novice (500 - 999 posts)

    Join Date
    Jun 2009
    Posts
    676
    Rep Power
    7
    I guess to ask this as simply as I can, is there reasoning as to why each level of your tree is to NOT run the same as one another, other than their output info?
  6. #4
  7. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Nov 2012
    Posts
    14
    Rep Power
    0
    Triple_Nothing -
    There is, the final product of this will have a set number of output layers. The person im doing this for wants color specific layers and i didnt see a good way to do that without the nested while statements as they are. Suggestions are appreciated if you see something i do not.

    Additionally i took Jacques1's comments and revised my source code, here is the updated information.

    A fourth layer has been added and I am just working on having my </div> tags close off properly.

    PHP Code:
    <?php    
                    $l1ver 
    0;
                    
    $l2ver 0;
                    
    $l3ver 0;
                    
    $l4ver 0;
                    
                            
    //prepare initial loop data
                            
    $lev1_set mysql_query("SELECT id, name, title, supername 
                                                FROM orgchart
                                                WHERE supername = 'none'
                                                ORDER BY name ASC"
    $connection);    
                            
    //fist output layer                    
                            
    while ($lev1 mysql_fetch_assoc($lev1_set)){
                                
                                
    $lev1name $lev1['name'];
                                
    $lev1title $lev1['title'];
                                
                                
    output_bubble($lev1name$lev1title);
                                        
                                        
    $l2ver 0;
                                        
    $parent1 $lev1['name'];
                                        
                                        
    //prepare next loop data
                                        
    $lev2_set mysql_query("SELECT id, name, title, supername 
                                                FROM orgchart
                                                WHERE supername = '
    $lev1name'
                                                ORDER BY name ASC"
    $connection);
                                                
                                        
    //second output layer
                                        
    while ($lev2 mysql_fetch_assoc($lev2_set)) {
                                            if (
    $l3ver 0) {
                                                echo 
    "</div>";
                                            }
                                            
                                            if (
    $l2ver == 0) {
                                                echo 
    "<br />";
                                            }    
                                            
                                            
    $lev2name $lev2['name'];
                                            
    $lev2title $lev2['title'];
                                            
                                            
    output_bubble($lev2name$lev2title);
                                                    
    $l3ver 0;
                                                    
    $l2ver++;
                                                    
                                                    
                                                    
    //prepare next loop data
                                                    
    $lev3_set mysql_query("SELECT id, name, title, supername 
                                                                            FROM orgchart
                                                                            WHERE supername = '
    $lev2name'
                                                                            ORDER BY name ASC"
    $connection);
                                                            
                                                        
    //third output layer                
                                                        
    while ($lev3 mysql_fetch_assoc($lev3_set)) {
                                                        if (
    $l4ver 0) {
                                                            echo 
    "</div>";
                                                        }    
                                                        
                                                            
                                                        if (
    $l3ver == 0) {
                                                            echo 
    "<br />";
                                                        }    
                                                        
                                                        
    $lev3name $lev3['name'];
                                                        
    $lev3title $lev3['title'];
                                                        
                                                        
    output_bubble($lev3name$lev3title);

                                                                
    $l4ver 0;
                                                                
    $l3ver++;
                                                                
                                                    
    //prepare next loop data
                                                    
    $lev4_set mysql_query("SELECT id, name, title, supername 
                                                                            FROM orgchart
                                                                            WHERE supername = '
    $lev3name'
                                                                            ORDER BY name ASC"
    $connection);

                                                                while (
    $lev4 mysql_fetch_assoc($lev4_set)) {
                                                                    if (
    $l4ver == 0) {
                                                                        echo 
    "<br />";
                                                                    }
                                                                    
                                                                    
    $lev4name $lev4['name'];
                                                                    
    $lev4title $lev4['title'];
                                                                    
                                                                    
    output_bubble($lev4name$lev4title);
                                                                    
                                                                            
                                                                            
    $l4ver++;
                                                                            echo 
    "</div>";
                                                                }
                                            }
                                        }
                            }
  8. #5
  9. No Profile Picture
    Contributing User
    Devshed Novice (500 - 999 posts)

    Join Date
    Jun 2009
    Posts
    676
    Rep Power
    7
    Nicely done. Your levels look rather identical now n a bit more clean. If u wanted to remove 2 more lines per loop, you don't really need to assign $lev1name and $lev1title since you only use them like twice. Just a thought.
  10. #6
  11. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Nov 2012
    Posts
    14
    Rep Power
    0
    Thank you, that is a good suggestion as well.
    Do you think I could change these "while" loops over to "for" loops cleanly and use the third argument to close my </div> tags up since they arent closing properly here? Just thinking out loud.
  12. #7
  13. No Profile Picture
    Contributing User
    Devshed Novice (500 - 999 posts)

    Join Date
    Jun 2009
    Posts
    676
    Rep Power
    7
    You could always switch one for another, but cleanly/simply may be the question. Could you maybe post the source of the output you are receiving from this?
  14. #8
  15. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Nov 2012
    Posts
    14
    Rep Power
    0
    Certainly, here is the source and the visual output.






    Code:
    
    <html>
        <head>
        <title>Org-Chart</title>
        <meta http-equiv="X-UA-Compatible" content="IE=edge" />
        <meta http-equiv="X-UA-Compatible" content="IE=9" />
        <link href="http://www.trutechunlimited.com/orgchart/_css/main.css" rel="stylesheet" type="text/css" />
        </head>
            <body>
            	
                
                    <!--content output starts here-->
                    
                    <div id='outer_bubble'>
                <div id='bubble'> 
                Jack Logan
                <br />
                Manager 
                <br />
                </div><br /><div id='outer_bubble'>
                <div id='bubble'> 
                Kirk Logan
                <br />
                Assistant manager 
                <br />
                </div><br /><div id='outer_bubble'>
                <div id='bubble'> 
                kirkemp1
                <br />
                employee 
                <br />
                </div><br /><div id='outer_bubble'>
                <div id='bubble'> 
                recruit
                <br />
                recruit 
                <br />
                </div></div><div id='outer_bubble'>
                <div id='bubble'> 
                recruit
                <br />
                recruit 
                <br />
                </div></div></div><div id='outer_bubble'>
                <div id='bubble'> 
                kirkemp2
                <br />
                employee 
                <br />
                </div><br /><div id='outer_bubble'>
                <div id='bubble'> 
                recruit
                <br />
                recruit 
                <br />
                </div></div><div id='outer_bubble'>
                <div id='bubble'> 
                recruit
                <br />
                recruit 
                <br />
                </div></div></div><div id='outer_bubble'>
                <div id='bubble'> 
                Kristin Logan
                <br />
                Assistant manager 
                <br />
                </div></div><br /><div id='outer_bubble'>
                <div id='bubble'> 
                krisemp1
                <br />
                employee 
                <br />
                </div><br /><div id='outer_bubble'>
                <div id='bubble'> 
                recruit
                <br />
                recruit 
                <br />
                </div></div><div id='outer_bubble'>
                <div id='bubble'> 
                recruit
                <br />
                recruit 
                <br />
                </div></div></div><div id='outer_bubble'>
                <div id='bubble'> 
                krisemp2
                <br />
                employee 
                <br />
                </div><br /><div id='outer_bubble'>
                <div id='bubble'> 
                recruit
                <br />
                recruit 
                <br />
                </div></div><div id='outer_bubble'>
                <div id='bubble'> 
                recruit
                <br />
                recruit 
                <br />
                </div></div>
        	</body>
    </html>
  16. #9
  17. No Profile Picture
    Contributing User
    Devshed Novice (500 - 999 posts)

    Join Date
    Jun 2009
    Posts
    676
    Rep Power
    7
    Wow. Ok. This is what I recommend to make this EXTREMELY easier to figure out. We need to get new lines set in, as well as indentation. This way ayou will see a < div > tage, and simple look straight down to see its closing tag. (Or lack of)



    Edit: And if I can see your ouput_bubble function.
  18. #10
  19. --
    Devshed Expert (3500 - 3999 posts)

    Join Date
    Jul 2012
    Posts
    3,957
    Rep Power
    1046
    Guys, before you get lost in details:

    I don't know how much time and effort you're willing to invest and how important the customer/friend is, but this is far from perfect.

    The first question is: Do you have to use HTML? Because it's pretty much the worst tool for doing diagrams. Yeah, you can fumble with CSS to get acceptable results, but this language just wasn't made for graphics. A clean solution would be to e. g. generate a vector graphic. This isn't very complicated and will work on many current browsers (old IE versions have VML, all others support SVG).

    The next step would be to separate the graphics stuff from the application logic. Put your SVG/HTML into templates so that you don't have "</div>"s and "<br />"s flying around in your code.

    And then think about a general approach to loop through the nodes (like I already said). If each level neads a special design, just pass the level as a parameter.

    You don't have to do all this if you just want a quick and dirty solution. In this case simply stick with what you already have. But if you want to do this properly, you'll need a different approach.
    Last edited by Jacques1; November 15th, 2012 at 10:59 AM.
  20. #11
  21. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Nov 2012
    Posts
    14
    Rep Power
    0
    Triple_nothing:
    I will try and clean that up, here is my function

    PHP Code:
    function output_bubble($name$title) {
        echo   
    "<div id='outer_bubble'>
                <div id='bubble'> 
                
    {$name}
                <br />
                
    {$title} 
                <br />
                </div>"
    ;

    Jacques1:
    I have never worked with vector graphics, a friend asked for help and i wanted to challenge myself so i figured i could do it using CSS and PHP. What you say is probably true and sounds very reasonable though and i will look into doing it as you have said for all future projects. I really appreciate the input.
  22. #12
  23. No Profile Picture
    Contributing User
    Devshed Novice (500 - 999 posts)

    Join Date
    Jun 2009
    Posts
    676
    Rep Power
    7
    If you wanna alter the function as so to start:

    Code:
    function output_bubble($name, $title) { 
        echo   "<div id='outer_bubble'> 
                    <div id='bubble'>  
                        {$name}<br /> 
                        {$title}  
                    </div>"; 
    }

    N I'll have a lil alteration on the other half in a sec...
  24. #13
  25. No Profile Picture
    Contributing User
    Devshed Novice (500 - 999 posts)

    Join Date
    Jun 2009
    Posts
    676
    Rep Power
    7
    Then any if/then statement that you have echoing a closing div tag or line break tag, place a \n right after the >

    And before the closing div tag, also place your single/double tab in which you use for your indentations.

    Then lets see how the output source code will look.
  26. #14
  27. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Nov 2012
    Posts
    14
    Rep Power
    0
    Ok with your recommendations here is the code:


    Edit:
    Code:
    
    
    
    <html>
        <head>
        <title>Org-Chart</title>
        <meta http-equiv="X-UA-Compatible" content="IE=edge" />
        <meta http-equiv="X-UA-Compatible" content="IE=9" />
        <link href="http://www.trutechunlimited.com/orgchart/_css/main.css" rel="stylesheet" type="text/css" />
        </head>
            <body>
            	
                
                    <!--content output starts here-->
                    
                    <div id='outer_bubble'> 
                    <div id='bubble'>  
                        Jack Logan<br /> 
                        Manager  
                    </div><br />
    <div id='outer_bubble'> 
                    <div id='bubble'>  
                        Kirk Logan<br /> 
                        Assistant manager  
                    </div><br /><div id='outer_bubble'> 
                    <div id='bubble'>  
                        kirkemp1<br /> 
                        employee  
                    </div><br />
    <div id='outer_bubble'> 
                    <div id='bubble'>  
                        recruit<br /> 
                        recruit  
                    </div>	</div>
    <div id='outer_bubble'> 
                    <div id='bubble'>  
                        recruit<br /> 
                        recruit  
                    </div>	</div>
    	</div><div id='outer_bubble'> 
                    <div id='bubble'>  
                        kirkemp2<br /> 
                        employee  
                    </div><br />
    <div id='outer_bubble'> 
                    <div id='bubble'>  
                        recruit<br /> 
                        recruit  
                    </div>	</div>
    <div id='outer_bubble'> 
                    <div id='bubble'>  
                        recruit<br /> 
                        recruit  
                    </div>	</div>
    	</div>
    <div id='outer_bubble'> 
                    <div id='bubble'>  
                        Kristin Logan<br /> 
                        Assistant manager  
                    </div>	</div><br /><div id='outer_bubble'> 
                    <div id='bubble'>  
                        krisemp1<br /> 
                        employee  
                    </div><br />
    <div id='outer_bubble'> 
                    <div id='bubble'>  
                        recruit<br /> 
                        recruit  
                    </div>	</div>
    <div id='outer_bubble'> 
                    <div id='bubble'>  
                        recruit<br /> 
                        recruit  
                    </div>	</div>
    	</div><div id='outer_bubble'> 
                    <div id='bubble'>  
                        krisemp2<br /> 
                        employee  
                    </div><br />
    <div id='outer_bubble'> 
                    <div id='bubble'>  
                        recruit<br /> 
                        recruit  
                    </div>	</div>
    <div id='outer_bubble'> 
                    <div id='bubble'>  
                        recruit<br /> 
                        recruit  
                    </div>	</div>
    
        	</body>
    </html>
  28. #15
  29. No Profile Picture
    Contributing User
    Devshed Novice (500 - 999 posts)

    Join Date
    Jun 2009
    Posts
    676
    Rep Power
    7
    Ok. In your function, place a \n after your closing div tag.

    And as far as the other few \n placed, did it alter:
    Code:
                    if ($l4ver > 0) { 
                        echo "</div>"; 
                    }
    to:
    Code:
                    if ($l4ver > 0) { 
                        echo "</div>\n"; 
                    }
    Make sure ur using \ instead of /
Page 1 of 2 12 Last
  • Jump to page:

IMN logo majestic logo threadwatch logo seochat tools logo