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, May 21 '12 at 07: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, May 21 '12 at 07: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, May 21 '12 at 07: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 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. — Avi C, May 21 '12 at 08:33

score 0 · Accepted Answer · edited May 23 '17 at 12:11

0

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

Found it here.

edited May 23 '17 at 12:11

Community

1
1

answered May 22 '12 at 04:27

dezso

2,894
23
29

I was just having a look at that resource - will try it – Avi C May 22 '12 at 08:07
@AviC please report if you can make any use of it. – dezso May 22 '12 at 08:11
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 May 22 '12 at 09:03
I was able to update read the file, but I'm stuck at trying to convert it into XML. – Avi C May 26 '12 at 01:31

Dynamically populating webpage with uploaded file using PHP/JS

1 Answers1

Linked