| | |
Validate dropdown and some other
Please support our JavaScript / DHTML / AJAX advertiser: PostgreSQL or MySQL? Compare and contrast the two most popular open source databases
Thread Solved |
•
•
Join Date: Jun 2008
Posts: 8
Reputation:
Solved Threads: 0
Hi all again
I'm very very new to javascript, post a help here on validate radio button got solve with the alert msg but still waiting for the solution on selecting either M or F.
My next problem is validate dropdown menu, my default is select, i want the user to select a rating from 1 to 10 before they can submit. tried alot of matter but it still fail me so can any wan add in the function for me thk's.
And im ask to send the data to my email after they submit but i hav no ideal no to go about , can show me how's it done ??
<html>
<head><title> Kelvin's Guestbook </title>
<style>
H1, H2, H3, H4, H5, H6 {color:#D4A017; text-align:center}
</style>
<script language="Javascript" type="text/javascript">
function validate_length(field)
{
with(field)
{
if (value.length == 0)
{
alert("Pls Enter Your Name!"); return false;
}else return true;
}
}
function validate_email(field)
{
with (field)
{
apos=value.indexOf("@");
dotpos=value.lastIndexOf(".");
if (apos<1||dotpos-apos<2)
{
alert("Not a valid e-mail address!"); return false;
}else return true;
}
}
function validate_gender(gM, gF)
{
if (gM.checked)
{
return true;
}
if (gF.checked)
{
return true;
}
alert("Pls Select Your Gender");
return false;
}
function validate_form(thisform)
{
with (thisform)
{
if (validate_length(yourname) == false)
{
yourname.focus(); return false;
}
if (validate_email(email)==false || validate_email(email)==false)
{
email.focus(); return false;
}
if (validate_gender(genderM, genderF) == false)
{
genderM.focus(); return false;
}
}
}
function startclock()
{
var thetime=new Date();
var nhours=thetime.getHours();
var nmins=thetime.getMinutes();
var nsecn=thetime.getSeconds();
var nday=thetime.getDay();
var nmonth=thetime.getMonth();
var ntoday=thetime.getDate();
var nyear=thetime.getYear();
var AorP=" ";
if (nhours>=12)
AorP="P.M.";
else
AorP="A.M.";
if (nhours>=13)
nhours-=12;
if (nhours==0)
nhours=12;
if (nsecn<10)
nsecn="0"+nsecn;
if (nmins<10)
nmins="0"+nmins;
if (nday==0)
nday="Sunday";
if (nday==1)
nday="Monday";
if (nday==2)
nday="Tuesday";
if (nday==3)
nday="Wednesday";
if (nday==4)
nday="Thursday";
if (nday==5)
nday="Friday";
if (nday==6)
nday="Saturday";
nmonth+=1;
if (nyear<=99)
nyear= "19"+nyear;
if ((nyear>99) && (nyear<2000))
nyear+=1900;
document.clockform.clockspot.value
=nhours+": "+nmins+": "+nsecn+" "+AorP+" "+nmonth+"/"+ntoday+"/"+nyear+","+nday;
setTimeout('startclock()',1000);
}
</script>
</head>
<body>
<h1>Welcome to my GuestBook</h1>
<CENTER>
<IMG SRC="Icon 1.gif" WIDTH="1000px">
</CENTER>
<FORM name="clockform">
<p align="right">
Current Time:
<br><INPUT TYPE="text" name="clockspot" size="32">
</p>
</FORM>
<SCRIPT language="JavaScript">
startclock();
</SCRIPT>
<Center>
<form name="guestbook" action="1.html"onsubmit="return validate_form(this);"
method="post">
<br>Name : <input type="text" name="yourname" value="">
<br>Email: <input type="text" name="email" size="30">
<br>Gender: <input type="radio" name="genderM" value="Male" id="Male">Male
<input type="radio" name="genderF" value="Female" id="Female">Female
<br>My Website Rating:
<select name="Number">
<option value="selected">SELECT</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>
</select>
<br>Comments: *Optional
<br><textarea cols="50" rows="8" name="Coments"></textarea>
<br><input type="submit" name="submit" value="Sign GuestBook">
<input type="Reset" name="Reset" value="Reset">
</form>
</Center>
</body>
</html>
I'm very very new to javascript, post a help here on validate radio button got solve with the alert msg but still waiting for the solution on selecting either M or F.
My next problem is validate dropdown menu, my default is select, i want the user to select a rating from 1 to 10 before they can submit. tried alot of matter but it still fail me so can any wan add in the function for me thk's.
And im ask to send the data to my email after they submit but i hav no ideal no to go about , can show me how's it done ??
<html>
<head><title> Kelvin's Guestbook </title>
<style>
H1, H2, H3, H4, H5, H6 {color:#D4A017; text-align:center}
</style>
<script language="Javascript" type="text/javascript">
function validate_length(field)
{
with(field)
{
if (value.length == 0)
{
alert("Pls Enter Your Name!"); return false;
}else return true;
}
}
function validate_email(field)
{
with (field)
{
apos=value.indexOf("@");
dotpos=value.lastIndexOf(".");
if (apos<1||dotpos-apos<2)
{
alert("Not a valid e-mail address!"); return false;
}else return true;
}
}
function validate_gender(gM, gF)
{
if (gM.checked)
{
return true;
}
if (gF.checked)
{
return true;
}
alert("Pls Select Your Gender");
return false;
}
function validate_form(thisform)
{
with (thisform)
{
if (validate_length(yourname) == false)
{
yourname.focus(); return false;
}
if (validate_email(email)==false || validate_email(email)==false)
{
email.focus(); return false;
}
if (validate_gender(genderM, genderF) == false)
{
genderM.focus(); return false;
}
}
}
function startclock()
{
var thetime=new Date();
var nhours=thetime.getHours();
var nmins=thetime.getMinutes();
var nsecn=thetime.getSeconds();
var nday=thetime.getDay();
var nmonth=thetime.getMonth();
var ntoday=thetime.getDate();
var nyear=thetime.getYear();
var AorP=" ";
if (nhours>=12)
AorP="P.M.";
else
AorP="A.M.";
if (nhours>=13)
nhours-=12;
if (nhours==0)
nhours=12;
if (nsecn<10)
nsecn="0"+nsecn;
if (nmins<10)
nmins="0"+nmins;
if (nday==0)
nday="Sunday";
if (nday==1)
nday="Monday";
if (nday==2)
nday="Tuesday";
if (nday==3)
nday="Wednesday";
if (nday==4)
nday="Thursday";
if (nday==5)
nday="Friday";
if (nday==6)
nday="Saturday";
nmonth+=1;
if (nyear<=99)
nyear= "19"+nyear;
if ((nyear>99) && (nyear<2000))
nyear+=1900;
document.clockform.clockspot.value
=nhours+": "+nmins+": "+nsecn+" "+AorP+" "+nmonth+"/"+ntoday+"/"+nyear+","+nday;
setTimeout('startclock()',1000);
}
</script>
</head>
<body>
<h1>Welcome to my GuestBook</h1>
<CENTER>
<IMG SRC="Icon 1.gif" WIDTH="1000px">
</CENTER>
<FORM name="clockform">
<p align="right">
Current Time:
<br><INPUT TYPE="text" name="clockspot" size="32">
</p>
</FORM>
<SCRIPT language="JavaScript">
startclock();
</SCRIPT>
<Center>
<form name="guestbook" action="1.html"onsubmit="return validate_form(this);"
method="post">
<br>Name : <input type="text" name="yourname" value="">
<br>Email: <input type="text" name="email" size="30">
<br>Gender: <input type="radio" name="genderM" value="Male" id="Male">Male
<input type="radio" name="genderF" value="Female" id="Female">Female
<br>My Website Rating:
<select name="Number">
<option value="selected">SELECT</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>
</select>
<br>Comments: *Optional
<br><textarea cols="50" rows="8" name="Coments"></textarea>
<br><input type="submit" name="submit" value="Sign GuestBook">
<input type="Reset" name="Reset" value="Reset">
</form>
</Center>
</body>
</html>
For the radio button u need to group both radio buttons that means u gona have the same name for both of them u can change this line of code
to this
and then again u need to change ur script to this
<input type="radio" name="genderM" value="Male" id="Male">Male <input type="radio" name="genderF" value="Female" id="Female">Female
to this
<input type="radio" name="optGender" value="Male" id="Male">Male <input type="radio" name="optGender" value="Female" id="Female">Female
and then again u need to change ur script to this
function validate_gender()
{
var choice = false;
for(var x = 0; x < document.theNameOftheForm.optGender.length; x++)
{
if(document.theNameofTheform.optGender[x].checked == true)
choice = true;
}else{
alert("Pls Select Your Gender");
} Last edited by Traicey; Jun 27th, 2008 at 5:43 am.
Some people get so rich they lose all respect for humanity. That's how rich I want to be.
Oh I forgot...... for drop down list you need to change
this line of code
And to validate would be something like this
this line of code
<option value="selected">SELECT</option> to this <option value="0"SELECTED>SELECT</option> And to validate would be something like this
function validateRating(form)
{
var Rating = 1;
if (form.Number.selectedIndex == 0)
{
alert("Please select a rating");
Rating = 0;
}
if (Rating) {
form.submit();
}
} Last edited by Traicey; Jun 27th, 2008 at 5:45 am.
Some people get so rich they lose all respect for humanity. That's how rich I want to be.
![]() |
Similar Threads
- Select tag, making dropdown larger than tag (HTML and CSS)
- Processing array values (PHP)
- Bug? (DaniWeb Community Feedback)
- Hi,Need help on sql select statement structure (MS SQL)
- Custom Web Server Control That Validate Itself (ASP.NET)
Other Threads in the JavaScript / DHTML / AJAX Forum
- Previous Thread: change values of repeat region textfield
- Next Thread: Floting menu for Browser compatibility
| Thread Tools | Search this Thread |
ajax ajaxcode ajaxexample ajaxhelp ajaxjspservlets animate array automatically browser bug calendar captchaformproblem checkbox child class close codes cookies createrange() cursor date debugger dependent disablefirebug dom dropdown editor element embed engine events explorer ext file firefox form forms getselection google gxt hiddenvalue highlightedword hint html htmlform ie7 ie8 iframe images internet java javascript javascripthelp2020 jawascriptruntimeerror jquery jsf jsfile jsp jump libcurl maps masterpage math media microsoft object onmouseoutdivproblem onreadystatechange parent paypal pdf php player position post programming progressbar redirect regex runtime safari scriptlets scroll search security session shopping size software sql text textarea toggle unicode variables web website windowsxp wysiwyg \n





