accessing form elements 1

stasJohn · Jul 20, 2005

setup

1 xml file
1 xsl file

The xsl file just transforms the xml data into an html page. This html page also includes a form for selecting the year. I also have embedded javascript which reads the value of the form.

When I try to access the form elements;
document.forms[0].year
document.myform.year
...etc...

I get "document.forms[0] has not properties". Any idea how to access the form elements?

JontyMC · Jul 21, 2005

Post your xsl

Jon

"Asteroids do not concern me, Admiral. I want that ship, not excuses.

stasJohn · Jul 21, 2005

Here is my xsl. I stripped out alot of the code and left only the parts related to the form and javascript to make it easier to read. Thanks in advance.

Code:

<?xml version="1.0" encoding="UTF-8"?>
<xsl:stylesheet version="1.0" xmlns:xsl="[URL unfurl="true"]http://www.w3.org/1999/XSL/Transform"[/URL] xmlns:fo="[URL unfurl="true"]http://www.w3.org/1999/XSL/Format">[/URL]
	<xsl:param name="sortYear"/>
	<xsl:template match="/">
		<html xmlns="[URL unfurl="true"]http://www.w3.org/1999/xhtml"[/URL] xml:lang="en-us">
			<head>
				<title>Invoices</title>
				<style type="text/css"><![CDATA[ ]]></style>
				
<script type="text/javascript"><![CDATA[

function updateHistory() {
					
var xslStylesheet;
var xsltProcessor = new XSLTProcessor();
var myDOM;

var xmlDoc;

var selectBox = document.forms[0].y;
var newyear = selectBox.options[selectBox.selectedIndex].value;
alert(newyear);

//set sort by year parameter
xsltProcessor.setParameter(null, "sortYear", newyear);					
					
// load the xslt file
var myXMLHTTPRequest = new XMLHttpRequest();
myXMLHTTPRequest.open("GET", "invoices.xsl", false);
myXMLHTTPRequest.send(null);

xslStylesheet = myXMLHTTPRequest.responseXML;
xsltProcessor.importStylesheet(xslStylesheet);

// load the xml file
myXMLHTTPRequest = new XMLHttpRequest();
myXMLHTTPRequest.open("GET", "myInvoices.xml", false);
myXMLHTTPRequest.send(null);

xmlDoc = myXMLHTTPRequest.responseXML;

var fragment = xsltProcessor.transformToFragment(xmlDoc, document);

						return true;
					}
								
				]]></script>
			</head>
			<body>
				<h1>My Invoices</h1>
[ code removed ]	

				<h2>History</h2>
				<form id="selectyear" onsubmit="updateHistory()">
					<label for="y">Tax Year: </label>
					<select id="y" name="y">
					       <option></option>
						<xsl:for-each select="//tax-year/@year">
							<xsl:sort select="." order="descending"/>						
							<option>
								<xsl:value-of select="."/>
							</option>
						</xsl:for-each>
					</select>
					<input type="submit" value="View"/>
				</form>

[ code removed ]				
			</body>
		</html>
	</xsl:template>
</xsl:stylesheet>

JontyMC · Jul 21, 2005

It references the form fine in FireFox. What browser you using?

Jon

"Asteroids do not concern me, Admiral. I want that ship, not excuses.

stasJohn · Jul 21, 2005

I'm using firefox as well. When I click the button an alert does not pop up as it should. If I open the javascript console I see the error message I stated above.

JontyMC · Jul 21, 2005

Hmmmmm. Post your full XSL and XML (or a link to), so I can recreate the same conditions.

Jon

"Asteroids do not concern me, Admiral. I want that ship, not excuses.

stasJohn · Jul 21, 2005

here's a stupid question, I'm running the transformation locally... that is not on a web server. Is that an issue?

JontyMC · Jul 21, 2005

Yeah, I was doing the transformation in XMLSpy. I've just done it locally and it doesn't recognise the document.forms object. This is strange. I have a treeview function that prints out the DOM structure, which is quite useful for debugging:

Code:

function treewalk(mywindow, indent, node){
  mywindow.document.write("<p style='margin: 0; margin-left: " + indent + "px'>" + node.nodeName+ "</p>");
  for(var i=0;i<node.childNodes.length;i++){
    treewalk(mywindow, indent+20, node.childNodes[i]);
  }
}

This confirms that you can access the form using DOM. So you can use the work-around of:

Code:

document.getElementById('selectyear').y

Jon

"Asteroids do not concern me, Admiral. I want that ship, not excuses.

stasJohn · Jul 21, 2005

document.getElementById('selectyear').y" works great!

Thanks Jon, for both the treeview function and the solutions. I appreciate it.

Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

accessing form elements 1

stasJohn

Programmer

JontyMC

Programmer

stasJohn

Programmer

JontyMC

Programmer

stasJohn

Programmer

JontyMC

Programmer

stasJohn

Programmer

JontyMC

Programmer

stasJohn

Programmer

Similar threads

Part and Inventory Search

Sponsor