|
JavaScript - Help On How To Retain Form Dropdown Used Functions Like This Example
<?php
session_start(); include_once "../c-library/errorcheck.inc.php"; function viewForm($input,$errors){ //$array[] = $var; $num_days= array("1","2","3","4","5","6","7","8","9","10","11","12","13","14","15","16","17","18","19","20","21 ","22","23","24","25","26","27","28","29","30","31"); $num_months = array(1=>"Jan",2=>"Feb",3=>"Mar",4=>"Apr",5=>"May",6=>"Jun", 7=>"Jul",8=>"Aug",9=>"Sept",10=>"Oct",11=>"Nov",12=>"Dec" ); $gender = array("Male","Female"); ?> <!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"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Register</title> <script src="reload_vals.js" type="text/javascript"></script> <style media="all"> table{ table-layout:auto; width:auto;} th{ text-align:right;} td #err{ color:#FF0000; font-weight:bold;} </style> </head> <body> <form action="<?php echo $_SERVER['PHP_SELF']?>" method="post" > <h3><font face="Georgia" color="#000066" size="+2">Registeration</font></h3> <?php if (count($errors) > 0): echo "<p style='color:#ff0000'>*The following errors ocurred:</p>"; endif; ?> <table width="" border="1"> <tr> <th scope="row">Firstname:</th> <td><input name="fname" type="text" id="fname" size="28" value="<?php echo htmlentities($input['fname'])?>" /></td> <td id="err"><?php echo $errors['fname'] ?></td> </tr> <tr> <th scope="row">Lastname:</th> <td><input name="lname" type="text" id="lname" size="28" value="<?php echo htmlentities($input['lname'])?>" /></td> <td><?php echo $errors['lname'] ?></td> </tr> <tr> <th scope="row">Date of Birth:</th> <td> <select name="days" size="1" id ="days" > <option value='-------'>--Day--</option> <?php /* day starts here*/ (array)$num_days; foreach ($num_days as $day): printf("<option value=\"%s\" %s>%s</option>",$day,($days==$day ? "selected='selected'" : ""), $day); endforeach; /* day ends and months start here*/ ?> </select> <select name="" size="1" id =""> <?php /* month ends and starts here*/ ?> </select><select name="" size="1" id =""> <?php ?> </select> <br /><small style="text-align:center; color:#006600;">dd-mm-yyy</small> </td> <td><?php echo $errors['date'] ?></td> </tr> <tr> <th scope="row">Sex:</th> <td> <select name="" size="1" id =""> <?php /* Sex selection starts here;*/ /* Sex selection starts here; */ ?> </select></td> <td><?php echo $errors['sex'] ?></td> </tr> <tr> <th scope="row">Email:</th> <td><input name="email" type="text" id="email" size="28" value="<?php echo htmlentities($input['email']) ?>"/></td> <td><?php echo $errors['email'] ?></td> </tr> <tr> <th scope="row">Password:</th> <td><input name="password" type="password" id="password" size="28" value="<?php echo htmlentities($input['password']) ?>"/></td> <td><?php echo $errors['password'] ?></td> </tr> <tr> <th scope="row">Comfirm Password:</th> <td><input name="password2" type="password" id="password2" size="28" value="<?php echo htmlentities($input['password2']) ?>"/></td> <td> </td> </tr> <tr> <th scope="row"> </th> <td> </td> <td> </td> </tr> <tr> <th scope="row">I agree:</th> <td><input name="agree" type="checkbox" id="agree" value="<?php echo $input['agree']='agree'?>" /></td> <td><?php echo $errors['agree'] ?></td> </tr> <tr> <th scope="row"><input name="action" type="hidden" id="submitted" value="TRUE" /></th> <td><input name="add_newuser" type="submit" id="submit" value="I accept, Register me" /></td> <td> </td> </tr> </table> </form> </body> </html> <?php } function register_user($input){ include "../c-library/database.inc.php"; // $input = $_REQUEST; $input['fname'] = mysql_escape_string(stripslashes($input['fname'])); $input['lname'] = mysql_real_escape_string(stripslashes($input['lname'])); //$input['day'] $input['date'] = $input['year'].''.$input['month'].''.$input['day']; $input['sex'] = $input['sex']; $input['email'] = mysql_real_escape_string($input['email']); $input['password'] = mysql_real_escape_string(md5($input['password'])); $input['uid'] = uniqid(rand(16,32),true); $qr ="insert into users(id,Firstname,Lastname,Date_of_Birth,Sex,Email,Password,Userid) values('null','$input[fname]','$input[lname]','$input[date]','$input[sex]','$input[email]','$input[password]','$input[uid]')"; $results = mysql_query($qr,$sdayb); return $results; mysql_close($sdayb); echo "thanks";//header("Location: thankyou.html"); } /*ex. user enters - 19/11/1980 $var = explode('/', '19/11/1980'); $sdayd = $var[0]; $mm = $var[1]; $yyyy = $var[2]; */ if(isset($_POST['add_newuser'])): $inputs = $_POST; $setErrors = array(); if(!check_formerr($inputs, $setErrors)): viewForm($inputs, $setErrors); else: register_user($inputs); endif; else: viewForm(null, null); endif; ?> Similar TutorialsI would like to start off by saying I know there isn't a sure fire, 100% way to tell if javascript is enabled on a users browser. Because of this, it's a good idea to check form input using a php (or another server-side language) function. Now, let's say the user DOES have javascript enabled. I would like to check that same form input with a javascript function, instead of a php function. How would I be able to do that? If both php and javascript functions are in the same script, how does the browser know which one to run and how can I make it run the javascript function if the user has javascript enabled? Hi guys, I need some help here.. I have created a simple JS and HTML NAME form validation and checked box as shown (If anyone can help me about the check box a better and easy way to code would be great). I would like to use the functions that I have created - can anyone tell me HOW I can use them please? I tried to use like this.. Code: var name = document.getElementById('name').value;
if(name(!notEmpty && !isAlphabet)) {
error_mesg += "\nPlease enter your Name";
error_num++;
}
..but it does not work...anyone can give me some idea? Code: ..
..
<script type='text/javascript'>
function formValidation(){
var error_mesg = "Following error found\n";
var error_num = 0;
var name = document.getElementById('name').value;
if(name==""){
error_mesg += "\nPlease enter your Name";
error_num++;
}
var terms = !document.getElementById('terms').checked; //Can anyone tell me what is the function of "checked" here for?
if (terms){
error_mesg += "\nPlease check the terms and conditions";
error_num++;
}
if(error_num>0){
alert(error_mesg);
elem.focus();
return false;
}else{
//submit form
return true;
}
}
function notEmpty(elem, error_mesg){
if(elem.value.length == 0){
alert(error_mesg);
elem.focus(); // set the focus to this input
return false;
}
return true;
}
function isAlphabet(elem, error_mesg){
var alphaExp = /^[a-zA-Z]+$/;
if(elem.value.match(alphaExp)){
return true;
}else{
alert(error_mesg);
elem.focus();
return false;
}
}
..
..
[HTML FORM]
..
<form name="form" action="<?php echo $_SERVER['PHP_SELF'];?>" method="post" onsubmit="return formValidation()">
<tr align="left" valign="top>
<td width="20%">NAME:<font color="#CE0000" >*</font></td>
<td width="80%"><input name="name" type="text" id="name" size="30" /></td>
</tr>
<tr><td><input type=checkbox name=terms value='yes'>I agree to terms and conditions </td></tr>
..
..
<input type="hidden" name="action" value="register"/>
<input name="submit" type="submit" value="Proceed" />
when user clicks submit first it should check to see if a name from the dropdown has been selected then it should check to make sure all radio buttons were selected. code to check if a name was selected in the drop down. Code:
<script type="text/javascript">
window.onload=function(){
document.forms[0].onsubmit=function(){
return formValid(this);
}
}
function formValid(formObj){
var sel=formObj.getElementsByTagName('select');
var len=sel.length;
var msg = "You forgot to select your name"
var flg=false;
for(var i=0;i<len;i++){
if(sel[i].selectedIndex==0){
msg;
flg=true;
}
}
if(flg){
alert(msg);
return false;
}else{
return true;
}
}
</script>
<br><br>
<html>
code that checks to see if all radio buttons were selected. Code: function validateTest()
{
var focus_me = null;
var msg = "";
var form = document.forms[0];
for ( var game = 1; game <= 999999; ++game )
{
var rbg = form["game" + game];
if ( rbg == null ) break; // no more games
if ( ! rbg[0].checked && ! rbg[1].checked )
{
msg += rbg[0].value + " vs. " + rbg[1].value + "\n";
focus_me = focus_me || rbg[0];
}
}
if (msg != "")
{
var prefix = "\n WARNING: The following Games(s) were not selected:\n\n";
var suffix = "\nClick OK and select all games before clicking submit.\n\n";
alert(prefix + msg + suffix);
if (focus_me)
focus_me.focus();
return false;
} else{
return true;
}
}
Code: center> <INPUT TYPE=SUBMIT VALUE="submit" onClick="Validate(this.form, 'game1')"> </FORM> how can i add these two functions together so it validates both? use in form fields - onBlur="chkalpha(this)" function chknum(field) { var valid = "0123456789"; var ok = "yes"; var temp; for (var i=0; i<field.value.length && ok == "yes"; i++) { temp = "" + field.value.substring(i, i+1); if (valid.indexOf(temp) == "-1") { var ok = "no"; } } if (ok == "no") { alert("Invalid entry! Only numeric data is accepted!"); field.value=""; field.focus(); field.select(); } } function chkalpha(field) { var valid = "abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ "; var ok = "yes"; var temp; for (var i=0; i<field.value.length && ok == "yes"; i++) { temp = "" + field.value.substring(i, i+1); if (valid.indexOf(temp) == "-1") { var ok = "no"; } } if (ok == "no") { alert("Invalid entry! Only alphabetic data is accepted!"); field.value=""; field.focus(); field.select(); } } function chkalphanum(field) { var valid = "0123456789abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ@_-. "; var ok = "yes"; var temp; for (var i=0; i<field.value.length && ok == "yes"; i++) { temp = "" + field.value.substring(i, i+1); if (valid.indexOf(temp) == "-1") { var ok = "no"; } } if (ok == "no") { alert("Invalid entry! Only alphanumeric data is accepted!"); field.value=""; field.focus(); field.select(); } } I have been working on a JavaScript form with validation and I cant get it to work right. The form is supposed to validate the name, E-mail, Phone number, Password and confirmation, Drop-down selection, Question reply, yes and no radios, and 3 preferences check-boxes. It is also supposed to verify that the passwords match, not allow any letters or special characters in the phone number box, and remove the default text when a user clicks on the Name, E-mail, and Question reply boxes. I've been checking over the code for almost a month now and I can't figure out why it is not working. This is my entire code. [CODE] <!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"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Contact</title> <script type="text/javascript"> /* <![CDATA[ */ function onlyDigits(objtextbox) { var exp = /[^\d]/g; objtextbox.value = objtextbox.value.replace(exp,""); } function textdisappear(txt) { if (txt.value == txt.defaultValue) { txt.value = "" } function passmatch() { if (document.forms[0].psswrd2.value != document.forms[0].psswrd1.value) { window.alert("You did not enter the same password!"); document.forms[0].psswrd1.focus(); } function validate() { var name = document.form1.Name; var email = document.form1.Email; var phone = document.form1.Telephone; var question = document.form1.selection; var reply = document.form1.questionreply var word1 = document.form1.psswrd1 var word2 = document.form1.psswrd2 var chkradio = false; var chkbox = false; if (name.value == "") { window.alert("Name please."); name.focus(); return false; } if (email.value == "") { window.alert("E-mail is blank."); email.focus(); return false; } if (email.value.indexOf("@", 0) < 0) { window.alert("Enter valid e-mail please."); email.focus(); return false; } if (email.value.indexOf(".", 0) < 0) { window.alert("Enter valid e-mail please."); email.focus(); return false; } if ((phone.value == "")) { window.alert("Telephone number please."); phone.focus(); return false; } if (word1.value == "") { window.alert("Password please."); word1.focus(); return false; } if (word2.value == "") { window.alert("Re-type password please."); word2.focus(); return false; } if (question.selectedIndex < 1) { alert("Choose question please."); question.focus(); return false; } if (reply.value == "" || reply.value == "Question reply") { window.alert("Question reply please."); reply.focus(); return false; } for (var i=0; i<2; ++i) { if (document.form1.confirmreply.checked == true) { chkradio = true; break; } if (chkradio != true) { window.alert("Yes or no please."); confirmrelpy.focus(); return false; } for (var i=0; i<3; ++i) { if (document.form1.hobby.checked == true) { chkbox = true; break; } if (chkbox != true) { window.alert("Choose preference."); hobby.focus(); return false; } return true; } /* ]]> */ </script> </head> <body> <center><h1>Contact</h1></center> <form method="post" action="mailto:someemail@somedomain.com" name="form1" onsubmit="return validate();"> <h3>Your Details</h3> <p>Name:* <input type="text" name="Name" value="Enter Name" onfocus="textdisappear(this)" ></p> <p>E-mail:* <input type="text" name="Email" value="Enter E-mail" onfocus="textdisappear(this)" ></p> <p>Phone Number:* <input type="text" name="Telephone" onkeyup="onlyDigits(this)"><br> <br /> <h3>Password and Secret Question</h3> Password:<br /> <input type="password" name="psswrd1" value="" />*<br /> Confirm:<br /> <input type="password" name="psswrd2" value="" onblur="passmatch()" />*<br /> <p>Choose a question:*<br /> <select type="text" value="" name="selection"> <option> </option> <option>Where was your elementary school?</option> <option>Who was the first person you ever kissed?</option> <option>What was your first car?</option> <option>Who is your favorite author?</option> </select><br /> reply<br /> <input type="text" name="questionreply" value="Question reply" onfocus="textdisappear(this)" />*<br /> <h3>Offers</h3> Do you want any special offers sent to you?*<br /> Yes<input type="radio" name="confirmreply" value="Yes"/>No<input type="radio" name="confirmreply" value="No" /> <h3>Which preference do you have?*</h3> <input type="checkbox" name="hobby" value="check"/>Inside Activities<br /> <input type="checkbox" name="hobby" value="check"/>Outside Activities<br /> <input type="checkbox" name="hobby" value="check"/>Both<br /> <br /> <p><input type="submit" value="Submit" name="submit" /> <input type="reset" value="Reset" name="reset"></p> </form> </body> </html> [CODE] I am trying to do a custom add to cart to use with paypal and need to utilize javascript to achieve inserting some code or a weight value per the paypal forms' options choice. Here is my dilemma, All of my items have multiple weights, for instance the below example called Aqua Max 100 comes in .5lbs, 1.5lbs., 10lbs., 20lbs., and 50lbs. Paypal allows you to enter weight but it's one weight per item and I would have to create 5 Paypal buttons just for this one item to calculate the different weights per zip code. I need help making javascript insert the following code within the paypal forms' code upon option select before clicking submit? <input type="hidden" name="weight" value=".5"> <input type="hidden" name="weight_unit" value="lbs"> <input type="hidden" name="weight" value="1.5"> <input type="hidden" name="weight_unit" value="lbs"> <input type="hidden" name="weight" value="10 <input type="hidden" name="weight_unit" value="lbs"> <input type="hidden" name="weight" value="20 <input type="hidden" name="weight_unit" value="lbs"> <input type="hidden" name="weight" value="50 <input type="hidden" name="weight_unit" value="lbs"> The code I came up with is wrong as I'm getting an error but I was originally trying to make it enter a weight using a hidden fillable number and without any real javascript training, just alot of googling but I think I'm pretty close. Please take a look at the code I've came up with so far and maybe point me in the correct direction: <html> <body> <form target="paypal" action="https://www.paypal.com/cgi-bin/webscr" method="post"> <input type="hidden" name="cmd" value="_cart"> <input type="hidden" name="business" value="test@test.com"> <input type="hidden" name="currency_code" value="USD"> <input type='hidden'text' name='amt' id='amt' value="0.00"/> <table> <tr> <td> <input type="text" name="on0" value="Aqua Max 100">Aqua Max 100</td></tr> <tr><td> <select name="os0" onChange="getamt()"> <option value="select">Please Select</option> <option value="1/2 lb.">1/2 lb. $3.99 USD</option> <option value="1 - 1/2 lbs">1 - 1/2 lbs $7.59 USD</option> <option value="10 lbs.">10 lbs. $25.80 USD</option> <option value="20 lbs.">20 lbs. $42.75 USD</option> <option value="50 lbs.">50 lbs. $86.20 USD</option> </select></td></tr> </table> <script type="text/javascript"> function getamt() { var sh=0; var choice = document.getElementById("os0").selectedIndex; if (choice == 0) { sh=0; } if (choice == 1) { sh=.5; } if (choice == 2) { sh=1.5; } if (choice == 3) { sh=10; } if (choice == 4) { sh=20 } if (choice == 5) { sh=50.00; } document.getElementById("on0").value=sh; } </script> <input type="image" src="https://images.paypal.com/images/sc-but-03.gif" border="0" name="submit" alt="PayPal - The safer, easier way to pay online!" /> <img alt="" border="0" src="https://www.paypalobjects.com/en_US/i/scr/pixel.gif" width="1" height="1"> </form> </body> </html> Ill tell you the story and then simplify it ok i have a computer site that you can build your own computer and whatnot but i just recently thought about how not everyone knows which parts are needed in a computer... my first design of the site had the name of the part in the select box as default but now i removed the name of each part outside of the select boxes but the problem now is i need some type of onLoad event to happen when the page loads to call out the functions that are associated with the selected boxes...... i have 2 fuctions in an external js file Code: function swapImage(sel,id){
document.getElementById(id).src = sel.value.split('#')[1];
}
and Code: function Calculate(){
var a = parseFloat(document.comp.caseselect.value.split('#')[0]);
var b = parseFloat(document.comp.powersupply.value.split('#')[0]);
var sum = a+b;
document.getElementById("total").innerHTML = '$'+sum;
}
when someone selects an item it adds the price to the price of other selected items and shows the total price elsewhere on the page... also shows a picture of the selected item on the page.. im just going to show the first select box to show you how all my select boxes are written Code: <p align="left">CASE</p> <center> <select name="caseselect" style="width:625px" onchange="Calculate(); swapImage(this,'caseimg');"> <option value="50#COOLER MASTER Elite 310red.jpg" selected="1">COOLER MASTER Elite 310 Red ($50.00)</option> <option value="50#COOLER MASTER Elite 310blue.jpg">COOLER MASTER Elite 310 Blue ($50.00)</option> <option value="50#COOLER MASTER Elite 310orange.jpg">COOLER MASTER Elite 310 Orange ($50.00)</option> <option value="50#COOLER MASTER Elite 310silver.jpg">COOLER MASTER Elite 310 Silver ($50.00)</option> </select> *not that it matters but yes there is an ending center in my html but its at the end of the group the image is sent here Code: <img src="start.jpg" id="caseimg" /> and the price is sent here Code: <span style="color:black; font-size:20pt">YOUR PRICE UPDATE</span><br /> <span id="total" style="color:white; font-size:32pt">$0 Nothing Selected</span> code works perfectly fine ONCE YOU SELECT SOMETHING ELSE but i need it to work when the page loads I'm using a plugin in Wordpress that checks for mobile browsers and sets a variable to "true" if a mobile browser is being used. I have a script I want to use on the same page where I'd like to use that variable rather than have to redo the check again. Is it possible to make a variable in one script global so that it can be used in a separate script on the same page? Greatly simplified, I mean ... Code: <script type="text/javascript"> var A = 1; </script> <script type="text/javascript"> Do something with A; </script> Hello ,,, I have a a php form where there a drop down list and a text box which is show and hide based on drop down list select value. This part work perfectly with js Code: <script type="text/javascript">
function showfield(name){
if(name != 'High School')
document.getElementById('div1').style.display="block";
else
document.getElementById('div1').style.display="none";
}
function hidefield() {
document.getElementById('div1').style.display='none';
}
<script>
<body onload = "hidefield()">
<select name="education" size="1" class="text" id="education" onchange="showfield(this.options[this.selectedIndex].value)">
The problem is when I click submit and the validation appear the div also hide ,,, I want to retain the style of the div after submit to be as it was before submit... meaning if it was appearing then it should still appear after submit coz there is validation on it as well. Hope I can found an answer coz Im trying since a week I probably have gone about this all wrong since I am a complete noobe, but if someone could point me in the right direction I would be very thankful. Here is the situation. What works: I have a drop menu that is being generated by a PHP/MYSQL script, when you choose an option the onchange event is triggered and runs a function that sends the value to a php script so a graphical image can be generated and saved with a random file name. The randomly generated image name is sent back as an XML response and then image is displayed with src The Problem: I need to be able to have a function store the value from the onchange event and run again when the page refreshes. As of right now, when the page refreshes the image is gone. I have attempted to do this with cookies, but not exactly sure how I will do this and I have finally decided to ask for help. I hope my explanation is not confusing, please let me know if you need more info or if you need to see my code. Ok, came up with a work around to my previous problem, however I now have a result that I cannot explain. Here is the code: Code: <FORM NAME="Calc">
<TABLE BORDER=4>
<TR>
<TD>
<INPUT TYPE="text" onkeydown="if (event.keyCode == 13) {Calc.Input.value = eval(Calc.Input.value)}" NAME="Input" Size="26">
<br>
</TD>
</TR>
<TR>
<TD>
<INPUT TYPE="button" NAME="one" VALUE=" 1 " OnClick="Calc.Input.value += '1'">
<INPUT TYPE="button" NAME="two" VALUE=" 2 " OnCLick="Calc.Input.value += '2'">
<INPUT TYPE="button" NAME="three" VALUE=" 3 " OnClick="Calc.Input.value += '3'">
<INPUT TYPE="button" NAME="plus" VALUE=" + " OnClick="Calc.Input.value += ' + '">
<br>
<INPUT TYPE="button" NAME="four" VALUE=" 4 " OnClick="Calc.Input.value += '4'">
<INPUT TYPE="button" NAME="five" VALUE=" 5 " OnCLick="Calc.Input.value += '5'">
<INPUT TYPE="button" NAME="six" VALUE=" 6 " OnClick="Calc.Input.value += '6'">
<INPUT TYPE="button" NAME="minus" VALUE=" - " OnClick="Calc.Input.value += ' - '">
<br>
<INPUT TYPE="button" NAME="seven" VALUE=" 7 " OnClick="Calc.Input.value += '7'">
<INPUT TYPE="button" NAME="eight" VALUE=" 8 " OnCLick="Calc.Input.value += '8'">
<INPUT TYPE="button" NAME="nine" VALUE=" 9 " OnClick="Calc.Input.value += '9'">
<INPUT TYPE="button" NAME="times" VALUE=" x " OnClick="Calc.Input.value += ' * '">
<br>
<INPUT TYPE="button" NAME="clear" VALUE=" C " OnClick="Calc.Input.value = ''">
<INPUT TYPE="button" NAME="zero" VALUE=" 0 " OnClick="Calc.Input.value += '0'">
<INPUT TYPE="button" NAME="DoIt" VALUE=" = " OnClick="Calc.Input.value = eval(Calc.Input.value)">
<INPUT TYPE="button" NAME="div" VALUE=" / " OnClick="Calc.Input.value += ' / '">
<br>
</TD>
</TR>
</TABLE>
</FORM>
In order to get the 'Enter' button to function the same as pressing the '=' button, I added the keyCode event. Now my problem is that when you press the 'Enter' key, the result is displayed int the 'Input' text field briefly and then is cleared. How can I keep the result static in the text box? Hey, Were I am stuck is with the jquery I have a form that is done in a form class and when an option is selected from the dynamically populated drop down menu I would like it to fill in the text boxes so they can be edited. I currently have: getfeed.php - the page that is connected to the javascript Code: <?php
include('class/class.form.php');
include('class/class.users.php');
$iID = trim($_GET['extension']);
if(!$iID) die('No User Data found.');
$getValues = new Extension();
$user_info = $getValues->getUsersInformation($iID);
$sip_info = $getValues->getSipInformation($iID);
//print_r($user_info);
//print_r($sip_info);
$array = $getValues->getUsersInformation($iID);
echo '<br /><br />-- end of query --';
The Javascript Code:
if(document.id('LoadExtension') && document.id('ExtensionResponse')) { // id of select box
var sel = document.id('LoadExtension'); // ser select box as var.
sel.addEvent('change', function(chg) { // add change event to select box.
if(sel.getSelected().get('value') != '') { // on change if selected value is not empty.
new Request.HTML({
url : 'http://Domain.co.nz/Air/includes/getFeed.php?extension='+ sel.getSelected().get('value'),
onRequest: function() {
document.id('ExtensionResponse').set('html', 'loading...');
},
onComplete: function(r1, r2, html, js) {
document.id('ExtensionResponse').set('html', html);
}
}).send();
}
});
}
At the moment it does not load any data(I somehow need to get the $iID sent from the index.php but the drop down menu is a count array would I take it from this?) and is in a separate div below the form. Hi Everyone, I'm encountering errors with a form I have created. I feel confident that the issue is with my JS validation form because when I allow the form to submit without validating any of the fields, my php processor correctly uploads all the content into my database (but, I will need the form validation to prevent the user from skipping fields). The issue (I believe) is with IE. In IE, both drop-downs seem to populate correctly but when I submit the form, I get a prompt to make a selection for the first drop-down menu. The form does submit properly in FireFox and Safari but with some testing I noticed that I was getting a prompt to make a selection in the first drop-down in instances where a selection was already made but I just had not yet populated the second country/state drop-down. Still, in Firefox and Safari, the form does pass validation upon submit.. So, I am hoping it's just IE specific issue. I'm thinking the issue is with IE not recognizing my selection. The form had a drop-down menu where the user selects a letter, then that selection triggers (in JS using a function to process the selection) another drop-down to populate with all the countries or states that begin with the letter from the first selection. Here is the code from my form: Code: <p><span class="title">Sign Up</span></p>
<br />
<form id = "signupForm" action="signup_process.php" method = "post" onsubmit="return validateSignupForm();">
<p>All required fields are marked with ( <span class = "requiredStar">*</span> )</p>
<br />
<p><label for="first_name">First Name: <span class = "requiredStar">*</span></label></p>
<div class = "contactRight"><input type="text" name="first_name" id="first_name" style="height: 20px;" size="30" tabindex="1" maxlength="30" /></div>
<br />
<p><label for="last_name">Last Name: <span class = "requiredStar">*</span></label></p>
<div class = "contactRight"><input type="text" name="last_name" id="last_name" style="height: 20px;" size="30" tabindex="2" maxlength="30" /></div>
<br />
<p><label for="countryLtr">Select the first letter of your country: <span class = "requiredStar">*</span></label></p>
<select id="countryLtr" name="countryLtr" id="countryLtr" size="1" tabindex="3" onchange="processSelection()">
<option value=""></option>
<option value="USA">USA</option>
<option value="A">A</option>
<option value="B">B</option>
<option value="C">C</option>
<option value="D">D</option>
<option value="E">E</option>
<option value="F">F</option>
<option value="G">G</option>
<option value="H">H</option>
<option value="I">I</option>
<option value="J">J</option>
<option value="K">K</option>
<option value="L">L</option>
<option value="M">M</option>
<option value="N">N</option>
<option value="O">O</option>
<option value="P">P</option>
<option value="Q">Q</option>
<option value="R">R</option>
<option value="S">S</option>
<option value="T">T</option>
<option value="U">U</option>
<option value="V">V</option>
<option value="W">W</option>
<option value="Y">Y</option>
<option value="Z">Z</option>
</select>
<br />
<br />
<p><label for="countryState">Select your country/ state (if USA): <span class = "requiredStar">*</span></label></p>
<select id="countryState" name="countryState" id="countryState" size="1" tabindex="4">
</select>
<br />
<br />
<p><label for="username">Create a username: <span class = "requiredStar">*</span></label></p>
<div class = "contactRight"><input type="text" name="username" id="username" style="height: 20px;" size="30" tabindex="5" maxlength="30" /></div>
<br />
<p><label for="email">Email: <span class = "requiredStar">*</span></label></p>
<div class = "contactRight"><input type="text" name="email" id="email" style="height: 20px;" size="30" tabindex="6" maxlength="30" /></div>
<br />
<p><label for="password">Create a password: <span class = "requiredStar">*</span></label></p>
<div class = "contactRight"><input type="password" name="password" id="password" style="height: 20px;" size="30" tabindex="7" maxlength="30" /></div>
<br />
<br />
<input type="hidden" name="source" value="12345">
<input type="image" name="submit" value="Submit" class="submitButton" src="images/submit-button.png" />
<input type="image" name="reset" value="Reset" class="resetButton" src="images/reset-button.png" />
<br />
</form>
and here is the code for processing the selection of the first drop-down and populating the second drop-down (I reduced the number of options for the countries to save on characters for this post): Code: function processSelection() {
choice1 = document.getElementById("countryLtr");
choice2 = document.getElementById("countryState");
choice2.length = 0;
if (choice1.value == "USA") {
choice2[choice2.length] = new Option("");
choice2[choice2.length] = new Option("Alaska");
choice2[choice2.length] = new Option("American Samoa");
choice2[choice2.length] = new Option("Arizona");
choice2[choice2.length] = new Option("Arkansas");
choice2[choice2.length] = new Option("California");
choice2[choice2.length] = new Option("Colorado");
choice2[choice2.length] = new Option("Connecticut");
choice2[choice2.length] = new Option("Delaware");
choice2[choice2.length] = new Option("District of Columbia");
choice2[choice2.length] = new Option("Florida");
choice2[choice2.length] = new Option("Georgia");
choice2[choice2.length] = new Option("Guam");
choice2[choice2.length] = new Option("Hawaii");
choice2[choice2.length] = new Option("Idaho");
choice2[choice2.length] = new Option("Illinois");
choice2[choice2.length] = new Option("Indiana");
choice2[choice2.length] = new Option("Iowa");
choice2[choice2.length] = new Option("Kansas");
choice2[choice2.length] = new Option("Kentucky");
choice2[choice2.length] = new Option("Louisiana");
choice2[choice2.length] = new Option("Maine");
choice2[choice2.length] = new Option("Maryland");
choice2[choice2.length] = new Option("Massachusetts");
choice2[choice2.length] = new Option("Michigan");
choice2[choice2.length] = new Option("Minnesota");
choice2[choice2.length] = new Option("Mississippi");
choice2[choice2.length] = new Option("Missouri");
choice2[choice2.length] = new Option("Montana");
choice2[choice2.length] = new Option("Nebraska");
choice2[choice2.length] = new Option("Nevada");
choice2[choice2.length] = new Option("New Hampshire");
choice2[choice2.length] = new Option("New Jersey");
choice2[choice2.length] = new Option("New Mexico");
choice2[choice2.length] = new Option("New York");
choice2[choice2.length] = new Option("North Carolina");
choice2[choice2.length] = new Option("North Dakota");
choice2[choice2.length] = new Option("Northern Marianas Islands");
choice2[choice2.length] = new Option("Ohio");
choice2[choice2.length] = new Option("Oklahoma");
choice2[choice2.length] = new Option("Oregon");
choice2[choice2.length] = new Option("Pennsylvania");
choice2[choice2.length] = new Option("Puerto Rico");
choice2[choice2.length] = new Option("Rhode Island");
choice2[choice2.length] = new Option("South Carolina");
choice2[choice2.length] = new Option("South Dakota");
choice2[choice2.length] = new Option("Tennessee");
choice2[choice2.length] = new Option("Texas");
choice2[choice2.length] = new Option("Utah");
choice2[choice2.length] = new Option("Vermont");
choice2[choice2.length] = new Option("Virginia");
choice2[choice2.length] = new Option("Virgin Islands");
choice2[choice2.length] = new Option("Washington");
choice2[choice2.length] = new Option("West Virginia");
choice2[choice2.length] = new Option("Wisconsin");
choice2[choice2.length] = new Option("Wyoming");
} else if (choice1.value == "A") {
choice2[choice2.length] = new Option("");
choice2[choice2.length] = new Option("Azerbaijan");
} else if (choice1.value == "B") {
choice2[choice2.length] = new Option("");
choice2[choice2.length] = new Option("The Bahamas");
} else if (choice1.value == "C") {
choice2[choice2.length] = new Option("");
choice2[choice2.length] = new Option("Czech Republic");
} else if (choice1.value == "D") {
choice2[choice2.length] = new Option("");
choice2[choice2.length] = new Option("Denmark");
} else if (choice1.value == "E") {
choice2[choice2.length] = new Option("");
choice2[choice2.length] = new Option("Ecuador");
} else if (choice1.value == "G") {
choice2[choice2.length] = new Option("");
choice2[choice2.length] = new Option("Gabon");
} else if (choice1.value == "H") {
choice2[choice2.length] = new Option("");
choice2[choice2.length] = new Option("Haiti");
} else if (choice1.value == "I") {
choice2[choice2.length] = new Option("");
choice2[choice2.length] = new Option("Iceland");
} else if (choice1.value == "J") {
choice2[choice2.length] = new Option("");
choice2[choice2.length] = new Option("Jamaica");
} else if (choice1.value == "K") {
choice2[choice2.length] = new Option("");
choice2[choice2.length] = new Option("Kazakhstan");
} else if (choice1.value == "L") {
choice2[choice2.length] = new Option("");
choice2[choice2.length] = new Option("Laos");
} else if (choice1.value == "M") {
choice2[choice2.length] = new Option("");
choice2[choice2.length] = new Option("Macau");
} else if (choice1.value == "N") {
choice2[choice2.length] = new Option("");
choice2[choice2.length] = new Option("Namibia");
} else if (choice1.value == "O") {
choice2[choice2.length] = new Option("");
choice2[choice2.length] = new Option("Oman");
} else if (choice1.value == "P") {
choice2[choice2.length] = new Option("");
choice2[choice2.length] = new Option("Pakistan");
} else if (choice1.value == "Q") {
choice2[choice2.length] = new Option("");
choice2[choice2.length] = new Option("Qatar");
} else if (choice1.value == "R") {
choice2[choice2.length] = new Option("");
choice2[choice2.length] = new Option("Reunion");
} else if (choice1.value == "S") {
choice2[choice2.length] = new Option("");
choice2[choice2.length] = new Option("Saint Helena");
} else if (choice1.value == "T") {
choice2[choice2.length] = new Option("");
choice2[choice2.length] = new Option("Taiwan");
} else if (choice1.value == "U") {
choice2[choice2.length] = new Option("");
choice2[choice2.length] = new Option("Uganda");
} else if (choice1.value == "V") {
choice2[choice2.length] = new Option("");
choice2[choice2.length] = new Option("Vanuatu");
} else if (choice1.value == "W") {
choice2[choice2.length] = new Option("");
choice2[choice2.length] = new Option("Wake Island");
} else if (choice1.value == "Y") {
choice2[choice2.length] = new Option("");
choice2[choice2.length] = new Option("Yemen");
} else if (choice1.value == "Z") {
choice2[choice2.length] = new Option("");
choice2[choice2.length] = new Option("Zambia");
}
}
Here is the code for validating the form upon submission: Code:
function validateRequestForm() {
var theForm = document.getElementById("requestForm"); //form reference
var valid = true; //flag, must be true to proceed
if (theForm.name.value == "") {
alert ("Please enter a name");
valid = false;
theForm.username.focus();
} else if (theForm.countryLtr.value == "") {
alert ("Please select the first letter of your country");
valid = false;
theForm.countryLtr.focus();
} else if (theForm.countryState.value == "") {
alert ("Please select your country. If USA, please select your state");
valid = false;
theForm.countryState.focus();
} else if (theForm.email.value == "") {
alert ("Please enter your email address");
valid = false;
theForm.email.focus();
} else if (theForm.title.value == "") {
alert ("Please enter a title for your request");
valid = false;
theForm.title.focus();
} else if (theForm.request.value == "") {
alert ("Please enter your request");
valid = false;
theForm.request.focus();
} if (valid == true) {
alert ("Thank you for your prayer request. Your request has been submitted for review. Please check your account to see the status of your prayer request. You may also check recent requests to view your request after it has been posted.");
return true; //submit form
} else {
return false; //form invalid
}
}
I'm totally stumped as to what could be going on in IE that is not allowing the form to pass JS validation.. Any help would be greatly appreciated!! Thanks! Hello Again everyone. For the life of me I cannot get a handel on how to access a Form Drop Down menu. I have tried many different codes and tried re-writing my own code in different ways but for reason I am unsure of my VAR myselect will not hold the value of document.getElementById(pathPicking) Below is my current code I am using but first I have tried these different vaients and I ether get nothing printed to teh screen or it will say null. Code: <button type="button" onclick="showme();">Lets test this out</button>
*
*
*
var myselect=document.getElementById("pathPicking");
The Code above was a different way i wrote my code (when I wasn't passing anything too the showme function) Code: <html>
<body>
<form id="aform">
<select id="pathPicking" size="1">
<option value="nothing" selected="selected">Select a location</option>
<option value="\\\\mycomputer">\\mycomputer</option>
<option value="F:">F: Drive</option>
<option value="R:">R: Drive</option>
</select>
</form>
<button type="button" onclick="showme(document.getElementById('pathPicking'));">Lets test this out</button>
<script type="text/javascript">
function showme(myselect)
{
document.write("enter showme function <BR />");
document.write("<BR /> " + myselect);
document.write("<BR /> " + myselect.options.length);
for (var i=0; i<myselect.options.length; i++)
{
if (myselect.options[i].selected==true)
{
alert("Selected Option's index: "+i)
break
}
}
document.write("<BR />leaving function");
};
</script>
</body>
</html>
I'm in the middle of teaching myself PHP and SQL so I'm only at the paste-and-tweak level with Javascript. Bear with my newbie-ness. I've seen a few solutions for creating a form dropdown menu that changes a nearby image based on what is selected. I want exactly that, but is it possible to have the images also appear on mouseover? I found a menu solution using CSS, but when I applied it to a form, it didn't work. Can anyone put me in the right direction on how to do that? I've started with this code, but need to tweak it to do this if possible: Code:
<html>
<body>
<table border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="100%"><form name="ddmessage"><table border="0" width="100%" cellspacing="0" cellpadding="0">
<tr>
<td width="100%"><select name="selectbox" size="1" onChange="changecontent(this)">
<option selected value="What is JavaScript?">What is JavaScript?</option>
<option value="Why learn JavaScript?">Why learn JavaScript?</option>
<option value="The difference between JavaScript and Java">The difference between Java and JavaScript</option>
<option value="What is DHTML?">What is DHTML?</option>
</select><br>
</td>
</tr>
<tr>
<td width="100%"><div id="output"></div><br>
<font face="arial" size="-2">This free script provided by <a href="http://javascriptkit.com">JavaScript Kit</a></font>
</td>
</tr>
</table>
</form>
</td>
</tr>
</table>
<p>
<script language="JavaScript">
/*
Drop down messages script
By JavaScript Kit (http://javascriptkit.com)
Over 400+ free scripts here!
*/
//change contents of message box, where the first one corresponds with the first drop down box, second with second box etc
var thecontents=new Array()
thecontents[0]='JavaScript is a scripting language developed by Netscape to add interactivity and power to web documents. Examples of JavaScript include live clocks, rollover effects,<br> <img src="http://www.google.com.au/intl/en_au/images/logo.gif"></img>'
thecontents[1]='The first word that comes to mind is: "Freedom baby, freedom!" With html, you are restricted to creating static, non interactive webpages. This, in today\'s internet standards, etc etc 1'
thecontents[2]='Java is completely different from JavaScript-It\'s a lot more powerful, more complex, and unfortunately, a lot harder to master. It belongs in the same league as C, C++, etc. etc. 2'
thecontents[3]='DHTML, or Dynamic HTML, is a new web technology that enables elements inside your web page to be, well, dynamic. Things once considered unchangeable etc. etc 3'
//don't edit pass this line
function changecontent(which){
document.getElementById('output').innerHTML=thecontents[which.selectedIndex]
}
document.getElementById('output').innerHTML=thecontents[document.ddmessage.selectbox.selectedIndex]
</script>
</body>
</html>
The Script works in Firefox, BUT not in Internet Explorer. What am I missing? I need Drop Down menu Boxes to appear when User clicks on a certian Menu option. The way it appears now on the website is all the boxes appear. They should stay "hidden" until a User clicks on the drop down menu selection. Thanks! <head> <script type="text/javascript" language="javascript"> function showInfo() { var typeOne = document.getElementById('bmp'); var typeTwo = document.getElementById('junction'); var typeThree = document.getElementById('mile'); if(document.basicform01.Location_Type.value == "BMP to EMP") { typeOne.style.display="inline"; typeTwo.style.display="none"; typeThree.style.display="none"; } else if(document.basicform01.Location_Type.value == "Junction to Junction") { typeOne.style.display="none"; typeTwo.style.display="inline"; typeThree.style.display="none"; } else if(document.basicform01.Location_Type.value == "Milepost") { typeOne.style.display="none"; typeTwo.style.display="none"; typeThree.style.display="inline"; } else { typeOne.style.display="none"; typeTwo.style.display="none"; typeThree.style.display="none"; } } </script> <style>*[style] {outline:none}</style> </head> <body> <fieldset> <dl> <dt><label for="Location_Type">Location Type *</label></dt> <dd><select class="inputselect" name="Location_Type" id="Location_Type" onchange="showInfo()"> <option value="" selected="selected">Select One...</option> <option value="BMP to EMP">BMP to EMP</option> <option value="Junction to Junction">Junction to Junction</option> <option value="Milepost">Milepost</option> </select></dd> <div id="bmp" style="display:none;"> <dt><label for="bmpDetails">BMP</label></dt> <dd><input class="inputtext" type="text" name="bmpDetails" id="bmpDetails" /></dd> <dt><label for="empDetails">EMP</label></dt> <dd><input class="inputtext" type="text" name="empDetails" id="empDetails" /></dd> </div> <div id="junction" style="display:none;"> <dt><label for="fromJunction">From Junction:</label></dt> <dd><input class="inputtext" type="text" name="fromJunction" id="fromJunction" /></dd> <dt><label for="toJunction">To Junction:</label></dt> <dd><input class="inputtext" type="text" name="toJunction" id="toJunction" /></dd> </div> <div id="mile" style="display:none;"> <dt><label for="milepostNum">Milepost</label></dt> <dd><input class="inputtext" type="text" name="milepostNum" id="milepostNum" /></dd> </div> <p> </dl> <p> </fieldset> </body> Hey everyone. Been racking my brain all day trying to figure out how to duplicate this code with the limited javascript knowledge I have been trying to learn. This code is a Dropdown menu of Yes or No, than a Select button that Opens up a Text Input directly below the dropdown. So far, It works great. My problem is I need at least two of these on the same page and I do not know how to go about it. I have tried changing values to accommodate adding another on the same form, but than both stop working. Can someone Please HELP! Thank you in advance. Code: <html>
<head>
<SCRIPT language="javascript">
function add(type) {
//Create an input type dynamically.
var element = document.createElement("input");
//Assign different attributes to the element.
element.setAttribute("type", type);
element.setAttribute("value", type);
element.setAttribute("name", type);
element.setAttribute("id", type);
var foo = document.getElementById("fooBar");
//Append the element in page (in span).
foo.appendChild(element);
}
</SCRIPT>
</head>
<body>
<label>
<SELECT name="element">
<OPTION value="text" name="refer_yes" id="refer_yes">Yes</OPTION>
<OPTION value="text" name="refer_no" id="refer_no">No</OPTION>
</SELECT>
<INPUT type="button" value="Select" onclick="add(document.forms[0].element.value='')"/>
</label>
<span id="fooBar"> </span>
</body>
<html>
Hi, I have written a number of functions designed to return frequency data on 1000 randomly chosen numbers using different math functions for the rounding. I would like to include all of these functions within the wrapper of another function so that only one call is needed to get returns from all of the 'inner' functions. However, while each of the functions works in isolation, the moment I wrap them in another function they stop working. The following code is one of the functions 'frequencyWrapperOne' that has been wrapped in the function 'testWrapper'. A call to testWrapper does nothing. Can anyone see what I'm doing wrong? Code: function testWrapper()
{
function frequencyWrapperOne()
{
var numberArrayOne = new Array(0,0,0);
for (var i = 0; i < 1000; i = i + 1)
{
var chosenNumber = Math.floor(Math.random() * 3);
if (chosenNumber == 0)
{
numberArrayOne[0] = numberArrayOne[0] + 1;
}
if (chosenNumber == 1)
{
numberArrayOne[1] = numberArrayOne[1] + 1;
}
if (chosenNumber == 2)
{
numberArrayOne[2] = numberArrayOne[2] + 1;
}
}
return window.alert(numberArrayOne.join(','));
}
}
testWrapper();
Thanks. What I want to do, is that, when the user select one option out of many from the dropdown box some new fields appears. I was so close to make it , using this example: Code: <script type="text/javascript">
function showInfo()
{
var elem = document.getElementById('verify');
if(document.forms[0].menu.value == "verify"){
elem.style.display="inline";}
else{
elem.style.display="none";}
}
</script>
</head>
<body>
<form action="#" method="post">
<select name="menu" onchange="showInfo()">
<option value="none">Select an option</option>
<option value="email">Email</option>
<option value="verify">Verify</option>
</select>
<div id="verify" style="display:none;">
<input type="text" value="Username" >
<input type="password" value="password" >
</div>
</form>
But what I do want, is that two differen things appear on the page and in the different location of the page. And this script does not read the second <div>. So the result is, that the only first <div> appears. Here are some images of what I want to do. Befo http://img82.imageshack.us/img82/7093/beforens9.jpg After http://img246.imageshack.us/img246/2759/afterzh2.jpg (what has to be changed is on the red circules). So can someone help me with this script?? Please! I am pritty noob to the javascript. |
|||||||