Click here to Skip to main content
14,732,983 members
Please Sign up or sign in to vote.
3.00/5 (1 vote)
How can I get response from an XHTML form to a JavaScript file. This JavaScript is internal!
Thanks!
Posted
Comments
Sergey Alexandrovich Kryukov 20-Oct-11 12:00pm
   
What does it mean: "to a JavaScript file"? "JavaScript is internal"? Does "internal" mean "embedded in HTML"? -- which does not matter.
--SA

1 solution

The question is very inaccurate (please see my comment to it above), so don't blame me if I answer wrong question.

I assumed that you simply need to process form data by some JavaScript code embedded in XHTML. I also assumed you use client-side JavaScript as server-side JavaScript is not used often these days. Indeed, there could be some problems (please see below). First thing to understand: if you need just client-side JavaScript processing, you don't need form, which is also needed to send HTTP request to the server. You actually don't even need a server for development, not even a local server, no servers at all anywhere. You can deploy the result of your development to a server machine later, when and if this is needed.

So, if my assumptions are correct, read the above code sample. Basically, this is all you need to know:

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"

"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
	<head>
		<title>JavaScript in XHTML sample</title>
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
		<script type="text/javascript"><![CDATA[
			function submitHandler() {
				var div = document.getElementById("placeholder");
				var checkbox = document.getElementById("checkbox");
				var textarea = document.getElementById("textarea");
				var text =  document.getElementById("text");
				var select =  document.getElementById("select");
				div.innerHTML = "<br/><hr/>" + 
					"Check box checked: <b>" + checkbox.checked + "</b><br />" +
					"Text area value: <b>" + textarea.value + "</b><br />" +
					"Text box value: <b>" + text.value + "</b><br />" +
					"Selected make: <b>" + select.value + "</b><br />";
			}
		]]></script>
	</head>
<body>

<div>
<input type="checkbox" id="checkbox"/>Check box<br/>
<textarea placeholder="Type some message here..." id="textarea" /><br/>
<input type="text" placeholder="Type one line..." id="text" /><br/>
<select id="select">
  <option value="Volvo">Volvo</option>
  <option value="Toyota">Toyota</option>
  <option value="Honda" selected="true">Honda</option>
  <option value="Nissan">Nissan</option>
  <option value="Saab">Saab</option>
  <option value="Mercedes">Mercedes</option>
  <option value="Audi">Audi</option>
</select><br/>
<button onclick="javascript:submitHandler()" accesskey="S"><u>S</u>ubmit</button>
</div>

<div id="placeholder" />

</body>
</html>


Pay attention: Unlike "plain" HTML, XHTML requires CDATA section to sandwich JavaScript code, to prevent XML parsing of it. "Plain" HTML would rather need <!-- ... --> (comment) brackets. Also, XML is case-sensitive, and XHTML attributes are all low-case. These differences creates problems in attempt to process HTML code as XHTML — it may be failed or render the code defunct.

—SA
   
v6

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)




CodeProject, 20 Bay Street, 11th Floor Toronto, Ontario, Canada M5J 2N8 +1 (416) 849-8900