SitePoint Sponsor

User Tag List

Results 1 to 14 of 14
  1. #1
    Always A Novice bronze trophy
    K. Wolfe's Avatar
    Join Date
    Nov 2003
    Location
    Columbus, OH
    Posts
    2,182
    Mentioned
    67 Post(s)
    Tagged
    2 Thread(s)

    Recursive HTML Tables

    So I was hoping to find a pre-built function out there preferably PHP/HTML/JS to recursively display a table in html, but I haven't thus far. I want a really dynamic way of displaying a table from Mongo DB, which as you may know can contain multidimensional data. Java script would come in to collapse / expand any data that is an array.

    Anyone know of anything such as this pre-built?

  2. #2
    Keeper of the SFL StarLion's Avatar
    Join Date
    Feb 2006
    Location
    Atlanta, GA, USA
    Posts
    3,748
    Mentioned
    73 Post(s)
    Tagged
    0 Thread(s)
    how would the data be coming in to the file? I'm not familiar with Mongo's connectors and return structure...
    Never grow up. The instant you do, you lose all ability to imagine great things, for fear of reality crashing in.

  3. #3
    Always A Novice bronze trophy
    K. Wolfe's Avatar
    Join Date
    Nov 2003
    Location
    Columbus, OH
    Posts
    2,182
    Mentioned
    67 Post(s)
    Tagged
    2 Thread(s)
    It returns an object, which can be converted to a multidimensional array. If you are unfamiliar with how "records" or documents are stored, here might be a good example:

    Code:
    {
    _id: "disudfh93h394530dj", // uncreative recreation of a unique id created by mongo
    f_name: "kyle",
    l_name: "wolfe",
    forums_liked: ["PHP", "Databases & MySQL", "General Web Development & Application Design Issues"]
    }
    Essentially the "column" forums_liked is an array. Ideally on the fly a script would show each row in a normal table format, but then would allow for arrays to be expanded and viewed. There can be many arrays inside of other arrays, which makes Mongo great IMO. I'm currently looking at using it for a business wide error reporting service. A simple API can be written to require just a few mandatory fields, and then allow a "dump" of an array that each developer would deem necessary info to the error.

  4. #4
    Keeper of the SFL StarLion's Avatar
    Join Date
    Feb 2006
    Location
    Atlanta, GA, USA
    Posts
    3,748
    Mentioned
    73 Post(s)
    Tagged
    0 Thread(s)
    So it comes in as a JSON which can be flipped into a regular array with json_decode, and then parsed as any normal array would?
    Never grow up. The instant you do, you lose all ability to imagine great things, for fear of reality crashing in.

  5. #5
    Always A Novice bronze trophy
    K. Wolfe's Avatar
    Join Date
    Nov 2003
    Location
    Columbus, OH
    Posts
    2,182
    Mentioned
    67 Post(s)
    Tagged
    2 Thread(s)
    Quote Originally Posted by StarLion View Post
    So it comes in as a JSON which can be flipped into a regular array with json_decode, and then parsed as any normal array would?
    JSON is the format of the db, but not the PHP return. It returns an object, which can be converted to a normal array.

  6. #6
    Hosting Team Leader silver trophybronze trophy
    cpradio's Avatar
    Join Date
    Jun 2002
    Location
    Ohio
    Posts
    5,244
    Mentioned
    155 Post(s)
    Tagged
    0 Thread(s)
    Can you provide a var_dump() of that object once PHP has it?

  7. #7
    Always A Novice bronze trophy
    K. Wolfe's Avatar
    Join Date
    Nov 2003
    Location
    Columbus, OH
    Posts
    2,182
    Mentioned
    67 Post(s)
    Tagged
    2 Thread(s)
    Given the example above, and after conversion to an array, it'll look as such:

    Code PHP:
    $result = array(
        "result" => array(
            "_id" => "disudfh93h394530dj",
            "f_name" => "kyle",
            "l_name" => "wolfe",
            "forums_liked" => array(
                "PHP", 
                "Databases & MySQL", 
                "General Web Development & Application Design Issues"
            )
        )
    );

    I know what's involved in writing a recursive function to handle things such as this, but I was hoping that someone already had a solution for this.

  8. #8
    Keeper of the SFL StarLion's Avatar
    Join Date
    Feb 2006
    Location
    Atlanta, GA, USA
    Posts
    3,748
    Mentioned
    73 Post(s)
    Tagged
    0 Thread(s)
    So... do a normal recursive Array walk on the array?
    PHP Code:
    function tableize($in) {
     echo 
    "<table>";
     foreach(
    $in AS $key => $value) {
      if(
    is_array($value)) {
       echo 
    "<tr><td>$key:".tableize($value)."</td></tr>";
      } else {
       echo 
    "<tr><td>$key$value</td></tr>";
      }
     }
     echo 
    "</table>";
    }

    tableize($result); 
    Never grow up. The instant you do, you lose all ability to imagine great things, for fear of reality crashing in.

  9. #9
    SitePoint Guru bronze trophy
    Join Date
    Dec 2003
    Location
    Poland
    Posts
    930
    Mentioned
    7 Post(s)
    Tagged
    0 Thread(s)
    In my opinion writing your own recursive function to handle the task is nothing complicated and I think it would take you less time than trying to find a ready-made solution and potentially having to adapt it to your needs. This would be using foreach on the array and if there's a another array in the array then you echo a new table and run the same function feeding it the array (that is - considering you want to nest tables inside tables). Then spicing it up with some javascript to toggle display:none on and off on the nested tables shouldn't be complicated either.

  10. #10
    Always A Novice bronze trophy
    K. Wolfe's Avatar
    Join Date
    Nov 2003
    Location
    Columbus, OH
    Posts
    2,182
    Mentioned
    67 Post(s)
    Tagged
    2 Thread(s)
    The recursion its self isn't that hard. However displaying it in a friendly manner will take some time, for me at least. This seems like a generic task that someone would have come across and might have put out a public solution.

  11. #11
    SitePoint Guru bronze trophy
    Join Date
    Dec 2003
    Location
    Poland
    Posts
    930
    Mentioned
    7 Post(s)
    Tagged
    0 Thread(s)
    Hm, in this case it seems this is more a css/javascript problem than php. It is similar to displaying muli-level menus except this involves tables. I think first you would need to decide how you want this to look and work for the end user (if you haven't done so yet) and then try to find a solution. However, I've never come across anything like this ready-made.

  12. #12
    Foozle Reducer ServerStorm's Avatar
    Join Date
    Feb 2005
    Location
    Burlington, Canada
    Posts
    2,699
    Mentioned
    89 Post(s)
    Tagged
    6 Thread(s)
    Being a good programmer you already know how to walk the object, but using something like @StarLion ; 's code

    PHP Code:
    function tableize($in) {
     echo 
    "<table>";
     foreach(
    $in AS $key => $value) {
      if(
    is_array($value)) {
       echo 
    "<tr><td>$key:".tableize($value)."</td></tr>";
      } else {
       echo 
    "<tr><td>$key$value</td></tr>";
      }
     }
     echo 
    "</table>";
    }

    tableize($result); 
    And then creating and linking a CSS style sheet like
    HTML Code:
    table {
         width: 80%;
         padding: 0;
         margin: 10px;
         font-family: Arial, "Helvetica Neue", Helvetica, sans-serif;
        /* remove this to stop the centering of the table */
         margin: 5px auto 30px auto;
        /* ensure that the backround of the table is white */
         background-color: #fff;
        /* the shadow wrapping around the table. Remove all lines 
           below if you don't like this effect */
         -webkit-box-shadow: 3px 3px 10px 8px rgba(0,0,0,0.4);
         -moz-box-shadow: 3px 3px 10px 8px rgba(0,0,0,0.4);
         box-shadow: 3px 3px 10px 8px rgba(0,0,0,0.4);
         -webkit-border-radius: 3px;
         -moz-border-radius: 3px;
         border-radius: 3px;    
    }
    
    
    th {
        border: 1px solid #525C67;
        background-color: #7B92AD;
        color: #fff;
        letter-spacing:2px
        padding: 5px;
       /* the rounded corners wrapping around each cell. Remove next 
          three lines to have angled corners */
        -moz-border-radius: 3px;
        -webkit-border-radius: 3px;
        border-radius: 3px;
        
       /* the shadow wrapping around each cell. Remove all lines 
           below if you don't like this effect */
        -moz-box-shadow: inset -3px -3px 3px #888;
        -webkit-box-shadow: inset  -3px -3px 3px #888;
        box-shadow: inset  -3px -3px 3px #888;
    }
    
    
    td {
         border: 1px solid #525C67;
         color: #274E7D;
         padding: 5px;
       /* the rounded corners wrapping around each cell. Remove next 
          three lines to have angled corners */
        -moz-border-radius: 3px;
        -webkit-border-radius: 3px;
        border-radius: 3px;
       /* the shadow wrapping around each cell. Remove all lines 
           below if you don't like this effect */
        -moz-box-shadow: inset  -3px -3px 3px #888;
        -webkit-box-shadow: inset  -3px -3px 3px #888;
        box-shadow: inset  -3px -3px 3px #888;
    }
    And here is a test table so you can decide if you like it:
    HTML Code:
    <table>
     <tr>
      <th>One</th>
      <th>Two</th>
      <th>Three</th>
     </tr>
     <tr>
      <td>This is the first</td>
      <td>This is the second</td>
      <td>This is the thrird</td>
     </tr>
    </table>
    The color scheme is this: http://colorschemedesigner.com/#3C51Tw0w0w0w0

    You can play around with different schemes although blue is generally the most respected for business crowd.

    I don't know if this helps but it was worth a try

    Steve
    ictus==""

  13. #13
    SitePoint Wizard silver trophybronze trophy Cups's Avatar
    Join Date
    Oct 2006
    Location
    France, deep rural.
    Posts
    6,869
    Mentioned
    17 Post(s)
    Tagged
    1 Thread(s)
    I wonder if the OP is looking for something like table_class, its 10 year old code now, but I remember contacting the author and rewriting it for (early) PHP5 and using it on some dashboards.

  14. #14
    Always A Novice bronze trophy
    K. Wolfe's Avatar
    Join Date
    Nov 2003
    Location
    Columbus, OH
    Posts
    2,182
    Mentioned
    67 Post(s)
    Tagged
    2 Thread(s)
    For anyone stumbling across this thread in the future, I'm going to be implementing this: http://trirand.com/blog/jqgrid/jqgrid.html#


Bookmarks

Posting Permissions

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