Selectbox aus XML Daten u. Abfrage von Daten aus XML Datei

H

helpmeaimnew

Grünschnabel
Folgendes Problem hatte ich! Ich hatte eine Tabelle, deren Daten ich zu weiteren Berechnungen brauchte und die Lösungen dann auf einer graphischen Plattform wiedergeben kann.
Hab ewig im Internet gesucht aber wenig zu diesem Thema gefunden. Hier mal mein Grundgerüst.

test.xml
Code: 
<?xml version="1.0" encoding="ISO-8859-1"?>
<!-- W3Schools bookstore example -->
<bookstore>
<Sparbuch.1 name="0">
<Zins1>46</Zins1>
<Zins2>12</Zins2>
<Zins3>25</Zins3>
<Zins4>5</Zins4>
</Sparbuch.1>
<Sparbuch.2 name="1">
<Zins1>6</Zins1>
<Zins2>2</Zins2>
<Zins3>2</Zins3>
<Zins4>5</Zins4>
</Sparbuch.2>
<Sparbuch.3 name="2">
<Zins1>6</Zins1>
<Zins2>2</Zins2>
<Zins3>5</Zins3>
<Zins4>4</Zins4>
</Sparbuch.3>
<Sparbuch.4 name="3">
<Zins1>36</Zins1>
<Zins2>16</Zins2>
<Zins3>7</Zins3>
<Zins4>9</Zins4>
</Sparbuch.4>

</bookstore>

Funktioniert nur in IE

test.html
Code: 
<html><head><title>Test</title>
<script type="text/javascript">
function loadXMLDoc(dname) 
{
try //Internet Explorer
  {
  xmlDoc=new ActiveXObject("Microsoft.XMLDOM");
  }
catch(e)
  {
  try //Firefox, Mozilla, Opera, etc.
    {
    xmlDoc=document.implementation.createDocument("","",null);
    }
  catch(e) {alert(e.message)}
  }
try 
  {
  xmlDoc.async=false;
  xmlDoc.load(dname);
  return(xmlDoc);
  }
catch(e) {alert(e.message)}
return(null);
}
xmlDoc=loadXMLDoc("test.xml");


function wertsuche(){
var x = document.formular.BNR.options[document.formular.BNR.options.selectedIndex].text;
var hochzaehl = 0;
xv=xmlDoc.getElementsByTagName(x)[0].attributes;
var attributwert =(xv.getNamedItem("name").nodeValue);
while (hochzaehl < 4){
var zinsname = (xmlDoc.getElementsByTagName(x)[0].childNodes[hochzaehl].nodeName);
var d = (xmlDoc.getElementsByTagName(zinsname)[attributwert].childNodes[0].nodeValue);
document.formular.zins[hochzaehl].value = d;
hochzaehl++
}
}
</script>

</head><body>
<form name="formular" style="margin-left:10px">
<p style="margin-left:80px">
   BnschNR: <select id="zumir" name="BNR"  size="1" style="font-family:Arial; font-size:12pt; text-align:right"
onchange="wertsuche()">
        </select>
  </p>
<p  style="margin-left:105px"> Wert 1 <input type="text" name="zins" size="3" style="font-family:Arial; font-size:12pt; text-align:right" readonly> %</p>
<p  style="margin-left:105px"> Wert 2 <input type="text" name="zins" size="3" style="font-family:Arial; font-size:12pt; text-align:right" readonly> %</p>
<p  style="margin-left:105px"> Wert 3 <input type="text" name="zins" size="3" style="font-family:Arial; font-size:12pt; text-align:right" readonly> %</p>
<p  style="margin-left:105px"> Wert 4 <input type="text" name="zins" size="3" style="font-family:Arial; font-size:12pt; text-align:right" readonly> %</p>

<script language="javascript" type="text/javascript">
var inpNam =  "inp";
wieoft= (xmlDoc.getElementsByTagName("bookstore")[0].childNodes.length)
i = 0;
while (i<wieoft){
  var inp =  document.createElement("option");
  inp.text=xmlDoc.getElementsByTagName("bookstore")[0].childNodes[i].nodeName
    document.getElementById("zumir").options.add(inp);
  i++;
}
wertsuche();
</script>
</form>
</body></html>

Für Mozilla Werte in Funktion wertsuche() und im 2 Javascript Teil ändern wie folgt

Code: 
function wertsuche(){
var x = document.formular.BNR.options[document.formular.BNR.options.selectedIndex].text;
var hochzaehl = 1;
var j = 0;
xv=xmlDoc.getElementsByTagName(x)[0].attributes;
var attributwert =(xv.getNamedItem("name").nodeValue);
while (j < 4){
var zinsname = (xmlDoc.getElementsByTagName(x)[0].childNodes[hochzaehl].nodeName);
var d = (xmlDoc.getElementsByTagName(zinsname)[attributwert].childNodes[0].nodeValue);
document.formular.zins[j].value = d;
hochzaehl=hochzaehl+2
j++;
}
}
Code: 
<script language="javascript" type="text/javascript">
var inpNam =  "inp";
wieoft= (xmlDoc.getElementsByTagName("bookstore")[0].childNodes.length)
i = 1;
while (i<wieoft){
  var inp =  document.createElement("option");
  inp.text=xmlDoc.getElementsByTagName("bookstore")[0].childNodes[i].nodeName
    document.getElementById("zumir").options.add(inp);
  i=i+2;
}
wertsuche();
</script>

Über den Attributwert "name" wird bestimmt, welcher Zins1,Zins2,Zins3,Zins4 Wert ausgelesen wird, fand hierzu keine andere Lsg.
Vorteil: Bei Erweiterung der Xml Datei wird automatisch Dropdown-Liste erweitert.
Hoffe es gibt nicht viel auszusetzen fange gerade erst an mich dem Thema auseinanderzusetzen. Falls es eine elegantere Lsg gib, so laßt es mich bitte wissen.
Noch eine Frage: Gibt es eine Möglichkeit so eine xml in excel zu bearbeiten und abzuspeichern? Ohne das Attributwerte verloren gehen und die Struktur geändert wird!
 
Moin,

Danke für deine Lösung, in Zeiten von AJAX scheinen viele zu vergessen, dass es da noch mehr gibt, und in meinen Augen ist dein Lösungsweg weitaus eleganter als eine etwaige AJAX-Lösung :)
Wobei du die Sache noch nicht vollends ausnutzt...es geht da noch einiges mehr :-)
Schau dir mal in SelfHTML das Kapitel zur Darstellung von XML-Daten an..ich glaube, das wird dich sehr interessieren, vor allem auf die Abschnitte XSLT und XPath solltest du dabei ein Auge werfen :)

Was Excel betrifft, das stelle ich mir recht kompliziert vor, da das ja seine eigene Dokumentstruktur hat... ich würde diesen Umweg aber garnicht erst gehen.
Die entsprechenden Berechtigungen im Browser(IE) vorrausgesetzt, könntest du die Daten im Browser ändern, und dann das daraus resultierende XML-Document direkt in einer Datei speichern.
 
Hi,

die Methode hat nur einen entscheidenden Nachteil. Das durch createDocument zurückgegebene Dokument kennt im Safari die Methode load nicht. Aus diesem Grund wird dort das XML-Dokument nicht geladen.

Vielleicht gibt es hier aber eine alternative Möglichkeit (ausser XMLHttpRequest) - würde mich auch interessieren.

Ciao
Quaese
 
Um antworten zu können musst du eingeloggt sein.

Neue Beiträge

Zurück