Hey guys, I couldn't decide if this should go in the HTML/CSS or Javascript forums.
I've made a big form and now I need to make sure all the form elements have a unique ID so that they can be processed with Javascript. I don't need to write any Javascript, just prepare the form as if I was going to.
At the moment it just looks like this:
html
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head><title>AI Conference 2009 - Sign Up</title>
<LINK rel="stylesheet" type="text/css" name="style1" href="styles/basic.css">
</head>
<body>
<div id="container">
<div id="header">
<div id="headertitle"><span class="conferencetitle">AI Conference 2009</span><br />
<span class="subheader">22nd Australasian Joint Conference on Artificial Intelligence<br />
4~8 December 2009, Hobart, Australia</span></div>
<div id="links"><span><a href="index.html">Home</a></span> | <span><a href="callpaper.html">Call for Paper</a></span> | <span><a href="committee.html">Program Committee</a></span> | <span><a href="http://www.discovertasmania.com/">About Tasmania</a></span> | <span><a href="signup.html">Sign Up</a></span> | <span><a href="signin.html">Sign In</a></span></div>
</div>
<div id="sidebar"><div class="padding">
<div class="header3">Sponsors:</div><br /><a href="http://www.google.com"><img border="0" src="images/google-logo.jpg" width="105" height="75"></a><br /><a href="http://www.utas.edu.au"><img border="0" src="images/utas-logo.gif" width="90" height="75"></a><br />
<div class="header3">Important Dates</div>
<p class="sidetext">- Paper submission:June 30, 2009<br />
- Notification: August 18, 2009<br />
- Camera-ready: September 8, 2009<br />
- Conference: December 4 ~ 8, 2009</p><br /><br /></div></div>
<div id="mainbody">
<div class="header1">Welcome to AI 2009</div>
<div class="form-container">
<form action="">
<fieldset>
<legend>Tell us about yourself:</legend>
<div><label for="firstName" >First Name:</label> <input id="firstName" type="text" name="firstName" value="" /></div>
<div><label for="lastName">Last Name:</label> <input id="lastName" type="text" name="lastName" value="" /></div>
<div class="controlset">
<span class="label">Gender</span>
<input name="radio1" id="male" value="1" type="radio" /> <label for="male">Male</label>
<input name="radio1" id="female" value="1" type="radio" /> <label for="female">Female</label></div>
<div><label for="birthMonth">Birthday</label>
<input id="birthDay" type="text" name="firstName" size=3 />
<select id="type">
<option>January</option>
<option>Febuary</option>
</select>
<input id="birthYear" type="text" name="birthYear" size=3 />
</div>
<div><label for="home">I live in:</label>
<select id="home">
<option>Australia</option>
<option>Jamacia</option>
</select></div>
<div><label for="postCode" >Postal Code:</label> <input id="postCode" type="text" name="postCode" value="" /></div>
<div><label for="affiliate" >Affiliate:</label> <input id="affiliate" type="text" name="affiliate" value="" /></div>
</fieldset>
<fieldset>
<legend>Select an ID and password:</legend>
<div><label for="id">User ID:</label> <input id="id" type="text" size="20" /></div>
<div><label for="password">Password:</label> <input id="password" type="password" size="20" /></div>
<div><label for="repassword"">Re-type password:</label> <input id="repassword" type="password" name="repassword" value=""size="20" /></div>
</fieldset>
<fieldset>
<legend>In case you forget your ID or password:</legend>
<div><label for="email">Alternative e-mail:</label> <input id="email" type="text" size="20" /></div>
<div><label for="secQuestion">Security Question:</label>
<select id="secQuestion">
<option>Where did you meet your spouse?</option>
<option>What was the name of your first school?</option>
</select></div>
<div><label for="answer" >Your answer:</label> <input id="answer" type="text" name="answer" value="" /></div><br />
<div><input type="button" value="Create my account"><input type="button" value="Cancel"></div>
</fieldset>
</form>
</div>
<br />
</div>
<div id="footer">Contact: Program Chair (ai09@utas.edu.au)<br />
Australasian Joint Conference on AI©2007-2008 <br />
All Right Reserved </div>
</div>
</body>
</html>
It's not finished, but I thought I might as well get this Javascript bit out of the way before I go any further.
Could someone please show me what I need to do to make sure all the elements are unique?
Thanks.
13 Aug, 2008 - 11:11 PM
| 