This article explains how to import and read XML documents using VBScript and HTML 5.
Figure 1: XML reader home page
Step 1
- Open Notepad.
- Add the following XML code.
- <SERVER>
- <INTERFACE>
- <PORT>1</PORT>
- <IPADDRESS>10.100.4.9</IPADDRESS>
- <NETMASK>255.255.224.0</NETMASK>
- </INTERFACE>
- <INTERFACE>
- <PORT>2</PORT>
- <IPADDRESS>10.100.4.10</IPADDRESS>
- <NETMASK>255.255.224.0</NETMASK>
- </INTERFACE>
- </SERVER>
- Save the file with the extension “.xml”.
Step 2
- Open Notepad.
- Add the following HTML code:
- <! DOCTYPE html>
- <html>
- <head>
- <title>Page Title</title>
- <style>
- h1
- {
- color: #05E395;
- }
- fieldset {
- font-family: sans-serif;
- border: 5px solid #05E395;
- background: #ddd;
- border-radius: 5px;
- padding: 15px;
- }
- fieldset legend {
- background: #0BDB9D;
-
- color: #fff;
- padding: 5px 10px ;
- font-size: 32px;
- border-radius: 5px;
- box-shadow: 0 0 0 5px #ddd;
- margin-left: 20px;
- }
- </style>
- <script language="vbscript" type="text/vbscript">
- Sub Handlechange()
- MsgBox "File Imported Sucessfully”, vbInformation
- End Sub
- Sub ExportXML
- Dim ObjXML
- Dim fileinput
- Dim Root
- Dim NodeList
- Dim Msg
- Dim port
- Dim ip
- Dim nextmask
- Set ObjXML = CreateObject ("Microsoft.XMLDOM")
- ObjXML.async = False
- fileinput = Document.getElementById ("browse").Value
- ObjXML.load(fileinput)
- Set Root = ObjXML.documentElement
- Set NodeList = Root.getElementsByTagName("INTERFACE")
- For Each Elem In NodeList
- Set port = Elem.getElementsByTagName ("PORT") (0)
- Set ip = Elem.getElementsByTagName ("IPADDRESS") (0)
- Set netmask= Elem.getElementsByTagName ("NETMASK") (0)
- Msg ="[PORT :]" & port.Text & vbNewLine
- Msg = Msg & "[IP ADDRESS :]" & ip.Text & vbNewLine
- Msg = Msg & "[NETMASK :]" & netmask.Text
- MsgBox Msg
- Next
- MsgBox "Data Read Sucessfully”, vbInformation
- End Sub
- </script>
- </head>
- <body>
- <form>
- <section style="margin: 10px ;">
- <fieldset style="min-height:100px;">
- <legend><b>CsharpCorner </b> </legend>
- <center>
- <h1>XML Reader</h1>
-
- <img src="C:\Users\Karthikeyan.K\Desktop\File_type_Extension_22-256.png" alt="View" style="width:218px;height:256px;">
- <br>
- <br>
- <input type="file" id="browse" name="fileupload" onChange="Handlechange()"/>
- <br>
- <br>
- <input type="button" value="Export" id="Export" onclick="ExportXML()"/>
- </center>
- <label> <br/> </label>
- <label> <br/> </label>
- </fieldset>
- </form>
- </body>
- </html>
- Save the file with extension the “.html”.
Output
- Open the HTML document.
- Click the browse button.
Figure 2: Browse the XML document
- Choose the XML document.
Figure 3: Select the XML document
Figure 4: File Imported Successfully
- Press the Export button.
Figure 5: XML document Export
Figure 6: XML data Output 1
Figure 7: XML data Output 2
Figure 8: Data Read Successfully
Conclusion
Thanks for reading. I hope you liked this article. Please provide your valuable suggestions.