JavaScript Uploading an XML file

[Dvdscot]

Hello,

I can create a button and click on it. I want the normal Explorer window to appear and you can choose only XML files, select it and it is uploaded and then used in the program instead as the ones already given in the program.

Angular JS is used, so the button will be an ng_click module. The XML file should also be checked that it is a real XML file.

So far there are three constants.

const form1 =
`<?xml version="1.0" encoding="UTF-8"?>
<XML file starts

form2, form3

In another file these three forms are imported:

import form1 from './forms/form1.js'

const forms = {
form1,
form2,
form3
}

export default forms
export const metaXml ...

In the final program this complete form is imported and put into a scope.case as part of an object.

So the uploaded file should replace the imported form.

I guess there has to be a check if a file has been uploaded and then use a different import procedure.

Thanks a lot.

 

[arandombyte]

To get you started, you can ensure that your file dialog will only accept xml files by doing the following:

<input type="file" accept=".xml">

How do you plan to implement your parsing checks?

 

[Dvdscot]

I looked up "parsing checks" but don't know what you mean by implementing.

I found long code for uploading a file. I just used this and it does give me a grey box and I can select a file.

<input type="file" id="fileInput" accept=".xml">
            <div id="fileContents"></div>

I thought about using a button like that since this is used all the time:

<button ng-click="uploadXML()">Upload XML</button>

And that leads me to

   $scope.uploadXML = () => {
       
    }

If this is not possible I use the simple method. It says: "Choose file - No file chosen", when I select a file it says: "Choose file - file name"
Is it possible to change the writing to "Choose XML".
Once it has been selected something should happen, can this be done automatically or by pressing another button?
Maybe the "Upload XML" Scope can be used for that, rename it to "Use Uploaded XML" and then that file is used instead of the ones already in the code. But this should only work if an XML file has been uploaded otherwise an error message.

 

[Dvdscot]

Something like, if file has been opened successfully then valid = true.
If true then forms = file else forms = forms.

 

[Dvdscot]

https://codepen.io/Dvdscot/pen/azzgbgG

 

[Dvdscot]

How do I check that the file is really a valid XML file? It could be any file just with an .xml extension and it can be uploaded.

I found a lot of XML related code examples here:

JavaScript method: XML.isDocumentElement()

docs.microfocus.com