How to read uploaded xml file using javascript? -


i want read uploading xml file , show in textarea client-side. facing problem in javascript code using string variable instead of url. not correct way use url? if not how can use it? of query have found using fixed file url file can changed. here code:

function filltextarea() {      var text = document.getelementbyid("connectionname").value;      document.getelementbyid("recentdevices").value += text + '\n';      var filename = $('input[type=file]').val().split('\\').pop();      var xml = new xmlhttprequest();      xml.open('get', filename, false);      xml.send();      var xmldata = xml.responsexml;      document.getelementbyid("xmlfileinfo").value += xmldata;  }
<div class="row">      <div class="col-md-6">          <div class="input-group">              <div class="input-group">                  <span class="input-group-addon" id="basic-addon1">connect to:</span>                  <input type="text" class="form-control" id="connectionname" name="connectionname" placeholder="name" aria-describedby="basic-addon1">              </div>              <table>                  &nbsp; &nbsp;                  <tr>                      <td>upload xml file</td>                      <td><input type="file" name="xmlfile" id="xmlfile" accept=".xml" /></td>                  </tr>                  <tr>                      <td>&nbsp;</td>                      <td><input type="submit" value="upload" class="btn btn-primary" onclick="filltextarea()" /></td>                  </tr>              </table>          </div>      </div>      <div class="col-md-6">          <div class="panel panel-info">              <div class="panel-heading">                  <h3 class="panel-title">recent machines</h3>              </div>              @html.textarea("xml file information", new { id = "xmlfileinfo", style = "max-width:100%; min-height:250px", @class = "form-control" })          </div>          <div class="panel panel-info">              <div class="panel-heading">                  <h3 class="panel-title">recent devices</h3>              </div>              @html.textarea("recent devices", new { id = "recentdevices", style = "max-width:100%; min-height:250px", @class = "form-control" })          </div>      </div>  </div>

i think code has problem in line below,

xml.open('get', filename, false); 

i have modified javascript code , got way show successfully. thank @rory mccrossan. here modified javascript code portion,

    window.onload = function () {     var fileinput = document.getelementbyid('xmlfile');     var filedisplayarea = document.getelementbyid('xmlfileinfo');      fileinput.addeventlistener('change', function (e) {         var file = fileinput.files[0];         var texttype = /text.*/;          if (file.type.match(texttype)) {             var reader = new filereader();              reader.onload = function (e) {                 xmlfileinfo.innertext = reader.result;             }              reader.readastext(file);         } else {             xmlfileinfo.innertext = "file not supported!"         }     }); 

Comments

Popular posts from this blog

php - How to add and update images or image url in Volusion using Volusion API -

javascript - jQuery UI Splitter/Resizable for unlimited amount of columns -

javascript - IE9 error '$'is not defined -