Jump to content

Need help using PHP to generate HTML


MutantJohn

Recommended Posts

Hey everyone,

 

So, I'm trying to use PHP to create a file explorer.

 

The gist is, given a target home directory for a user, I want to generate a list of the contents. I want directories to be "click-able" in the sense that if you click on a directory entry, it'll expand/collapse its contents.

 

It should look like this :

 

- file0

- file1

- file2

- dir0 (clickable)

  - subfile0

  -subfile1

  -subfile2

 

My idea to do this was to use an unordered list with checkboxes for each directory entry. I would then use JS to add event listeners to each checkbox which makes a XMLHttpRequest to an appropriate PHP file which then echoes back the appropriate HTML and the JS then receives that info and appends it to the page.

 

This way, the user can explore their entire filesystem and the server doesn't kill itself trying to recursively search the entire directory (imagine if a user had like 50,000 files or something) to generate the list.

 

Actually, is PHP fast enough that I don't even have to worry about this? By this I mean, building the entire file list first, formatting it as HTML and then echo'ing it back? If it is, awesome!

 

If not, I'm curious why my input tags keep lacking text content!

 

Here's the code :

 

 

<!DOCTYPE html>
 
<html>
 
    <body>
 
        <?php
 
            // grab the user's home directory
            $home = "dita-ot/dita-ot-2.1.0/samples/";
 
            // loop contents and write to page
            if ( is_dir( $home ) )
            {
                if ( $dh = opendir( $home ) )
                {
                    $dom = new DOMDocument( "1.0" );
                    $form = $dom->createElement( "form" );
                    $ul = $dom->createElement( "ul" );
 
                    /* http://php.net/manual/en/function.readdir.php */
                    /* This is the correct way to loop over the directory. */
                    while ( false !== ( $entry = readdir( $dh ) ) ) 
                    {
                        if ( $entry == "." || $entry == ".." )
                            continue;
 
                        $li = $dom->createElement( "li" );
    
                        if ( is_dir( $home . $entry ) )
                        {
                            $input = $dom->createElement( "input", $entry );
 
                            $input_type = $dom->createAttribute( "type" );
                            $input_type->value = "checkbox";
                            $input->appendChild( $input_type );
 
                            // this is where the problem is
                            // why is there no inner text content?
                            $li->appendChild( $input );
                        }
                        else
                        {
                            $li->nodeValue = $entry;
 
                        }
 
                        $ul->appendChild( $li );
                    }
 
                    $form->appendChild( $ul );
                    $dom->appendChild( $form );
                    echo $dom->saveHTML();
 
                    closedir( $dh );
                }
            }
        ?>
 
    </body>
 
</html>
Link to comment
Share on other sites

Is there some reason behind using dom to build your page instead of just echo'ing the html you need to display this? And why does it have to be ajax?

 

As for the clickable things - output your list elements as simple text values but when one of them is a directory name output it as an anchor tag inside of a list element.

Link to comment
Share on other sites

Is there some reason behind using dom to build your page instead of just echo'ing the html you need to display this? And why does it have to be ajax?

 

As for the clickable things - output your list elements as simple text values but when one of them is a directory name output it as an anchor tag inside of a list element.

I figured DOM was the most "proper" way of building HTML. It seems very similar in syntax to JavaScript and things like jsoup.

 

And AJAX is more conditional. My fear is that a user will select a directory with an amazingly complex structure underneath. Imagine something in the tens of GB worth of files and directories. I'm scared that if I use PHP to recreate the entire structure and convert it to HTML, the process will be slow.

 

So I figured AJAX would be an awesome way of allowing a user to navigate this huge file structure while being performant, i.e. the server only generates the structure HTML upon user request. This way I could avoid the potentially huge costs of generating the entire file structure HTML.

 

I like your idea about the anchor tags though.

Link to comment
Share on other sites

Well the anchor tags are the natural way to do it. How else are you going to generate a click?

 

As for your concern about resource usage - a simple glob will tell you what the contents of a dir are and how many entries there are so what is the concern? As for the 'complex structure' you are only going to load one dir for a click - any dirs below that one will still show up as anchor tags with no details beneath them - yet.

Link to comment
Share on other sites

 

So, is there ever a good usage for the DOM stuff? Eh, I guess it'd be good to use if I'm attempting to traverse the DOM or an XML doc.

That's the best time to use it.

 

I use DOM a lot in api's, crawling, scraping or data parsing. A lot of times I combine DOM and SimpleXML.

  • Like 1
Link to comment
Share on other sites

This thread is more than a year old. Please don't revive it unless you have something important to add.

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.