|
JavaScript - Help With Form Input Types Not Working With Script
Hello,
I am trying to add radio buttons in this quiz script that i'm using, but when i change the drop down box to radio buttons the quiz script stops working, i.e it will not calculate the correct answers / percentage. I dont think i am correctly adding the input type "radio" and the script cannot recognise the value properly as i'am trying to make custom radio buttons from javascript / css. here is the script thats stopped working but how do i make the radio buttons send the correct value to the quiz script? Hope someone can help, i can add the css file if need be.. Code: <HTML>
<HEAD>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=yes;" />
<TITLE>Seventies Trivia Quizzes & Games</TITLE>
<link rel="stylesheet" type="text/css" href="style.css" />
<script language=Javascript>
<!--
function stopErrors(){
return true;
}
window.onerror=stopErrors;
// -->
</script>
<script language="JavaScript1.1">
<!-- Hide from old browsers
function quiz(form) {
var i = 0
var result1=document.form1.answer1.selectedIndex
var result2=document.form2.answer2.selectedIndex
var result3=document.form3.answer3.selectedIndex
var result4=document.form4.answer4.selectedIndex
var result5=document.form5.answer5.selectedIndex
var result6=document.form6.answer6.selectedIndex
var result7=document.form7.answer7.selectedIndex
var result8=document.form8.answer8.selectedIndex
if (result1==0){
alert("Question #1 was not answered");}
if (result2==0){
alert("Question #2 was not answered");}
if (result3==0){
alert("Question #3 was not answered");}
if (result4==0){
alert("Question #4 was not answered");}
if (result5==0){
alert("Question #5 was not answered");}
if (result6==0){
alert("Question #6 was not answered");}
if (result7==0){
alert("Question #7 was not answered");}
if (result8==0){
alert("Question #8 was not answered");}
else {
if (result1==3){i++}
if (result2==3){i++}
if (result3==1){i++}
if (result4==4){i++}
if (result5==3){i++}
if (result6==1){i++}
if (result7==1){i++}
if (result8==2){i++}
document.total.score.value = i
var per = Math.round((i / 20) * 100)
document.total.percent.value = per
if (result1 != 3){document.form1.check1.checked = true}
else {document.form1.check1.checked = false}
if (result2 != 3){document.form2.check2.checked = true}
else {document.form2.check2.checked = false}
if (result3 != 1){document.form3.check3.checked = true}
else {document.form3.check3.checked = false}
if (result4 != 4){document.form4.check4.checked = true}
else {document.form4.check4.checked = false}
if (result5 != 3){document.form5.check5.checked = true}
else {document.form5.check5.checked = false}
if (result6 != 1){document.form6.check6.checked = true}
else {document.form6.check6.checked = false}
if (result7 != 1){document.form7.check7.checked = true}
else {document.form7.check7.checked = false}
if (result8 != 2){document.form8.check8.checked = true}
else {document.form8.check8.checked = false}
}
}
//-->
</SCRIPT>
<style type="text/css">
<!--
body {
margin-left: 10px;
margin-top: 10px;
margin-right: 10px;
margin-bottom: 10px;
}
-->
</style></HEAD>
<BODY>
<FORM NAME="form1"><INPUT TYPE="hidden" NAME="check1">
<b>1. Who wrote the Eagles' 1972 hit "Take It Easy"?</b><BR><BR>
<input type="hidden" SELECT NAME="answer1" SIZE=1>
<fieldset class="radios">
<label class="label_radio" for="sample-radio-1a0">
<input name="sample-radio" id="sample-radio-1a0" NAME="radio" type="radio" SELECTED VALUE="0"/>
CHOOSE AN ANSWER</label>
<label class="label_radio" for="sample-radio-1a1">
<input name="sample-radio" id="sample-radio-1a1" NAME="radio" type="radio" VALUE="1" />
Randy Meisner</label>
<label class="label_radio" for="sample-radio-1a2">
<input name="sample-radio" id="sample-radio-1a2" NAME="radio" type="radio" VALUE="2" />
J.D. Souther</label>
<label class="label_radio" for="sample-radio-1a3">
<input name="sample-radio" id="sample-radio-1a3" NAME="radio" type="radio" VALUE="3" />
Jackson Browne & Glenn Frey</label>
<label class="label_radio" for="sample-radio-1a4">
<input name="sample-radio" id="sample-radio-1a4" NAME="radio" type="radio" VALUE="4" />
Don Henley</label>
</fieldset>
</SELECT></FORM>
<BR>
<FORM NAME="form2"><INPUT TYPE="hidden" NAME="check2">
<b>1. Who wrote the Eagles' 1972 hit "Take It Easy"?</b><BR><BR>
<input type="hidden" SELECT NAME="answer2" SIZE=1>
<fieldset class="radios">
<label class="label_radio" for="sample-radio-2a0">
<input name="sample-radio" id="sample-radio-2a0" NAME="radio" type="radio" SELECTED VALUE="0"/>
CHOOSE AN ANSWER</label>
<label class="label_radio" for="sample-radio-2a1">
<input name="sample-radio" id="sample-radio-2a1" NAME="radio" type="radio" VALUE="1" />
Randy Meisner</label>
<label class="label_radio" for="sample-radio-2a2">
<input name="sample-radio" id="sample-radio-2a2" NAME="radio" type="radio" VALUE="2" />
J.D. Souther</label>
<label class="label_radio" for="sample-radio-2a3">
<input name="sample-radio" id="sample-radio-2a3" NAME="radio" type="radio" VALUE="3" />
Jackson Browne & Glenn Frey</label>
<label class="label_radio" for="sample-radio-2a4">
<input name="sample-radio" id="sample-radio-2a4" NAME="radio" type="radio" VALUE="4" />
Don Henley</label>
</fieldset>
</SELECT></FORM>
<BR>
<FORM NAME="form3"><INPUT TYPE="hidden" NAME="check3">
<b>1. Who wrote the Eagles' 1972 hit "Take It Easy"?</b><BR><BR>
<input type="hidden" SELECT NAME="answer3" SIZE=1>
<fieldset class="radios">
<label class="label_radio" for="sample-radio-3a0">
<input name="sample-radio" id="sample-radio-3a0" NAME="radio" type="radio" SELECTED VALUE="0"/>
CHOOSE AN ANSWER</label>
<label class="label_radio" for="sample-radio-3a1">
<input name="sample-radio" id="sample-radio-3a1" NAME="radio" type="radio" VALUE="1" />
Randy Meisner</label>
<label class="label_radio" for="sample-radio-3a2">
<input name="sample-radio" id="sample-radio-3a2" NAME="radio" type="radio" VALUE="2" />
J.D. Souther</label>
<label class="label_radio" for="sample-radio-3a3">
<input name="sample-radio" id="sample-radio-3a3" NAME="radio" type="radio" VALUE="3" />
Jackson Browne & Glenn Frey</label>
<label class="label_radio" for="sample-radio-3a4">
<input name="sample-radio" id="sample-radio-3a4" NAME="radio" type="radio" VALUE="4" />
Don Henley</label>
</fieldset>
</SELECT></FORM>
<BR>
<FORM NAME="form4"><INPUT TYPE="hidden" NAME="check4">
<b>1. Who wrote the Eagles' 1972 hit "Take It Easy"?</b><BR><BR>
<input type="hidden" SELECT NAME="answer4" SIZE=1>
<fieldset class="radios">
<label class="label_radio" for="sample-radio-4a0">
<input name="sample-radio" id="sample-radio-4a0" NAME="radio" type="radio" SELECTED VALUE="0"/>
CHOOSE AN ANSWER</label>
<label class="label_radio" for="sample-radio-4a1">
<input name="sample-radio" id="sample-radio-4a1" NAME="radio" type="radio" VALUE="1" />
Randy Meisner</label>
<label class="label_radio" for="sample-radio-4a2">
<input name="sample-radio" id="sample-radio-4a2" NAME="radio" type="radio" VALUE="2" />
J.D. Souther</label>
<label class="label_radio" for="sample-radio-4a3">
<input name="sample-radio" id="sample-radio-4a3" NAME="radio" type="radio" VALUE="3" />
Jackson Browne & Glenn Frey</label>
<label class="label_radio" for="sample-radio-4a4">
<input name="sample-radio" id="sample-radio-4a4" NAME="radio" type="radio" VALUE="4" />
Don Henley</label>
</fieldset>
</SELECT></FORM>
<BR>
<FORM NAME="form5"><INPUT TYPE="hidden" NAME="check5">
<b>1. Who wrote the Eagles' 1972 hit "Take It Easy"?</b><BR><BR>
<input type="hidden" SELECT NAME="answer5" SIZE=1>
<fieldset class="radios">
<label class="label_radio" for="sample-radio-5a0">
<input name="sample-radio" id="sample-radio-5a0" NAME="radio" type="radio" SELECTED VALUE="0"/>
CHOOSE AN ANSWER</label>
<label class="label_radio" for="sample-radio-5a1">
<input name="sample-radio" id="sample-radio-5a1" NAME="radio" type="radio" VALUE="1" />
Randy Meisner</label>
<label class="label_radio" for="sample-radio-5a2">
<input name="sample-radio" id="sample-radio-5a2" NAME="radio" type="radio" VALUE="2" />
J.D. Souther</label>
<label class="label_radio" for="sample-radio-5a3">
<input name="sample-radio" id="sample-radio-5a3" NAME="radio" type="radio" VALUE="3" />
Jackson Browne & Glenn Frey</label>
<label class="label_radio" for="sample-radio-5a4">
<input name="sample-radio" id="sample-radio-5a4" NAME="radio" type="radio" VALUE="4" />
Don Henley</label>
</fieldset>
</SELECT></FORM>
<BR>
<FORM NAME="form6"><INPUT TYPE="hidden" NAME="check6">
<b>1. Who wrote the Eagles' 1972 hit "Take It Easy"?</b><BR><BR>
<input type="hidden" SELECT NAME="answer6" SIZE=1>
<fieldset class="radios">
<label class="label_radio" for="sample-radio-6a0">
<input name="sample-radio" id="sample-radio-6a0" NAME="radio" type="radio" SELECTED VALUE="0"/>
CHOOSE AN ANSWER</label>
<label class="label_radio" for="sample-radio-6a1">
<input name="sample-radio" id="sample-radio-6a1" NAME="radio" type="radio" VALUE="1" />
Randy Meisner</label>
<label class="label_radio" for="sample-radio-6a2">
<input name="sample-radio" id="sample-radio-6a2" NAME="radio" type="radio" VALUE="2" />
J.D. Souther</label>
<label class="label_radio" for="sample-radio-6a3">
<input name="sample-radio" id="sample-radio-6a3" NAME="radio" type="radio" VALUE="3" />
Jackson Browne & Glenn Frey</label>
<label class="label_radio" for="sample-radio-6a4">
<input name="sample-radio" id="sample-radio-6a4" NAME="radio" type="radio" VALUE="4" />
Don Henley</label>
</fieldset>
</SELECT></FORM>
<BR>
<FORM NAME="form7"><INPUT TYPE="hidden" NAME="check7">
<b>1. Who wrote the Eagles' 1972 hit "Take It Easy"?</b><BR><BR>
<input type="hidden" SELECT NAME="answer7" SIZE=1>
<fieldset class="radios">
<label class="label_radio" for="sample-radio-7a0">
<input name="sample-radio" id="sample-radio-7a0" NAME="radio" type="radio" SELECTED VALUE="0"/>
CHOOSE AN ANSWER</label>
<label class="label_radio" for="sample-radio-7a1">
<input name="sample-radio" id="sample-radio-7a1" NAME="radio" type="radio" VALUE="1" />
Randy Meisner</label>
<label class="label_radio" for="sample-radio-7a2">
<input name="sample-radio" id="sample-radio-7a2" NAME="radio" type="radio" VALUE="2" />
J.D. Souther</label>
<label class="label_radio" for="sample-radio-7a3">
<input name="sample-radio" id="sample-radio-7a3" NAME="radio" type="radio" VALUE="3" />
Jackson Browne & Glenn Frey</label>
<label class="label_radio" for="sample-radio-7a4">
<input name="sample-radio" id="sample-radio-7a4" NAME="radio" type="radio" VALUE="4" />
Don Henley</label>
</fieldset>
</SELECT></FORM>
<BR>
<FORM NAME="form8"><INPUT TYPE="hidden" NAME="check8">
<b>1. Who wrote the Eagles' 1972 hit "Take It Easy"?</b><BR><BR>
<input type="hidden" SELECT NAME="answer8" SIZE=1>
<fieldset class="radios">
<label class="label_radio" for="sample-radio-8a0">
<input name="sample-radio" id="sample-radio-8a0" NAME="radio" type="radio" SELECTED VALUE="0"/>
CHOOSE AN ANSWER</label>
<label class="label_radio" for="sample-radio-8a1">
<input name="sample-radio" id="sample-radio-8a1" NAME="radio" type="radio" VALUE="1" />
Randy Meisner</label>
<label class="label_radio" for="sample-radio-8a2">
<input name="sample-radio" id="sample-radio-8a2" NAME="radio" type="radio" VALUE="2" />
J.D. Souther</label>
<label class="label_radio" for="sample-radio-8a3">
<input name="sample-radio" id="sample-radio-8a3" NAME="radio" type="radio" VALUE="3" />
Jackson Browne & Glenn Frey</label>
<label class="label_radio" for="sample-radio-8a4">
<input name="sample-radio" id="sample-radio-8a4" NAME="radio" type="radio" VALUE="4" />
Don Henley</label>
</fieldset>
</SELECT></FORM>
<BR>
<BR><BR><HR>
<P>That's it! Now click the "Submit" button to grade your Seventies music knowledge.<BR>
<form name="total">
<INPUT TYPE="BUTTON" VALUE="Submit" onClick="quiz()"> <INPUT TYPE="button" VALUE="Reload Quiz" onClick='parent.location="javascript:location.reload()"'><BR><HR><BR>Results:<BR><BR>
You scored <INPUT TYPE="TEXT" NAME="score" VALUE="" SIZE=5> out of
<INPUT TYPE="TEXT" NAME="outof" VALUE="8" SIZE=5> questions correct.<BR><BR>
Your Sco <INPUT TYPE="TEXT" NAME="percent" VALUE="" SIZE=3> %<BR><BR>
<HR>
</FORM>
<script>
var d = document;
var safari = (navigator.userAgent.toLowerCase().indexOf('safari') != -1) ? true : false;
var gebtn = function(parEl,child) { return parEl.getElementsByTagName(child); };
onload = function() {
var body = gebtn(d,'body')[0];
body.className = body.className && body.className != '' ? body.className + ' has-js' : 'has-js';
if (!d.getElementById || !d.createTextNode) return;
var ls = gebtn(d,'label');
for (var i = 0; i < ls.length; i++) {
var l = ls[i];
if (l.className.indexOf('label_') == -1) continue;
var inp = gebtn(l,'input')[0];
if (l.className == 'label_check') {
l.className = (safari && inp.checked == true || inp.checked) ? 'label_check c_on' : 'label_check c_off';
l.onclick = check_it;
};
if (l.className == 'label_radio') {
l.className = (safari && inp.checked == true || inp.checked) ? 'label_radio r_on' : 'label_radio r_off';
l.onclick = turn_radio;
};
};
};
var check_it = function() {
var inp = gebtn(this,'input')[0];
if (this.className == 'label_check c_off' || (!safari && inp.checked)) {
this.className = 'label_check c_on';
if (safari) inp.click();
} else {
this.className = 'label_check c_off';
if (safari) inp.click();
};
};
var turn_radio = function() {
var inp = gebtn(this,'input')[0];
if (this.className == 'label_radio r_off' || inp.checked) {
var ls = gebtn(this.parentNode,'label');
for (var i = 0; i < ls.length; i++) {
var l = ls[i];
if (l.className.indexOf('label_radio') == -1) continue;
l.className = 'label_radio r_off';
};
this.className = 'label_radio r_on';
if (safari) inp.click();
} else {
this.className = 'label_radio r_off';
if (safari) inp.click();
};
};
</script>
<P>Ratings:<br><br>
90-100% - "I Just Want To Celebrate"<br>
80-89% - "I Want To Take You Higher"<br>
70-79% - "One Toke Over The Line"<br>
60-69% - "What's Going On"<br>
50-59% - "Stuck In The Middle With You"<br>
0-49% - "Ball of Confusion"<br>
</blockquote>
</BODY>
</HTML>
Similar TutorialsThis should be simple, but I can't quite get it to work without some kind of side-effect. I've checked the forum and there doesn't seem to be anything that directly relates. What I want to do is convert the text that a user is typing to uppercase as they type it. What I have so far: function convertToUppercase(aControl) { var cursorKeys ="8;46;37;38;39;40;33;34;35;36;45;"; if (cursorKeys.indexOf(event.keyCode+";") == -1) { aControl.value = aControl.value.toUpperCase(); } } <input onkeyup="convertToUppercase(this)"/> The problem that I have is that this moves the cursor to the end of the line after every character. If you want to go and add something to the middle of what you've typed, you can type one character and then the cursor jumps to the end. e.g. inserting "abc" between the "R" and "E" of "FRED" gets you: FRAEDBC What I need is either: 1) ability to get the cursor/caret position and restore it after I set the uppercase string -- or -- 2) ability to intercept the keystroke in the event and make it uppercase before the browser adds it naturally to the input's value. Solution should be browser-independent (if at all possible). I'm mostly interested in IE though. Thanks, Chris Hello, Working With a touch screen, have created HTML page that has a custom keyboard for password input, no mouse or keyboard connected. Is there a way to enter keystrokes from the HTML into a (my form) text area (password) using Java. From the example below I am trying to put (1) into myform. <td><a class="Keys" type="password" target="myform">1</a></td> <!-- This Did not Work--> Thank You for any Info. I am thinking this should be fairly easy but yet I am not getting far. I want to have a form with a single text imput field for a zip code. Depending on which zip code the user enters will determine which url they will be sent to. If they enter a zip code which is not in the script, they would be sent to a default url. I am also assuming this can be accomplished with javascript. Any help is greatly appreciated. Hi, i want to set an input value to the same value as the input selected from another input on the same form so when the user selects input 1 i want the hidden input2 to get the same value im guessing i use onsubmit because its hidden so there wont be a focus or blur this would be part of the input Code: onsubmit="(this.value = this.othervalue)" othervalue being the other input name="othervalue" is that the correct syntax hi, On my mobile app, the 2nd input box isn't working as it should?! it's called weight1 can someone please help, here is my code: Code: <!doctype html>
<html>
<head>
<title>myBMI</title>
<script type="text/javascript" charset="utf-8">
var html5rocks = {};
html5rocks.webdb = {};
html5rocks.webdb.db = null;
html5rocks.webdb.open = function() {
var dbSize = 5 * 1024 * 1024; // 5MB
html5rocks.webdb.db = openDatabase("Todo", "1.0", "Todo manager", dbSize);
}
html5rocks.webdb.createTable = function() {
var db = html5rocks.webdb.db;
db.transaction(function(tx) {
tx.executeSql("CREATE TABLE IF NOT EXISTS bmical(ID INTEGER PRIMARY KEY ASC, height1 TEXT, weight1 TEXT, added_on DATETIME)", []);
});
}
html5rocks.webdb.addTodo = function(todoText) {
var db = html5rocks.webdb.db;
db.transaction(function(tx){
var weight1 = document.getElementById("weight1");
var addedOn = new Date();
tx.executeSql("INSERT INTO bmical(height1, weight1, added_on) VALUES (?,?,?)",
[todoText, weight1, addedOn],
html5rocks.webdb.onSuccess,
html5rocks.webdb.onError);
});
}
html5rocks.webdb.onError = function(tx, e) {
alert("There has been an error: " + e.message);
}
html5rocks.webdb.onSuccess = function(tx, r) {
// re-render the data.
html5rocks.webdb.getAllTodoItems(loadTodoItems);
}
html5rocks.webdb.getAllTodoItems = function(renderFunc) {
var db = html5rocks.webdb.db;
db.transaction(function(tx) {
tx.executeSql("SELECT * FROM bmical", [], renderFunc,
html5rocks.webdb.onError);
});
}
html5rocks.webdb.deleteTodo = function(id) {
var db = html5rocks.webdb.db;
db.transaction(function(tx){
tx.executeSql("DELETE FROM bmical WHERE ID=?", [id],
html5rocks.webdb.onSuccess,
html5rocks.webdb.onError);
});
}
function loadTodoItems(tx, rs) {
var rowOutput = "";
var todoItems = document.getElementById("todoItems");
for (var i=0; i < rs.rows.length; i++) {
rowOutput += renderTodo(rs.rows.item(i));
}
todoItems.innerHTML = rowOutput;
}
function renderTodo(row) {
return "<li>" + row.height1 + row.weight1 + row.added_on + " [<a href='javascript:void(0);' onclick='html5rocks.webdb.deleteTodo(" + row.ID +");'>Delete</a>]</li>";
}
function init() {
html5rocks.webdb.open();
html5rocks.webdb.createTable();
html5rocks.webdb.getAllTodoItems(loadTodoItems);
}
function addTodo() {
var height1 = document.getElementById("height1");
html5rocks.webdb.addTodo(height1.value);
height1.value = "";
}
</script>
</head>
<body onload="init();">
<p>Please enter daily your stats below</p>
<ul id="todoItems">
</ul>
<form type="post" onsubmit="addTodo(); return false;">
<ul class="individual">
<li><input type="text" class="submit" id="height1" name="height1" placeholder="Height" /></li>
<li><input type="text" class="submit" id="weight1" name="weight1" placeholder="Weight" /></li>
</ul>
<input type="submit" value="Add Todo Item"/>
</form>
</body>
</html>
The assignment is to take a form and determine whether or not the user has put in data into the parts of the form. We are using Javascript to validate the form input and html to create the form itself. My code was running before, but then I added a confirm user input at the bottom of the form and it stopped working. I have no idea what to do at this point. Any help would be useful. I don't have any error messages because I don't know how to test it in the firefox javascript console, if someone wants to instruct me on this i can get back to you guys with the error messages. Thanks Also, my submit button has not been running the validate program when selected. Code: <html>
<head>
<title>Order Form</title>
<script language="javascript">
function validate(objForm)
{
str="";
checkstr="";
checkstr2="";
stateselect = "false";
//VALIDATING CONTACT INFORMATION
if (objForm.firstName.value == "")
{
str+= "You must enter your First Name\n";
}
if (objForm.lastName.value == "")
{
str+= "You must enter your Last Name\n";
}
if (objForm.phoneNumber.value == "")
{
str+= "You must enter a Phone Number\n";
}
//VALIDATING SHIPPING ADDRESS
if (objForm.address.value == "")
{
str+= "You must enter an address\n";
}
if (objForm.city.value == "")
{
str+= "You must enter a city\n";
}
for(i=1; i<objForm.state.options.length; i++)
{
if (objForm.state.options[i].selected) stateselect = "true";
}
if (stateselect != "true") str+= "You must select a state\n";
if(isNaN(myForm.zipcode.value)||myForm.zipcode.value.length!=5)
{
str+= "You must enter a 5 digit zipcode\n";
}
//VALIDATING CHECK BOX
if (!objForm.doublechocchip.checked && !objForm.vanillachip.checked && !objForm.zebra.checked && !objForm.tiger.checked && !objForm.choccoveredstrawberry.checked && !objForm.mintcchochip.checked
&& !objForm.raspberry.checked && !objForm.redvelvet.checked && !objForm.kailua.checked && !objForm.blackforest.checked && !objForm.peanutbutter.checked && !objForm.mandm.checked
&& !objForm.oreo.checked && !objForm.mocha.checked && !objForm.gingerbread.checked && !objForm.pumpkin.checked && !objForm.pistachio.checked && !objForm.lavender.checked
&& !objForm.carrotcake.checked && !objForm.strawberrybanana.checked)
str+= "You must select at least one cupcake\n";
//VALIDATING CHECKED BOXES
if (objForm.doublechocchip.checked) checkstr += objForm.doublechocchip.value + ", ";
if (objForm.vanillachip.checked) checkstr += objForm.vanillachip.value + ", ";
if (objForm.zebra.checked) checkstr += objForm.zebra.value + ", ";
if (objForm.tiger.checked) checkstr += objForm.tiger.value + ", ";
if (objForm.choccoveredstrawberry.checked) checkstr += objForm.choccoveredstrawberry.value + ", ";
if (objForm.mintchocchip.checked) checkstr += objForm.mintchocchip.value + ", ";
if (objForm.raspberry.checked) checkstr += objForm.raspberry.value + ", ";
if (objForm.redvelvet.checked) checkstr += objForm.redvelvet.value + ", ";
if (objForm.kailua.checked) checkstr += objForm.kailua.value + ", ";
if (objForm.blackforest.checked) checkstr += objForm.blackforest.value + ", ";
if (objForm.peanutbutter.checked) checkstr += objForm.peanutbutter.value + ", ";
if (objForm.mandm.checked) checkstr += objForm.mandm.value + ", ";
if (objForm.oreo.checked) checkstr += objForm.oreo.value + ", ";
if (objForm.mocha.checked) checkstr += objForm.mocha.value + ", ";
if (objForm.gingerbread.checked) checkstr += objForm.gingerbread.value + ", ";
if (objForm.pumpkin.checked) checkstr += objForm.pumpkin.value + ", ";
if (objForm.pistachio.checked) checkstr += objForm.pistachio.value + ", ";
if (objForm.lavender.checked) checkstr += objForm.lavender.value + ", ";
if (objForm.carrotcake.checked) checkstr += objForm.carrotcake.value + ", ";
if (objForm.strawberrybanana.checked) checkstr += objForm.starwberrybanana.value + ", ";
//VALIDATING CHECK BOX
if (!objForm.mini.checked && !objForm.regular.checked && !objForm.collossal.checked)
str+= "You must select a size\n";
//VALIDATING CHECKED BOXES
if (objForm.mini.checked) checkstr2 += objForm.mini.value + ", ";
if (objForm.regular.checked) checkstr2 += objForm.regular.value + ", ";
if (objForm.collossal.checked) checkstr2 += objForm.collossal.value + ", ";
//print all form input
if (str != ""){
alert(str);
return false;
}
else{
str= "Please Confirm Your Information:";
str += "\nFirst Name: " +objForm.firstName.value;
str += "\nLast Name: " +objForm.lastName.value;
str += "\nPhone Number: " +objForm.phoneNumber.value;
str += "\nAddress: " +objForm.address.value;
str += "\nCity: " +objForm.city.value;
str += "\nZip Code: " +objForm.zipcode.value;
str += "\nCupcakes: " +checkstr;
str += "\nSize: " +checkstr2;
alert(str);
return true;
}
}
</script>
</head>
<link rel="stylesheet" type="text/CSS" href="CellFormating.css"/>
<body onLoad="document.forms[0].elements[0].focus()">
<h2 align="center" class="CellFormat1"> Please Use the Following Form to Place Your Order: </h2>
<form id ="CellFormat2" name="myForm" method="post" action="orderconfirmation.html" onSubmit="return validate(myForm)">
<table align="center">
<tr>
<td id="CellFormat4">Contact Information:</td>
</tr>
<tr>
<td>First Name: </td>
<td><input name="firstName" size="15" /></td>
</tr>
<tr>
<td>Last Name: </td>
<td><input type="text" name="lastName" size="15" maxlength="20" /></td>
</tr>
<tr>
<td>Phone Number: </td>
<td><input type="text" name="phoneNumber" size="10" maxlength="10" /></td>
</tr>
</table>
<p>
</p>
<table align="center">
<tr>
<td id="CellFormat4">Shipping Address:</td>
</tr>
<td>Address: </td>
<td><input type="text" name="address" size="22" maxlength="30" /></td>
</tr>
<tr>
<td>City: </td>
<td><input type="text" name="city" size="10" maxlength="15" /></td>
</tr>
<tr>
<td>State: </td>
<td>
<select name="state" size="1">
<option selected>Select your State</option>
<option>Alabama</option>
<option>Alaska</option>
<option>Arizona</option>
<option>Arkansas</option>
<option>California</option>
<option>Colorado</option>
<option>Connecticut</option>
<option>Delaware</option>
<option>Florida</option>
<option>Georgia</option>
<option>Hawaii</option>
<option>Idaho</option>
<option>Illinois</option>
<option>Indiana</option>
<option>Iowa</option>
<option>Kansas</option>
<option>Kentucky</option>
<option>Louisiana</option>
<option>Maine</option>
<option>Maryland</option>
<option>Massachusetts</option>
<option>Michigan</option>
<option>Minnesota</option>
<option>Mississippi</option>
<option>Missouri</option>
<option>Montana</option>
<option>Nebraska</option>
<option>Nevada</option>
<option>New Hampshire</option>
<option>New Jersey</option>
<option>New Mexico</option>
<option>New York</option>
<option>North Carolina</option>
<option>North Dakota</option>
<option>Ohio</option>
<option>Oklahoma</option>
<option>Oregon</option>
<option>Pennsylvania</option>
<option>Rhode Island</option>
<option>South Carolina</option>
<option>South Dakota</option>
<option>Tennessee</option>
<option>Texas</option>
<option>Utah</option>
<option>Vermont</option>
<option>Virginia</option>
<option>Washington</option>
<option>West Virginia</option>
<option>Wisconsin</option>
<option>Wyoming</option>
</select>
</td>
</tr>
<tr>
<td>Zip Code: </td>
<td><input type="text" name="zipcode" size="10" maxlength="15" /></td>
</tr>
</table>
<p>
</p>
<table align="center">
<tr>
<td><div align="center" id="CellFormat4">Select Your Cupcakes:</div></td>
<td><div align="center" id="CellFormat4">Select Your Size(s):</div></td>
<td><div align="center" id="CellFormat4">Select The Amount:</div></td>
</tr>
<tr>
<td><input type="checkbox"name="doublechocchip" value="doublechocchip"/>Double Chocolate Chip</td>
<td><input type="checkbox"name="mini" value="mini"/>Mini</td>
<td>Amount: <input type="text" name="amt" size="5" maxlength="10" /></td>
</tr>
<tr>
<td><input type="checkbox"name="vanillachip" value="vanillachip"/>Vanilla Chip</td>
</tr>
<tr>
<td><input type="checkbox"name="zebra" value="zebra"/>Zebra</td>
<td><input type="checkbox"name="regular" value="regular"/>Regular</td>
</tr>
<tr>
<td><input type="checkbox"name="tiger" value="tiger"/>Tiger</td>
</tr>
<tr>
<td><input type="checkbox"name="choccoveredstrawberry" value="choccoveredstrawberry"/>Chocolate Covered Strawberry</td>
<td><input type="checkbox"name="collosal" value="collossal"/>Collossal</td>
</tr>
<tr>
<td><input type="checkbox"name="mintchocchip" value="mintchocchip"/>Mind Chocolate Chip</td>
</tr>
<tr>
<td><input type="checkbox"name="raspberry" value="raspberry"/>Raspberry</td>
</tr>
<tr>
<td><input type="checkbox"name="redvelvet" value="redvelvet"/>Red Velvet</td>
</tr>
<tr>
<td><input type="checkbox"name="kailua" value="kailua"/>Kailua</td>
</tr>
<tr>
<td><input type="checkbox"name="blackforest" value="blackforest"/>Black Forest</td>
</tr>
<tr>
<td><input type="checkbox"name="peanutbutter" value="peanutbutter"/>Peanut Butter</td>
</tr>
<tr>
<td><input type="checkbox"name="mandm" value="mandm"/>M&M's</td>
</tr>
<tr>
<td><input type="checkbox"name="oreo" value="oreo"/>Oreo</td>
</tr>
<tr>
<td><input type="checkbox"name="mocha" value="mocha"/>Mocha</td>
</tr>
<tr>
<td><input type="checkbox"name="gingerbread" value="gingerbread"/>Gingerbread</td>
</tr>
<tr>
<td><input type="checkbox"name="pumpkin" value="pumpkin"/>Pumpkin</td>
</tr>
<tr>
<td><input type="checkbox"name="pistachio" value="pistachio"/>Pistachio</td>
</tr>
<tr>
<td><input type="checkbox"name="lavender" value="lavender"/>Lavender</td>
</tr>
<tr>
<td><input type="checkbox"name="carrotcake" value="carrotcake"/>Carrot Cake</td>
</tr>
<tr>
<td><input type="checkbox"name="strawberrybanana" value="strawberrybanana"/>Strawberry Banana</td>
</tr>
</table>
<p>
</p>
<div align="center" id="CellFormat4">Payment Method:</div>
<table align="center">
<tr>
<td>Credit Card Type: </td>
</tr>
<tr>
<td>Visa:<input type="radio" name="visa" value="visa" /></td>
<td>Master Card:<input type="radio" name="master" value="master" /></td>
<td>Discovery:<input type="radio" name="discovery" value="discovery" /></td>
<td>Chase:<input type="radio" name="chase" value="chase" /></td>
</tr>
<tr>
<td>Credit Card Number: </td>
<td><input type="text" name="creditNumber" size="12" maxlength="12" /></td>
</tr>
<tr>
<td>Expiration Date: </td>
<td><input type="text" name="ExpDate" size="5" maxlength="5" /></td>
</tr>
<tr>
<td>Security Code: </td>
<td><input type="text" name="SecurityCode" size="3" maxlength="3" /></td>
</tr>
</table>
<p>
</p>
<table align="center">
<tr>
<td><textarea rows="10" cols="25" wrap="soft">Please let us know how we are doing</textarea></td>
</tr>
</table>
<table align="center">
<tr>
<td><input type="submit" name="Order" value="Submit Order" onSubmt="return validate(myForm)";/></td>
<td><input type="button" name="confirm" value="Confirm Information" onClick="validate(myForm)"/></td>
<td><input type="reset" name="Clear" value="Reset"/></td>
</tr>
</table>
</form>
<table align="center">
<tr>
<td><a href="cupcakes.htm">View the Cupcakes</a></td>
<td><a href="home.html">Go Home!</a></td>
</tr>
</table>
</body>
</html>
can someone help me isolate this input script to 1 designated input field? it just removes any pre-existing value in the field but does so to all input text types now. Code: // Home Page Search Box Input Clear
function initInputs () {
var inputs = document.getElementsByTagName("input");
for (var i = 0; i < inputs.length; i++ ){
if(inputs[i].type == "text" ) {
inputs[i].valueHtml = inputs[i].value;
inputs[i].onfocus = function (){
this.value = "";
}
inputs[i].onblur = function (){
this.value != ""? this.value = this.value: this.value = this.valueHtml;
}
}
}
}
if (window.addEventListener){
window.addEventListener("load", initInputs, false);
}
else if (window.attachEvent){
window.attachEvent("onload", initInputs);
}
I am trying to autofill a box by clicking a link (with return false). The function to autofill works with button tag but not in anchor tag - instead of returning false, the click event transitions to the href. Here is the simplified code. Any help is appreciated.Thanks <!DOCTYPE html PUBLIC"-// W3C//DTD Xhtml 1.0 Strict//EN"" http://www.w3.org/TR/xhtml2/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/> <title>Untitled Page </title> </head> <script type="text/javascript"> function autofill(frm){ frm.box2.value = 'sample_value'; } </script> <body> <FORM NAME="browse" ACTION="<TMPL_VAR MYURL>/browse_results"> <font size="5"> <b>FIND </b> </font> <hr> <div class="menu" id="find_block"> <ul> <li> <a href="#">DOMAINS </a> <ul> <li> <a href="#1" onclick="alert('Heading Home!'); return false;">1. alert with link </a> </li> <li> <a href="#2" onClick="autofill2(this.form); return false;">2. autofill with link </a> </li> </ul> </li> </ul> <input readOnly name="box2"/> <INPUT TYPE=BUTTON OnClick="autofill(this.form,'2')" VALUE="autofill with button "> </div> <br> <font size="5"> <b>WHERE </b> </font> <hr> </FORM> </body> </html> this is the code for input prompt, only works in IE: any ideas why? $('input[type=text][title],input[type=password][title],textarea[title]').each(function(i){ $(this).addClass('input-prompt-' + i); var promptSpan = $('<span class="input-prompt"/>'); $(promptSpan).attr('id', 'input-prompt-' + i); $(promptSpan).append($(this).attr('title')); $(promptSpan).click(function(){ $(this).hide(); $('.' + $(this).attr('id')).focus(); }); if($(this).val() != ''){ $(promptSpan).hide(); } $(this).before(promptSpan); $(this).focus(function(){ $('#input-prompt-' + i).hide(); }); $(this).blur(function(){ if($(this).val() == ''){ $('#input-prompt-' + i).show(); } }); }); I am trying to create a text area input filed for user input, and i want to be able to allow the user to format thier text, just like the ones used in this user forum. I am writing my website in html, php, javascript and css with a MySql database. I am trying to understand how to create such an format-able text area for input. Any ideas? Thank you; Ice Hi guys, it's been a while since I've been here Anyways, I'm wondering if it's possible for a script to enable/disable all input elements on the page with some sort of toggle button. I googled it but didn't find anything too useful except for this: http://www.aHappyDeal.com/wj_r.asp?lid=2109 but I'm not sure how to edit it for the toggle. Thanks! Hi guys, it's been a while since I've been here Anyways, I'm wondering if it's possible for a script to enable/disable all input elements on the page with some sort of toggle button. I googled it but didn't find anything too useful except for this: http://www.codetoad.com/javascript/e...rm_element.asp but I'm not sure how to edit it for the toggle. Thanks! Yes - I need a script that will validate user input against a text file - exactly like the one in the left sidebar at http://www.oilpatchfuel.com/Pages/Welcome.aspx titled "Delivery Area". Thanks! Hey guys, have a bit of an issue/question... Not sure what I am doing wrong...i do not know javascript at all lol I have a URL stucture which needs to be changed according to the input fields https://sls.example.com/Spc/viewUserProfile.do?source=search&UserId=J-DOE123&vgroupName1=Dealer-jcode-USA-P4038P0122&adminflag=Y This part stays the same at all times https://sls.example.com/Spc/viewUserProfile.do?source=search&UserId= after the "=" sign, I want it to input text from a input box "J-JOE123", so if I put J-DOE123 in the first input box and run the search, I want it to pull up https://sls.example.com/Spc/viewUserProfile.do?source=search&UserId= J-DOE123 after the "J-DOE123", the next part "&vgroupName1=Dealer-" remains the same at all times https://sls.example.com/Spc/viewUserProfile.do?source=search&UserId=J-DOE123 &vgroupName1=Dealer- the next input box would have a drop down with 2 selections (jcode and lcode) so depending on which one is chosen, that is how it would populate the URL https://sls.example.com/Spc/viewUserProfile.do?source=search&UserId=J-DOE123&vgroupName1=Dealer- jcode next, i would need for it to put a "-" after the chosen jcode or lcode in the URL, which will also be there at all times https://sls.example.com/Spc/viewUserProfile.do?source=search&UserId=J-DOE123&vgroupName1=Dealer-jcode - the next input box would have a drop down with 2 selections (USA or CAN) so depending on which one is chosen, that is how it would populate the URL https://sls.example.com/Spc/viewUserProfile.do?source=search&UserId=J-DOE123&vgroupName1=Dealer-jcode- USA next, i would need for it to put a "-" after the chosen jcode or lcode in the URL, which will also be there at all times https://sls.example.com/Spc/viewUserProfile.do?source=search&UserId=J-DOE123&vgroupName1=Dealer-jcode-USA - next, i will have a drop down box containing several hundred codes such as "P0122" and many more. for this, I would need for the display value to be "P0122" but when the URL gets populated, it would have to be "P4038P0122" https://sls.example.com/Spc/viewUserProfile.do?source=search&UserId=J-DOE123&vgroupName1=Dealer-jcode-USA- P4038P0122 The reason why the entire code must change is because P0122 would be P4038P0122, but if it is P0165, it would be N1534P0165, so each code would have its own first part and second part, but in the drop down box, i want it to only display the 2nd part P0122/P0165/etc.. because that is what I go by, but the system only reads full codes. I do have a spreadsheet with the entire list of FULL codes and can do an extract from each cell in order to get the SHORT code. and finally, the URL would have to end with "&adminflag=Y" and will remain the same at all times. https://sls.example.com/Spc/viewUserProfile.do?source=search&UserId=J-DOE123&vgroupName1=Dealer-jcode-USA-P4038P0122 &adminflag=Y So, all together I would have 4 input fields in the form. UserID, jcode/lcode, USA/CAN, and Code. Please help who ever can. If you need more info, please let me know and I shall try my best to explain further. Thanks in advance guys Not sure how to describe this. I've been tasked with the responsibility of creating a web form. That's not the problem and I can do that. The trick is, each field needs to be incased in it's own box that flies in from the left. So, the first box that flies in from the left would be email address, when you click enter, it flies off to the right and the next box flies in from the left asking for the persons name. Is it possible to do this and where might I go to learn more about doing this type of coding. Hi, I've devised a javascript to guess what a user is typing in. That all works, but I'm stuck on how to take that value the user has submitted and put it back into the form. At the moment my form is: <form method="post" action="/bin/openathenssp_isapi.dll?type=ukfed&dir=req&requestURL=index.php" onsubmit="send_sso('login_form', 'loading', '<?=SITE_URL?>'); return false;"> <input type='text' name='uni_name' id='uni_name' value='' autocomplete="off"> <input type="hidden" name="entityID" id="entityID" /> //Where the name is guessed <script>actb(document.getElementById("uni_name"),customarray);</script> <input type='submit' name='submit' value='submit'> </form> So basically I'm trying to put uni_name into the entityID. Here's my javascript: function send_sso(ajax_div, loading_div, site_url) { replace_this_div = ajax_div; replace_loading_div = loading_div; var entityID = document.getElementById("entityID").value; if (uni_name == "Bournemouth University"){ document.getElementById('entityID').value = "https://idp.bournemouth.ac.uk/shibboleth"; ...MORE INSTITUTIONS GO HERE... } else { alert("Sorry, the institution '" +uni_name+ "' was not recognised or does not have access to this service."); } } But this does not seem to be working - any ideas? Hey all, How do I get the childelements of a div, but only the child elements that are "ahref" tags? for example: <div id="someDivID"> <a href="somepath.html">link 1</a> <a href="somepath.html">link 2</a> <div></div> <a href="somepath.html">link 3</a> <span></span><div></div> <a href="somepath.html">link 1</a> </div> I want all the childElements under someDivID that are "a href" types... I am using prototype: I figured the following would work, but didn't. $('someDivID').childElements.getElementByTagName('a') any ideas? Hi guys, Been stuck for a few days with this scenario. Any help? The alert box appears on an error. But the submitting won't stop. The details are submitted and the form is processed. Any help is greatly appreciated... Code: <html>
<head>
<script type="text/javascript" src="email_helper/jscripts/tiny_mce/tiny_mce.js"></script>
<script type="text/javascript">
tinyMCE.init({
// General options
mode : "textareas",
theme : "simple"
});
</script>
<script language="javascript">
function MM_openBrWindow(theURL,winName,features) {
window.open(theURL,winName,features);
}
function err_check(){
var email = document.getElementById('to_email').value;
if(email.length==0){
alert('Please Enter Email Address');
return false;
}
var AtPos = email.indexOf("@")
var StopPos = email.lastIndexOf(".")
if (AtPos == -1 || StopPos == -1) {
alert("Please Enter Valid Email Address");
document.getElementById('email').focus();
return false;
}
email = document.getElementById('cc_email').value;
if(email.length != 0){
var AtPos = email.indexOf("@")
var StopPos = email.lastIndexOf(".")
if (AtPos == -1 || StopPos == -1) {
alert("Please Enter Valid Email Address");
document.getElementById('email').focus();
return false;
}
}
var answer = confirm ("Send E-Mail?");
if (!answer){
return false;
}
}
</script>
<!-- /TinyMCE -->
<style type="text/css">
body, table, td, th{
background-color:#CCCCCC;
font-family: Arial;
font-size:14px;
}
.que{
font-weight:bold;
}
</style>
</head>
<body>
<form method="post" enctype="multipart/form-data">
<?php
include 'library/database.php';
include 'library/opendb.php';
$query = mysql_query("SELECT email,contact,mobile FROM users WHERE user_id='$uid'") or die(mysql_error());
$row = mysql_fetch_row($query);
$from_email = $row[0];
$from_person = $row[1];
$from_mobile = $row[2];
$query = mysql_query("SELECT customer_id FROM campaign_summary WHERE camp_id='$camp_id'") or die(mysql_error());
$row = mysql_fetch_row($query);
$cusid = $row[0];
$query = mysql_query("SELECT email FROM client_info WHERE comp_id='$cusid'") or die(mysql_error());
$row = mysql_fetch_row($query);
$toer = $row[0];
include 'library/closedb.php';
?>
<table width="100%" border="0">
<tr><td rowspan="4"><input type="submit" name="send_email" id="send_email" style="height:50px; width:100px;" value="SEND" onClick="return err_check();" /></td><td><span class="que">From : </span></td><td colspan="3"><?php echo $from_email; ?><input type="hidden" name="from_mail" id="from_mail" /><input type="hidden" name="camp_id" id="camp_id" value="<?php echo $camp_id;?>"/></td></tr>
<tr><td><span class="que">To : </span></td><td colspan="3"><input name="to_email" id="to_email" style="width:250px;" value="<?php echo $toer;?>"/></td></tr>
<tr><td><span class="que">CC : </span></td><td colspan="3"><input name="cc_email" id="cc_email" style="width:250px;"/></td></tr>
<tr><td><span class="que">Subject : </span></td><td colspan="3"><input style="width:300px;" name="subject" id="subject" /></td></tr>
<tr><td rowspan="1" colspan="2"> </td><td><input type="checkbox" name="ori_pdf" id="ori_pdf" checked /> PDF Quotation</td><td> </td><td> </td></tr><tr><td colspan="2"><span class="que">Credit Application</span></td><td><input type="checkbox" name="corporate" id="corporate"/>Corporate</td><td><input type="checkbox" name="individual" id="individual" />Individual</td><td><input type="checkbox" name="cash" id="cash" />Cash Account</td>
</tr>
<tr>
<td colspan="2" rowspan="3"></td><td><input type="checkbox" name="tabloid" id="tabloid" />Tabloid Example</td>
<td><input type="checkbox" name="broadsheet" id="broadsheet" />Broadsheet Example</td></tr>
<tr><td><input type="checkbox" name="colmt" id="colmt" />Column Sizes Tabloid</td>
<td><input type="checkbox" name="colmb" id="colmb" />Column Sizes Broadsheet</td></tr>
<tr><td><input type="checkbox" name="maps" id="maps" />Maps / Distribution</td><td colspan="2" align="right">External Attachments <input id="upload_file" name="upload_file" type="file"/> </td></tr>
<tr><td colspan="2"><span class="que">Message :</span></td><td colspan="3">
<textarea id="elm1" name="elm1" rows="15" cols="80" style="width: 100%">
<?php
echo "<br><br><br>" . $from_person . "<br>" . $from_mobile;
?>
</textarea>
</td></tr>
</table>
</form>
</body>
</html>
Allright, so i got index html, and on the head of the document i got jquery already, and what i got is a form, and what i want it to do is that once the input is sumbmited, to post it on a list. BUt something is missing here or maybe im doing it wrong, i need some guidance plz. here is my table: Code: <form name="postbar_add_post" id="postbar_add_post" method="post">
<fieldset>
<legend>Write text here ...</legend>
<input type="text" name="addcontentbox" id="addcontentbox" />
<input type="button" name="addpost" value="Submit" class="submit" />
</fieldset>
</form>
and heres is the function that i have on the head, where what i try is to make it post on the list: Code: <script type="text/javascript">
$(document).ready(function(){
$("form#postbar_add_post").submit(function() {
var message_wall = $('#addcontentbox').attr('value');
$.ajax({
type: "POST",
data:"addcontentbox="+ addcontentbox,
success: function(){
$("ul#wall").prepend("<li>"+addcontentbox+"</li>");
$("ul#wall li:first").fadeIn();
}
});
return false;
});
});
</script>
But is just not working :S .... any ideas/guidance? xD . Btw, on the body, theres only that table above, and a " <ul id="wall"></ul> " , wich is where im trying the content to be posted on. Any ideas where the flaw is ? =\ |
|||||||