Amb HTML5 es pot carregar un fitxer de l'ordinador local on està el navegador directament a una pàgina web, sense passar pel servidor web. Antigament per fer això calia pujar el XML al servidor, aquest processar-lo i enviar-te el HTML amb els controls degudament informats. Això s'ha acabat, al menys en Firefox. Cal fer un HTML com el següent:
<p><input type="text" name="test" id="test" /></p>
<input type="file" id="files" name="files" /><div id="list"></div>
Un cop fet això cal fer el següent script (té el document.ready del jQuery, així que s'ha de posar el jQuery també):
<script>
var reader = new FileReader();
reader.onload = function (e) {
var text = reader.result;
if (window.DOMParser) {
parser = new DOMParser();
xmlDoc = parser.parseFromString(text, "text/xml");
$("#test").val(xmlDoc.getElementsByTagName("SOAPAction")[0].childNodes[0].nodeValue);
}
else {
alert("No hi ha parser!");
}
}
function handleFileSelect(evt) {
var files = evt.target.files;
var output = [];
for (var i = 0, f; f = files[i]; i++) {
output.push('<li><strong>', escape(f.name), '</strong> (', f.type || 'n/a', ') - ',
f.size, ' bytes, last modified: ',
f.lastModifiedDate ? f.lastModifiedDate.toLocaleDateString() : 'n/a',
'</li>');
reader.readAsText(f);
}
document.getElementById('list').innerHTML = '<ul>' + output.join('') + '</ul>';
}
$(document).ready(function () {
if (window.File && window.FileReader && window.FileList && window.Blob) {
document.getElementById('files').addEventListener('change', handleFileSelect, false);
} else {
alert('The File APIs are not fully supported in this browser.');
}
});
</script>
Com es pot veure a l'exemple, el XML ha de tenir el tag "SOAPAction" i el seu valor es posa al control "test", i llestos! |