Jus S's Profile

Recent activity

Subscribe to this feed

Jus S started following the problem "Help with Javascript Task - DOM" in World Wide Web.
Jus S started following the problem "Help with Javascript Task - DOM" in World Wide Web.
Jus S reported a problem in World Wide Web on July 07, 2008 11:53:

Help with Javascript Task - DOM
I am not very proficient in Javascript but I need to create a cross-browser (works in Firefox and MS IE) input screen that takes in a user’s information for an order via the following:

Full Name (text field)
Address (textarea)
Gender (radio button)
Date of birth (three dropdown lists – day, month, year)
“Send me newsletter” (checkbox)
Hidden total value for order (hidden field)
“Submit Order” button (button).

When the user is done inputting the info, I need to validate using the rules below:
At least 3 characters required in name
Must be over 18 years old
Gender must be selected

If validation passes, show the information in an alert box and write ‘Your order has been submitted’. Otherwise, alert the user with the appropriate validation error and set focus on the input field that failed validation.

I have a script that I've been working with all week and weekend and I am truly frustrated. My script is quite lengthy but if you would take a look and see where I'm going wrong I would truly appreciate it.

Jus

/* <html>
<head>
<title>Practice Script</title>
<3><radios></head>
<body>
<h2>Practice Script</h2>
<form name="form1">
<table>
<tr><td>Full Name:</td>
<td><input name="name" type="text" /></td></tr>
<tr><td>Address:</td>
<td><textarea name="address"></textarea></td></tr>
<tr><td>Gender:</td>
<td>
<input name="radioGroup" type="radio" value="first" />Male
<input name="radioGroup" type="radio" value="second" />Female
</td></tr>
<tr><td>Date of Birth:</td>
<td><select name="birthDate">
<option value="Day">Day</option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
<option value="6">6</option>
<option value="7">7</option>
<option value="8">8</option>
<option value="9">9</option>
<option value="10">10</option>
<option value="11">11</option>
<option value="12">12</option>
<option value="13">13</option>
<option value="14">14</option>
<option value="15">15</option>
<option value="16">16</option>
<option value="17">17</option>
<option value="18">18</option>
<option value="19">19</option>
<option value="20">20</option>
<option value="21">21</option>
<option value="22">22</option>
<option value="23">23</option>
<option value="24">24</option>
<option value="25">25</option>
<option value="26">26</option>
<option value="27">27</option>
<option value="28">28</option>
<option value="29">29</option>
<option value="30">30</option>
<option value="31">31</option>
</select>
<select name="birthMonth">
<option value="Month">Month</option>
<option value="0">January</option>
<option value="1">February</option>
<option value="2">March</option>
<option value="3">April</option>
<option value="4">May</option>
<option value="5">June</option>
<option value="6">July</option>
<option value="7">August</option>
<option value="8">September</option>
<option value="9">October</option>
<option value="10">November</option>
<option value="11">December</option>
</select>
<select name="birthYear">
<option value="Year">Year</option>
<option value="1951">1951</option>
<option value="1952">1952</option>
<option value="1953">1953</option>
<option value="1954">1954</option>
<option value="1955">1955</option>
<option value="1956">1956</option>
<option value="1957">1957</option>
<option value="1958">1958</option>
<option value="1959">1959</option>
<option value="1960">1960</option>
<option value="1961">1961</option>
<option value="1962">1962</option>
<option value="1963">1963</option>
<option value="1964">1964</option>
<option value="1965">1965</option>
<option value="1966">1966</option>
<option value="1967">1967</option>
<option value="1968">1968</option>
<option value="1969">1969</option>
<option value="1970">1970</option>
<option value="1971">1971</option>
<option value="1972">1972</option>
<option value="1973">1973</option>
<option value="1974">1974</option>
<option value="1975">1975</option>
<option value="1976">1976</option>
<option value="1977">1977</option>
<option value="1978">1978</option>
<option value="1979">1979</option>
<option value="1980">1980</option>
<option value="1981">1981</option>
<option value="1982">1982</option>
<option value="1983">1983</option>
<option value="1984">1984</option>
<option value="1985">1985</option>
<option value="1986">1986</option>
<option value="1987">1987</option>
<option value="1988">1988</option>
<option value="1989">1989</option>
<option value="1990">1990</option>
<option value="1991">1991</option>
<option value="1992">1992</option>
<option value="1993">1993</option>
<option value="1994">1994</option>
<option value="1995">1995</option>
<option value="1996">1996</option>
<option value="1997">1997</option>
<option value="1998">1998</option>
<option value="1999">1999</option>
<option value="2000">2000</option>
<option value="2001">2001</option>
<option value="2002">2002</option>
<option value="2003">2003</option>
<option value="2004">2004</option>
<option value="2005">2005</option>
<option value="2006">2006</option>
<option value="2007">2007</option>
<option value="2008">2008</option>
<option value="2009">2009</option>
<option value="2010">2010</option>
</select>
</td></tr>
<tr><td>Send me newsletter</td>
<td><input name="news" type="checkbox" value="yes" /></td></tr>
</table></form>
<form name="order">
<input type="hidden" value="order" />
</form>
<tr>
<td>

<input name="order_button" type="button" value="Submit Order" />
</td>
</tr>

</body>
</html> */
Jus S asked a question in World Wide Web on June 30, 2008 04:07:

What am I doing wrong? Event Object & Onkeypress
Hello all, I'm trying to create a script that has a dual purpose. The first is to create an input field that converts the value into upper case upon losing focus. The second shows the keys pressed using the following: event object for detecting the key, document.onkeypress to capture the event, and String.fromCharCode(Keycode) to convert the keycode obtained from the event back to a character. I accomplished the first goal but the second goal eludes me. Below is what I've been working with. What am I doing wrong?

var x = function () {
document.getElementById('field').value = document.getElementById('field').value.toUpperCase();
}
otherCase = x;
otherCase();

function DisplayKey (e) {
//which key has been pressed?
var keycode;
if (!e) var e = window.event;
else if (e.keyCode) keycode=e.keyCode;
else if (e.which) keycode=e.which;
character=String.fromCharCode(keycode)
// find the object for the destination paragraph
k = document.getElementById('keys')
document.onkeypress=DisplayKey(event);
// add the character to the paragraph
k.innerHTML += character;
}

Input Field:

Display pressed keys
Jus S marked one of Manny's replies in MyBlogLog as useful. Manny replied to the question "Javascript Anonymous Function".
Jus S marked one of Manny's replies in MyBlogLog as useful. Manny replied to the question "Javascript Anonymous Function".
A comment on the question "Javascript Anonymous Function" in MyBlogLog:

Manny, where does the anonymous function come in? Do I start it off like: – Jus S, on June 29, 2008 05:21
Jus S asked a question in MyBlogLog on June 29, 2008 04:43:

Javascript Anonymous Function
How do I use anonymous functions to create an input field that converts the values into uppercase upon losing focus?

Jus S's dashboard

About me

Recent activity