Velocity Reviews - Computer Hardware Reviews

Velocity Reviews > Newsgroups > Programming > XML > XML Beginner for Client-side server

Reply
Thread Tools

XML Beginner for Client-side server

 
 
Renee
Guest
Posts: n/a
 
      09-30-2003
I am doing a simple client-side example using DOM in JScript. When the
user enter info and click on the submit button, it will then print the
value at the bottom of the page. However, I don't know what's wrong
that the entered values are not printed out. Can anyone please help
me??? Any reply is appreciated. My code is as follow, you can copy and
run it yourself.

File name: bookClient.htm

<html>
<head>
<title>Wrox Press book data entry page</title>
<body onload="initializeBook()" >
<h1>Wrox Press book data entry page</h1>
<h3>Book information:</h3>
<table>
<tr>
<td>Title:</td>
<td><input id="txtTitle"></input></td>
</tr>
<tr>
<td>Publisher:</td><td><input id="txtPublisher"></input></td>
</tr>
<tr>
<td>Published Date:</td><td><input id="txtPubDate"></input></td>
</tr>
<tr>
<td>Abstract:</td><td><input id="txtAbstract"></input></td>
</tr>
<tr>
<td>Pages:</td><td><input id="txtPages"></input></td>
</tr>
<tr>
<td>ISBN:</td><td><input id="txtISBN"></input></td>
</tr>
<tr>
<td>Price:</td><td><input id="txtPrice"></input></td>
</tr>
</table>
<input id="btnUpdate" type="button" value="Update book info"
onclick="updateBookInfo()"></input>
<h3>Authors:</h3>
<table>
<tr>
<td>Author:</td><td><input id="txtAuthor"></input></td>
</tr>
</table>
<input id="btnAddAuthor" type="button" value="Add author"
onclick="addAuthor()"></input>

<h3>Categories:</h3>
<table>
<tr>
<td>Category:</td><td><input id="txtCategory"></input></td>
</tr>
</table>
<input id="btnAddCategory" type="button" value="Add Category"
onclick="addCategory()"></input>
<xml id="docBook">
<book>
</book>
</xml>
<script>
var docBook;
function initializeBook()
{

docBook = document.all("docBook").XMLDocument;
docBook.async = "false";
renderElements();
}

function createOrReplaceElement(sElementName, sElementValue,
elementParent)
{
var elementItem;
var textValue;
var nodelistOldItem;

elementItem = docBook.createElement(sElementName);
textValue = docBook.createTextNode(sElementValue);
elementItem.appendChild(textValue);

nodelistOldItem = elementParent.getElementsByTagName(sElementName);
if (nodelistOldItem.length > 0)
{
elementParent.replaceChild(elementItem, nodelistOldItem.item(0));
}
else
{
elementParent.appendChild(elementItem);
}
}
function updateBookInfo()
{
createOrReplaceElement("Title", txtTitle.value,
docBook.documentElement);
createOrReplaceElement("Publisher", txtPublisher.value,
docBook.documentElement);
createOrReplaceElement("PubDate", txtPubDate.value,
docBook.documentElement);
createOrReplaceElement("Abstract", txtAbstract.value,
docBook.documentElement);
createOrReplaceElement("Pages", txtPages.value,
docBook.documentElement);
createOrReplaceElement("ISBN", txtISBN.value,
docBook.documentElement);
createOrReplaceElement("Price", txtPrice.value,
docBook.documentElement);

renderElements();
}
function addAuthor()
{
var elementAuthor;
var textAuthor;
var nodelistAuthors;
var elementAuthors;
elementAuthor = docBook.createElement("author");
textAuthor = docBook.createElement(txtAuthor.value);
elementAuthor.appendChild(textAuthor);
nodelistAuthors = docBook.getElementsByTagName("authors");
if (nodelistAuthors.length == 0)
{
elementAuthors = docBook.createElement("authors");
docBook.documentElement.appendChild(elementAuthors );
}
else
{
elementAuthors = nodelistAuthors.item(0);
}
elementAuthors.appendChild(elementAuthor);
renderElements();
}
function addCategory()
{
var elementCategory;
var textCategory;
var nodelistRecSubjCategories;
var elementRecSubjCategories;
elementCategory = docBook.createElement("category");
textCategory = docBook.createElement(txtCategory.value);
elementCategory.appendChild(textCategory);
nodelistRecSubjCategories =
docBook.getElementsByTagName("recSubjCategories");
if (nodelistRecSubjCategories.length == 0)
{
elementRecSubjCategories =
docBook.createElement("recSubjCategories");
docBook.documentElement.appendChild(elementRecSubj Categories);
}
else
{
elementRecSubjCategories = nodelistRecSubjCategories.item(0);
}
elementRecSubjCategories.appendChild(elementCatego ry);
renderElements();
}
function renderElements()
{

document.all("divRawXML").innerText = docBook.xml;
bookInfo.innerHTML = docBook.transformNode(bookXSL.documentElement);
authorTable.innerHTML =
docBook.transformNode(authorXSL.documentElement);
categoryTable.innerHTML =
docBook.transformNode(categoryXSL.documentElement) ;
}
</script>
<xml id="bookXSL">
<div xmlnssl="http://www.w3.org/1999/XSL/Transform">
<xsl:choose>
<xsl:when test="/book/title[. $ne$ '']">
<table border="0" cellpadding="1">
<tr>
<td>Title:</td>
<td><xsl:value-of select="/book/title"/></td>
</tr>
<tr>
<td>Publisher:</td>
<td><xsl:value-of select="/book/publisher"/></td>
</tr>
<tr>
<td>Published Date:</td>
<td><xsl:value-of select="/book/pubDate"/></td>
</tr>
<tr>
<td>Abstract:</td>
<td><xsl:value-of select="/book/abstract"/></td>
</tr>
<tr>
<td>Pages:</td>
<td><xsl:value-of select="/book/pages"/></td>
</tr>
<tr>
<td>ISBN:</td>
<td><xsl:value-of select="/book/isbn"/></td>
</tr>
<tr>
<td>Price:</td>
<td><xsl:value-of select="/book/price"/></td>
</tr>
</table>
</xsl:when>
<xsltherwise>
<p>Book Information not yet specified.</p>
</xsltherwise>
</xsl:choose>
</div>
</xml>
<xml id="authorXSL">
<div xmlnssl="http://www.w3.org/1999/XSL/Transform">
<table border="0" cellpadding="1">
<tr>
<td><strong>Authors</strong></td>
</tr>
<xsl:for-each select="/book/authors/author">
<tr>
<td><xsl:value-of select="text()"/></td>
</tr>
</xsl:for-each>
</table>
</div>
</xml>
<xml id="categoryXSL">
<div xmlnssl="http://www.w3.org/1999/XSL/Transform">
<xsl:template match="/category">
<table border="0" cellpadding="1">
<tr>
<td><strong>Categories</strong></td>
</tr>
<xsl:for-each select="category">
<tr>
<td><xsl:value-of select="category"/></td>
</tr>
</xsl:for-each>
</table>
</xsl:template>
</div>
</xml>
<hr>
<h2>Book information</h2>
<p><div id="bookInfo"></div></p>
<p><div id="authorTable"></div></p>
<p><div id="categoryTable"></div></p>
</hr>
The text expression of the current contents of the DOM tree is:
<pre><div id="divRawXML"></div></pre>
</body>
</head>
</html>
 
Reply With Quote
 
 
 
 
Oleg Dulin
Guest
Posts: n/a
 
      10-06-2003
Browsers render HTML as a stream, rather than as a parse tree. Try to
put your script at the beginning of the document, rather than at the end.

Regards,
Oleg


Renee wrote:
> I am doing a simple client-side example using DOM in JScript. When the
> user enter info and click on the submit button, it will then print the
> value at the bottom of the page. However, I don't know what's wrong
> that the entered values are not printed out. Can anyone please help
> me??? Any reply is appreciated. My code is as follow, you can copy and
> run it yourself.
>
> File name: bookClient.htm
>
> <html>
> <head>
> <title>Wrox Press book data entry page</title>
> <body onload="initializeBook()" >
> <h1>Wrox Press book data entry page</h1>
> <h3>Book information:</h3>
> <table>
> <tr>
> <td>Title:</td>
> <td><input id="txtTitle"></input></td>
> </tr>
> <tr>
> <td>Publisher:</td><td><input id="txtPublisher"></input></td>
> </tr>
> <tr>
> <td>Published Date:</td><td><input id="txtPubDate"></input></td>
> </tr>
> <tr>
> <td>Abstract:</td><td><input id="txtAbstract"></input></td>
> </tr>
> <tr>
> <td>Pages:</td><td><input id="txtPages"></input></td>
> </tr>
> <tr>
> <td>ISBN:</td><td><input id="txtISBN"></input></td>
> </tr>
> <tr>
> <td>Price:</td><td><input id="txtPrice"></input></td>
> </tr>
> </table>
> <input id="btnUpdate" type="button" value="Update book info"
> onclick="updateBookInfo()"></input>
> <h3>Authors:</h3>
> <table>
> <tr>
> <td>Author:</td><td><input id="txtAuthor"></input></td>
> </tr>
> </table>
> <input id="btnAddAuthor" type="button" value="Add author"
> onclick="addAuthor()"></input>
>
> <h3>Categories:</h3>
> <table>
> <tr>
> <td>Category:</td><td><input id="txtCategory"></input></td>
> </tr>
> </table>
> <input id="btnAddCategory" type="button" value="Add Category"
> onclick="addCategory()"></input>
> <xml id="docBook">
> <book>
> </book>
> </xml>
> <script>
> var docBook;
> function initializeBook()
> {
>
> docBook = document.all("docBook").XMLDocument;
> docBook.async = "false";
> renderElements();
> }
>
> function createOrReplaceElement(sElementName, sElementValue,
> elementParent)
> {
> var elementItem;
> var textValue;
> var nodelistOldItem;
>
> elementItem = docBook.createElement(sElementName);
> textValue = docBook.createTextNode(sElementValue);
> elementItem.appendChild(textValue);
>
> nodelistOldItem = elementParent.getElementsByTagName(sElementName);
> if (nodelistOldItem.length > 0)
> {
> elementParent.replaceChild(elementItem, nodelistOldItem.item(0));
> }
> else
> {
> elementParent.appendChild(elementItem);
> }
> }
> function updateBookInfo()
> {
> createOrReplaceElement("Title", txtTitle.value,
> docBook.documentElement);
> createOrReplaceElement("Publisher", txtPublisher.value,
> docBook.documentElement);
> createOrReplaceElement("PubDate", txtPubDate.value,
> docBook.documentElement);
> createOrReplaceElement("Abstract", txtAbstract.value,
> docBook.documentElement);
> createOrReplaceElement("Pages", txtPages.value,
> docBook.documentElement);
> createOrReplaceElement("ISBN", txtISBN.value,
> docBook.documentElement);
> createOrReplaceElement("Price", txtPrice.value,
> docBook.documentElement);
>
> renderElements();
> }
> function addAuthor()
> {
> var elementAuthor;
> var textAuthor;
> var nodelistAuthors;
> var elementAuthors;
> elementAuthor = docBook.createElement("author");
> textAuthor = docBook.createElement(txtAuthor.value);
> elementAuthor.appendChild(textAuthor);
> nodelistAuthors = docBook.getElementsByTagName("authors");
> if (nodelistAuthors.length == 0)
> {
> elementAuthors = docBook.createElement("authors");
> docBook.documentElement.appendChild(elementAuthors );
> }
> else
> {
> elementAuthors = nodelistAuthors.item(0);
> }
> elementAuthors.appendChild(elementAuthor);
> renderElements();
> }
> function addCategory()
> {
> var elementCategory;
> var textCategory;
> var nodelistRecSubjCategories;
> var elementRecSubjCategories;
> elementCategory = docBook.createElement("category");
> textCategory = docBook.createElement(txtCategory.value);
> elementCategory.appendChild(textCategory);
> nodelistRecSubjCategories =
> docBook.getElementsByTagName("recSubjCategories");
> if (nodelistRecSubjCategories.length == 0)
> {
> elementRecSubjCategories =
> docBook.createElement("recSubjCategories");
> docBook.documentElement.appendChild(elementRecSubj Categories);
> }
> else
> {
> elementRecSubjCategories = nodelistRecSubjCategories.item(0);
> }
> elementRecSubjCategories.appendChild(elementCatego ry);
> renderElements();
> }
> function renderElements()
> {
>
> document.all("divRawXML").innerText = docBook.xml;
> bookInfo.innerHTML = docBook.transformNode(bookXSL.documentElement);
> authorTable.innerHTML =
> docBook.transformNode(authorXSL.documentElement);
> categoryTable.innerHTML =
> docBook.transformNode(categoryXSL.documentElement) ;
> }
> </script>
> <xml id="bookXSL">
> <div xmlnssl="http://www.w3.org/1999/XSL/Transform">
> <xsl:choose>
> <xsl:when test="/book/title[. $ne$ '']">
> <table border="0" cellpadding="1">
> <tr>
> <td>Title:</td>
> <td><xsl:value-of select="/book/title"/></td>
> </tr>
> <tr>
> <td>Publisher:</td>
> <td><xsl:value-of select="/book/publisher"/></td>
> </tr>
> <tr>
> <td>Published Date:</td>
> <td><xsl:value-of select="/book/pubDate"/></td>
> </tr>
> <tr>
> <td>Abstract:</td>
> <td><xsl:value-of select="/book/abstract"/></td>
> </tr>
> <tr>
> <td>Pages:</td>
> <td><xsl:value-of select="/book/pages"/></td>
> </tr>
> <tr>
> <td>ISBN:</td>
> <td><xsl:value-of select="/book/isbn"/></td>
> </tr>
> <tr>
> <td>Price:</td>
> <td><xsl:value-of select="/book/price"/></td>
> </tr>
> </table>
> </xsl:when>
> <xsltherwise>
> <p>Book Information not yet specified.</p>
> </xsltherwise>
> </xsl:choose>
> </div>
> </xml>
> <xml id="authorXSL">
> <div xmlnssl="http://www.w3.org/1999/XSL/Transform">
> <table border="0" cellpadding="1">
> <tr>
> <td><strong>Authors</strong></td>
> </tr>
> <xsl:for-each select="/book/authors/author">
> <tr>
> <td><xsl:value-of select="text()"/></td>
> </tr>
> </xsl:for-each>
> </table>
> </div>
> </xml>
> <xml id="categoryXSL">
> <div xmlnssl="http://www.w3.org/1999/XSL/Transform">
> <xsl:template match="/category">
> <table border="0" cellpadding="1">
> <tr>
> <td><strong>Categories</strong></td>
> </tr>
> <xsl:for-each select="category">
> <tr>
> <td><xsl:value-of select="category"/></td>
> </tr>
> </xsl:for-each>
> </table>
> </xsl:template>
> </div>
> </xml>
> <hr>
> <h2>Book information</h2>
> <p><div id="bookInfo"></div></p>
> <p><div id="authorTable"></div></p>
> <p><div id="categoryTable"></div></p>
> </hr>
> The text expression of the current contents of the DOM tree is:
> <pre><div id="divRawXML"></div></pre>
> </body>
> </head>
> </html>


 
Reply With Quote
 
 
 
Reply

Thread Tools

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Trackbacks are On
Pingbacks are On
Refbacks are Off


Similar Threads
Thread Thread Starter Forum Replies Last Post
Beginner's Beginner william nelson Ruby 7 04-11-2011 11:23 PM
Different results parsing a XML file with XML::Simple (XML::Sax vs. XML::Parser) Erik Wasser Perl Misc 5 03-05-2006 10:09 PM
Beginner XML Question - Access XML in a hidden Frame? Paul McFadden XML 2 02-15-2005 07:56 AM
No Class at ALL!!! beginner/beginner question =?Utf-8?B?S3VydCBTY2hyb2VkZXI=?= ASP .Net 7 02-03-2005 02:47 PM
Tutorial for beginner/ Tutorial voor beginner Rensjuh C++ 7 09-02-2004 12:41 AM



Advertisments