Dynamically populating webpage with uploaded file using PHP/JS

Question

I have been tasked with modifying a page so that it accepts an uploaded file and parses the contents of that file to display it in a particular format.

I have code that parses the file - but currently it reads a static file on the server and reads it as a string. Instead I want the contents of the file to populate the string after upload.

What's the best way to accomplish this using PHP/JS. I would prefer not to use PHP at all if possible, but it's fine if I have to.

Other options are also welcome.

Thanks

Edit:

Thanks - I will post the code shortly as I'm yet making some changes to it.

This might be a stupid question, but I'm not familiar with AJAX.

Does the file have to be uploaded to any location, or can it be temporarily housed in a variable.

The file I need to use is

http://distributome.avinashc.com/howardL/scripts/distributome.js

In particular the lines xmlDoc = xmlhttp.responseXML;

I am opening the file "Distributome.xml" using the operation

xmlhttp.open("GET","Distributome.xml",false);

Instead I want to populate it using an XML file (or two) that the user uploads.

As another part of the task; I need to use two files so that they contain different data; so for now I am just appending the two files - in the lines that I have commented.

Edit:

   {        
   /*
   Split into distributions and relations - but append them
    xmlhttp.open("GET","Distributome.xml",false);
    xmlhttp.send();
    if (!xmlhttp.responseXML.documentElement && xmlhttp.responseStream)
        xmlhttp.responseXML.load(xmlhttp.responseStream);
    xmlDoc = xmlhttp.responseXML;
    xmlhttp.open("GET","Distributome-references.xml",false);
    xmlhttp.send();
    if (!xmlhttp.responseXML.documentElement && xmlhttp.responseStream)
        xmlhttp.responseXML.load(xmlhttp.responseStream);
    xmlDoc = xmlDoc+xmlhttp.responseXML;


    */
    getURLParameters();
    /*** Read in and parse the Distributome.xml DB ***/
    var xmlhttp=createAjaxRequest();
    xmlhttp.open("GET","Distributome.xml",false);
    xmlhttp.send();
    if (!xmlhttp.responseXML.documentElement && xmlhttp.responseStream)
        xmlhttp.responseXML.load(xmlhttp.responseStream);
    xmlDoc = xmlhttp.responseXML;
    try{
        DistributomeXML_Objects=xmlDoc.documentElement.childNodes;
    }catch(error){
        DistributomeXML_Objects=xmlDoc.childNodes;
    }

    traverseXML(false, null, DistributomeXML_Objects, distributome.nodes, distributome.edges, distributome.references, distributomeNodes, referenceNodes);

    xmlhttp=createAjaxRequest();
    xmlhttp.open("GET","Distributome.xml.pref",false);
    xmlhttp.send();
    if (!xmlhttp.responseXML.documentElement && xmlhttp.responseStream)
        xmlhttp.responseXML.load(xmlhttp.responseStream);
    var ontologyOrder = xmlhttp.responseXML;    
    getOntologyOrderArray(ontologyOrder);
   }

Edit:

I am not uploading the file to the server; instead I just want the content to be parsed when the user uploads - locally.

why can't you make an AJAX request to get the contents of the file once it's uploaded? — Parth Thakkar
– Parth Thakkar, Commented May 21, 2012 at 7:24
Especially if you are already reading from the filesystem as a string! You my friend have it made. As long as you can make AJAX requests to get the uploaded file, you are good to go and can just reuse your existing logic. :) — jamesmortensen
– jamesmortensen, Commented May 21, 2012 at 7:27
As an aside, if you post the code you have, we can provide better help. Just use the edit link under your question to add more details. — jamesmortensen
– jamesmortensen, Commented May 21, 2012 at 7:29
Thanks - I will post the code shortly as I'm yet making some changes to it. This might be a stupid question, but I'm not familiar with AJAX. Does the file have to be uploaded to any location, or can it be temporarily housed in a variable. The file I need to use is distributome.avinashc.com/howardL/scripts/distributome.js In particular the lines xmlDoc = xmlhttp.responseXML; I am opening the file "Distributome.xml" using the operation xmlhttp.open("GET","Distributome.xml",false); Instead I want to populate it using an XML file (or two) that the user uploads. — Avi C
– Avi C, Commented May 21, 2012 at 8:33

Community · Accepted Answer · 2017-05-23 12:11:28Z

0

You can possibly start from here: http://www.html5rocks.com/en/tutorials/file/dndfiles/

Found it here.

edited May 23, 2017 at 12:11

CommunityBot

11 silver badge

answered May 22, 2012 at 4:27

András Váczi

3,02025 silver badges30 bronze badges

Sign up to request clarification or add additional context in comments.

4 Comments

Avi C Over a year ago

I was just having a look at that resource - will try it

András Váczi Over a year ago

@AviC please report if you can make any use of it.

Avi C Over a year ago

So far my efforts haven't met with any measure of success - but I will be working on this tomorrow and will update on my progress.

Avi C Over a year ago

I was able to update read the file, but I'm stuck at trying to convert it into XML.

Collectives™ on Stack Overflow

Dynamically populating webpage with uploaded file using PHP/JS

1 Answer 1

4 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

4 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related