Recieving and organizing results without server side script (JavaScript)
Posted
by
Aaron
on Programmers
See other posts from Programmers
or by Aaron
Published on 2012-11-17T21:11:04Z
Indexed on
2012/11/17
23:21 UTC
Read the original article
Hit count: 246
Filed under:
JavaScript
|css
I have been working on a very large form project for the past few days. I finally managed to get tables to work properly within a javascript file that opens a new display window. Now the issue at hand is that I can't seem to get CSS code to work within the javascript that I have created.
Before everyone starts thinking "just use server side script idiot" I have a few conditions and info about the file:
- The file is only being ran local due to confidential information risks. Once again no option for server access. The intranet the computers are on are already top security and this wouldn't exactly be a company wide program
- The code below is obviously just a demo with a simple form...
- The real file has six pages of highly confidential information
- Only certain fields on this form will actually be gathered (example: address doesnt appear in the results)
- The display page will contain data compiled into tables for easier viewing
- I need to be able to create css commands to easily detect certain information if it applies and along with matching design of the original form
Here is the code:
<html>
<head>
<title>Form Example</title>
<script LANGUAGE="JavaScript" type="text/javascript">
function display() {
DispWin = window.open('','NewWin', 'toolbar=no,status=no,width=800,height=600')
message = "<body>";
message += "<table border=1 width=100%>";
message += "<tr>";
message += "<th colspan=2 align=center><font face=stencil color=black><h1>Results</h1><h4>one</h4></font>";
message += "</th>";
message += "</tr>";
message += "<td width=50% align=left>";
message += "<ul><li><b><font face=calibri color=red>NAME:</font></b> " + document.form1.yourname.value + "</UL>"
message += "</td>";
message += "<td width=50% align=left>";
message += "<li><b>PHONE: </b>" + document.form1.phone.value + "</ul>";
message += "</td>";
message += "</table>";
message += "<body>";
DispWin.document.write(message);
DispWin.document.body.style.cssText = 'color:#blue;';
}
</script>
</head>
<body>
<h1>Form Example</h1>
Enter the following information:
<form name="form1">
<p><b>Name:</b> <input TYPE="TEXT" SIZE="20" NAME="yourname">
</p>
<p><b>Address:</b> <input TYPE="TEXT" SIZE="30" NAME="address">
</p>
<p><b>Phone: </b> <input TYPE="TEXT" SIZE="15" NAME="phone">
</p>
<p><input TYPE="BUTTON" VALUE="Display" onClick="display();"></p>
</form>
</body>
</html>
>
© Programmers or respective owner
