Dieses einfache Beispiel zeigt eine html-Seite, die Eingabefelder für User, Kennwort, und Favorit anzeigt, in denen man die gewünschten Werte eintragen kann. Wenn Sie auf die Schaltfläche Tabelle erzeugen klicken, werden die Daten über die Abfrageschnittstelle eingelesen und als Tabelle unterhalb des Formulars angezeigt.
Beispiel
Um das Beispiel für Internet Explorer nachzuvollziehen, erzeugen Sie im Verzeichnis <Installationsverzeichnis>\ppm\server\bin\work\data_ppm\
webappQueryApi
die Datei test_JS.html mit folgendem Inhalt:<html>
<head/>
<body>
<script type="text/javascript" language="JavaScript">
var g_QueryBaseURL = "http://localhost:16350/API_umg_de";
function makeRequest(usr,pass,favorit,folder) {
var sfolder = (folder)?"FAVORITES_PRIVATE":"FAVORITES_SHARED";
var url = g_QueryBaseURL+"/urlquery/query.do?favoritename="
+encodeURIComponent(favorit)+"&favoritefolder="+sfolder;
if (window.XMLHttpRequest) { // Mozilla, Safari,...
http_request = new XMLHttpRequest();
logout_request = new XMLHttpRequest();
if (http_request.overrideMimeType) {
http_request.overrideMimeType('text/xml');
logout_request.overrideMimeType('text/xml');
}
} else if (window.ActiveXObject) { // IE
http_request = new ActiveXObject("Microsoft.XMLHTTP");
logout_request = new ActiveXObject("Microsoft.XMLHTTP");
}
if (!http_request) {
alert('Giving up :( Cannot create an XMLHTTP instance');
return false;
}
http_request.onreadystatechange = renderResults;
http_request.open('POST', url, true,usr,pass); //Hier kann auch GET verwendet werden
http_request.send(null);
}
function renderResults()
{
if (http_request.readyState == 4) {
if (http_request.status == 200) {
var srcTree = new ActiveXObject("Msxml2.DOMDocument.4.0");
srcTree.async=false;
srcTree.loadXML(http_request.responseXML.xml);
var dd = srcTree.selectSingleNode("//queryresult");
var x = dd.getElementsByTagName("column") ;
var newEl = document.createElement('TABLE');
newEl.setAttribute('cellPadding',5);
var tmp = document.createElement('TBODY');
newEl.appendChild(tmp);
var row = document.createElement('TR');
for (j=0;j<x.length;j++) {
var container = document.createElement('TH');
var theData = document.createTextNode(x[j].text);
container.appendChild(theData);
row.appendChild(container);
}
tmp.appendChild(row);
var z = dd.getElementsByTagName('row');
for (var i=0;i<z.length;i++) {
var row = document.createElement('TR');
for (var j=0;j<z[i].childNodes.length;j++) {
if (z[i].childNodes[j].nodeType != 1) continue;
var container = document.createElement('TD');
var theData = document.createTextNode(z[i].childNodes[j].firstChild.nodeValue);
container.appendChild(theData);
row.appendChild(container);
}
tmp.appendChild(row);
}
document.getElementById('writeroot').appendChild(newEl);
logout_request.open('POST', g_QueryBaseURL+"/urlquery/logout.do", true);
logout_request.send(null);
} else if(http_request.status == 401) {
alert('Fehler beim Login! Benutzer-Password Kombination existiert nicht!');
} else {
alert('Es gibt ein Problem mit dem Request. Status:'+http_request.status);
}
}
}
</script>
<form action="" method="post" name="myform">
<table>
<tr><td>Benutzer:</td><td><input type="text" name="user" size="20" value="system"></td></tr>
<tr><td>Kennwort:</td><td><input type="password" name="password" size="20" value="manager"></td></tr>
<tr><td>Favorit:</td><td><input type="text" name="favorit" size="40" value="\MVs\Helpdesk\Favorite_Table"></td></tr>
<tr><td>Privater Favorit:</td><td><input type="checkbox" name="folder" value="1"></td></tr>
</table>
<input type="button" value="Tabelle erstellen" onclick="javascript:makeRequest(document.forms['myform'].elements['user'].value,document.forms['myform'].elements['password'].value,document.forms['myform'].elements['favorit'].value,document.forms['myform'].elements['folder'].checked);return true"/>
</form>
<div id="writeroot"></div>
</body>
</html>