|
JavaScript - Javascript Puzzle -- Put The Numbers In Order To Win.
I need to make a --very-- simple version of this game: http://javascript.internet.com/games/magic-squares.html. You need to click on the buttons until they're in order, then you win. I'm having trouble with the function that trades the places of the two buttons.
So, can anyone tell me how my "swap" function should be? It needs to test if the value of the button next to the button clicked on is blank, and then if it is, the two values trade places. This way, I will hopefully end up with 9 different functions, depending on which square I'm clicking on, because the "id" of the button stays the same, it just swaps the values. It shouldn't use any arrays or anything. Thanks, I appreciate the help! Here's what I have so far: Code:
<html>
<head>
<title>15 Puzzle</title>
<script type="text/javascript">
function swap(id){
if(document.getElementById(id+1).value="")
{
document.getElementById(id+1).value=document.getElementById(id).value;
document.getElementById(id).value="";
alert('It works!');
}
}
</script>
</head>
<p><h1 align="center">15 Puzzle</h1><p>
<p align="center"><input type="button" id="scramble" value="Scramble"></p>
<br>
<table border="3" bordercolor="black" width="300" bgcolor=""
cellpadding="50" align="center">
<tr>
<td ><input type="button" id="1" value="1" onclick=" swap(this.id);"></td>
<td > <input type="button" id="2" value="" onclick="swap(this.id)"></td>
<td> <input type="button" id="3" value="3" onclick="swap(this.id)"> </td>
<td> <input type="button" id="4" value="4" onclick="swap(this.id)"> </td>
</tr>
<tr>
<td> <input type="button" id="5" value="5" onclick="swap(this.id)"> </td>
<td> <input type="button" id="6" value="6" onclick="swap(this.id)"> </td>
<td> <input type="button" id="7" value="7" onclick="swap(this.id)"> </td>
<td> <input type="button" id="8" value="8" onclick="swap(this.id)"> </td>
</tr>
<tr>
<td> <input type="button" id="9" value="9" onclick="swap(this.id)"> </td>
<td> <input type="button" id="10" value="10" onclick="swap(this.id)"> </td>
<td> <input type="button" id="11" value="11" onclick="swap(this.id)"> </td>
<td> <input type="button" id="12" value="12" onclick="swap(this.id)"> </td>
</tr>
<tr>
<td> <input type="button" id="13" value="13" onclick="swap(this.id)"> </td>
<td> <input type="button" id="14" value="14" onclick="swap(this.id)"> </td>
<td> <input type="button" id="15" value="15" onclick="swap(this.id)"> </td>
<td> <input type="button" id="16" value="2" onclick="swap(this.id)"> </td>
</tr>
</table>
</html>
Similar TutorialsHi guys i am trying to make a sliding 15 puzzle in javascript. I have tried the code and I am able to scramble my board, however when I try to solve it some of my pieces go off the board on click and some even start to disappear on click. If anyone could help me with my for loop in my move function I would really appreciate it. I have posted my index and my game.js file which is my javascript i need help with. index.html Code: <?xml version="1.0" encoding="UTF-8"?>
<!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>
<title>Sliding Tiles</title>
<style type="text/css">
h1 {position:absolute; left:100px; font-family:arial}
p {position:absolute; left:100px; top:60px; color:red; font-family:arial; font-weight:bold}
.board {position:absolute; left:100px; width:400px; top:100px; height:400px; background-color:black; border-style:none}
div {position:absolute; width:94px; height:94px; background-color:aqua; border-style:solid; border-width:3px;
text-align:center; font-family:century; font-weight:bold; font-size:60px}
button {position:absolute; left:150px; width:300px; top:550px; height:50px;
background-color:silver; font-family:arial; font-weight:bold; font-size:30px}
</style>
<script src="game.js" type="text/javascript"></script>
</head>
<body>
<h1>Sliding Tiles
<a href="http://validator.w3.org/check?uri=referer">
<img src="valid-xhtml10.gif" alt="Valid XHTML 1.0!" style="border:0;width:88px;height:31px" /></a></h1>
<p>After starting a game, just click on the tile you'd like to move...</p>
<div class="board" id="board"></div>
<div id="tile1" style="left:100px; top:100px" onclick="move(1)">
1
</div>
<div id="tile2" style="left:200px; top:100px" onclick="move(2)">
2
</div>
<div id="tile3" style="left:300px; top:100px" onclick="move(3)">
3
</div>
<div id="tile4" style="left:400px; top:100px" onclick="move(4)">
4
</div>
<div id="tile5" style="left:100px; top:200px" onclick="move(5)">
5
</div>
<div id="tile6" style="left:200px; top:200px" onclick="move(6)">
6
</div>
<div id="tile7" style="left:300px; top:200px" onclick="move(7)">
7
</div>
<div id="tile8" style="left:400px; top:200px" onclick="move(8)">
8
</div>
<div id="tile9" style="left:100px; top:300px" onclick="move(9)">
9
</div>
<div id="tile10" style="left:200px; top:300px" onclick="move(10)">
10
</div>
<div id="tile11" style="left:300px; top:300px" onclick="move(11)">
11
</div>
<div id="tile12" style="left:400px; top:300px" onclick="move(12)">
12
</div>
<div id="tile13" style="left:100px; top:400px" onclick="move(13)">
13
</div>
<div id="tile14" style="left:200px; top:400px" onclick="move(14)">
14
</div>
<div id="tile15" style="left:300px; top:400px" onclick="move(15)">
15
</div>
<form action="">
<button onclick="initialize(); return false">Start a New Game</button>
</form>
</body>
</html>
game.js Code:
var rows = new Array(4)
rows[0] = new Array (4)
rows[1] = new Array (4)
rows[2] = new Array (4)
rows[3] = new Array (4)
function checkWin() {
var winner = false
var checker = new Array(4)
checker[0] = new Array (1, 2, 3, 4)
checker[1] = new Array (5, 6, 7, 8)
checker[2] = new Array (9, 10, 11, 12)
checker[3] = new Array (13, 14, 15, 0)
for (i = 0; i < 4; i++){
for (j = 0; j < 4; j++){
if (rows[i][j] == checker[i][j]){
winner = false
}
}
}
if (winner){
alert("Congratulations! You've Won!")
return true
}
return false
}
function move(tile){
var obj = document.getElementById('tile' + tile)
var win = false
for (i = 0; i < 4; i++){
for (j = 0; j < 4; j++){
if (rows[i][j] == tile){
if (j > 0 && rows[i][j - 1] == 0){
obj.style.left = (j - 2) * 100 + 'px'
rows[i][j - 1] = tile
rows[i][j] = 0
}else if (j < 3 && rows[i][j + 1] == 0){
obj.style.left = (j + 2) * 100 + 'px'
rows[i][j + 1] = tile
rows[i][j] = 0
}else if (i > 0 && rows[i - 1][j] == 0){
obj.style.top = (i - 2) * 100 + 'px'
rows[i - 1][j] = tile
rows[i][j] = 0
}else if (i < 3 && rows[i + 1][j] == 0){
obj.style.top = (i + 2) * 100 + 'px'
rows[i + 1][j] = tile
rows[i][j] = 0
}
win = checkWin()
if (win){
break
}
return
}
}
}
}
function initialize(){
var check = new Array (1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15)
for (i = 0; i < 4; i++) {
for (j = 0; j < 4; j++) {
if (i == 3 && j == 3){
rows[i][j] = 0
} else {
var n = Math.ceil(Math.random() * 15)
while (check[n - 1] == 0){
n = Math.ceil(Math.random() * 15)
}
rows[i][j] = n
check[n - 1] = 0
document.getElementById('tile' + n).style.left = (j + 1) * 100 + 'px'
document.getElementById('tile' + n).style.top = (i + 1) * 100 + 'px'
}
}
}
}
This is a code I wrote about a javascript game which you should click on each picture so that the puzzle will be done. I have nine pictures with each picture named 1.jpg 2.jpg --- 9.jpg I have three difficulties beginner intermediate hard . The code has logical errors I can't understand . can anybody help me <html> <head> <title> CAIS326 Assignment 3 </title> <script type="text/javascript"> <!-- var seconds = 0; var timerId; var time; var Click1 = 0,Click2 = 0,Click3 = 0,Click4 = 0,Click5 = 0,Click6 = 0,Click7 = 0,Click8 = 0,Click9 = 0; var Pictures = [1,2,3,4,5,6,7,8,9]; function SwapImages() { for(var q=0 ; q<9; q++) document.getElementById("image+q+").src = Pictures[Click+q+ -1]+".jpg"; } function RegisterClicks(Index) { if (Click1 == 0) Click1 = Index; else if (Click2 == 0) Click2 = Index; else if (Click3 == 0) Click3 = Index; else if (Click4 == 0) Click4 = Index; else if (Click5 == 0) Click5 = Index; else if (Click6 == 0) Click6 = Index; else if (Click7 == 0) Click7 = Index; else if (Click8 == 0) Click8 = Index; else if (Click9 == 0) Click9 = Index; for(var m=0; m<9; m++) { if (Click+m+ > 0 && Click+m + 1+ > 0){ SwapImages(); Click+m+ = 0; Click+m + 1+ = 0; } } } function startTimer() { if (document.form1.gamelevel[0].checked) time=60; else if (document.form1.gamelevel[1].checked) time=45; else time=30; // 1000 milliseconds = 1 second timerId = window.setInterval( "updateTime()", 1000 ); } function updateTime() { seconds++; soFar.innerText = seconds; if ( time == seconds) { seconds = 0; window.alert ("Game over Loser..."); clearTimeout(timerId); } } var array = new Array(9); for (var i=0; i<9; i++) { array[i] = i+1; } shuffle(); document.writeln("<table border=1>"); var b = 0; while (b < 9 ) { var num = array[b]; document.writeln("<tr><td><img src=\""+num+".jpg\" id =\"image"+num+" \" onClick=\"RegisterClicks("+num+")\" /></td>"); ++b; num = array[b]; document.writeln("<td><img src=\""+num+".jpg\" id =\"image"+num+" \" onClick=\"RegisterClicks("+num+")\" /></td>"); ++b; num = array[b]; document.writeln("<td><img src=\""+num+".jpg\" id =\"image"+num+" \" onClick=\"RegisterClicks("+num+")\" /></td></tr>"); ++b; } document.writeln("</table>"); function shuffle() { var k = 9; var RandNum; var Temp; for (var n=0; n<9; n++) { RandNum = Math.floor(Math.random()*k); Temp = array[k-1]; array[k-1] = array[RandNum]; array[RandNum] = Temp; k=k-1; } } //--> </script> </head> <body> <form name = "form1" action = ""> <input type="Radio" name = "gamelevel" Value = "Beginner" Checked = "true" /> <font color=#37448E>Beginner</font> <input type="Radio" name = "gamelevel" Value = "Intermediate" /> <font color=#37448E>Intermediate</font> <input type="Radio" name = "gamelevel" Value = "Advanced" /> <font color=#37448E>Advanced</font></div><br/><br/> <input type = "button" value = " start " onClick="startTimer()"/><br/> <p>Seconds you have spent viewing this page so far: <strong id = "soFar">0</strong></p> </form> </body> </html> I am creating a calculator app and I'm a bit stuck with number formatting. Example of how I would like a number to be formatted: $2,899,799 I currently have the formatting working except for the commas. I'm using the following code to achieve this. My result is currently showing up like this $2899799 Code: function format (expr, decplaces) {
var str = "" + Math.round (eval(expr) * Math.pow(10,decplaces))
while (str.length <= decplaces) {
str = "0" + str
}
var decpoint = str.length - decplaces
return str.substring(0,decpoint) + str.substring(decpoint,str.length);
}
function dollarize (expr) {
return "$" + format(expr,0)
//RESULT FIELDS
form.AnnualScrapSales.value = dollarize(((A - B) * (C2/100)) * G2)
is there a way to add to this "function format" code to also achieve the commas? I am using Javascript validation, for all my HTML control that are not run at server... Now i need to allow the user to enter only numbers in a textbox..If any of them apply characters alert should come.. How can i do that in javascript.... Hi all.. I've been trying to get random numbers in JS. It works when I assign fixed values, but when I want those values to come from a form, I get all the problems.. any comments on my script? Thanks. M [CODE] <script type="text/javascript"> function random() { var x=document.getElementById("text1").value;// num ingresado por el usuario var y=document.getElementById("text2").value; //var x=1; //var y=6; num=Math.floor(x + Math.random() * y); var r=document.getElementById("demo") r.innerHTML=num; } </script> [CODE] Hi, I have got a code here for lottery numbers, it has been asked to matches the draw number and it is not working, a help really needed from any kindness person. I am new to JavaScript, and I have been asked to complete the codes: <html> //Variables //------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- var draw = new Array; //Variable to use in Array to store entered draw numbers. var bb=0; //Variable for bonus ball to use in the bonus ball opening slash screen. var vbb=0; //Variable for valid bonus ball to be used in the bonus ball opening slash screen. var c=0; var date = new Date(); //Variable for time and date. //Syndicate numbers in Array //-------------------------------------------------------------------------------------------------------------------------------------------------------------- var set1 = new Array(); //Variable for set 1 syndicate numbers to use in Array. set1[0]=" 3"; //Number to be used in (set1) Array. set1[1]=" 9"; //Number to be used in (set1) Array. set1[2]=" 18"; //Number to be used in (set1) Array. set1[3]=" 27"; //Number to be used in (set1) Array. set1[4]=" 30"; //Number to be used in (set1) Array. set1[5]=" 33"; //Number to be used in (set1) Array. var set2 = new Array(); //Variable for set 2 syndicate numbers to use in Array. set2[0]=" 5"; //Number to be used in (set2) Array. set2[1]=" 7"; //Number to be used in (set2) Array. set2[2]=" 11"; //Number to be used in (set2) Array. set2[3]=" 12"; //Number to be used in (set2) Array. set2[4]=" 34"; //Number to be used in (set2) Array. set2[5]=" 42"; //Number to be used in (set2) Array. var set3 = new Array(); //Variable for set 3 syndicate numbers to use in Array. set3[0]=" 4"; //Number to be used in (set3) Array. set3[1]=" 15"; //Number to be used in (set3) Array. set3[2]=" 21"; //Number to be used in (set3) Array. set3[3]=" 23"; //Number to be used in (set3) Array. set3[4]=" 27"; //Number to be used in (set3) Array. set3[5]=" 31"; //Number to be used in (set3) Array. var syndicates = new Array(); //Variable to use in Array for syndicate numbers. syndicates[0]=set1; //String to use in Array for syndicate numbers. syndicates[1]=set2; //String to use in Array for syndicate numbers. syndicates[2]=set3; //String to use in Array for syndicate numbers. </script> </head> <body> <script> //The Opening ("Splash") screen to ask user for the six numbers and the bonus ball from number 1 to 49 //------------------------------------------------------------------------------------ for (counter=1; counter < 6; counter++) { //Opening brace on new line. do { //Opening brace on new line. dns=window.prompt("Please Enter Draw Number From 1 to 49 : ", counter); if (isNaN(dns) == true) dns=0; } while ((dns < 1) || (dns > 49)); var vd=draw.indexOf(dns); //Local variable to use in entering draw numbers for returning the position of the occurrence of the draw value as a string. if (vd >= 0) //If the value greater than 0, do... . { //Opening brace on new line. alert("Duplicate Number Entered!"); //Alert pop-up. counter--; // } else draw[counter]=dns; } while (vbb < 1) { do { bb=window.prompt("Please Enter Bonus Ball From 1 to 49 : ", counter); if (isNaN(bb) == true) bb=0; } while ((bb < 1) || (bb > 49)); var vd=draw.indexOf(bb); //Local variable to use in entering the bonus ball for returning the position of the occurrence of the bonus ball value as a string. if (vd >= 0) alert("Duplicate Number Entered!"); else vbb=1; } //Background colour and to display title, time and date //---------------------------------------------------------------------------------------------------------------------------------- document.body.style.background = "#FFB6C1"; document.write("<h2><u><p align=center>Lottery Number Checker</p></u></h2>"); document.write("<b>Time: </b>"); document.write(date.getHours()); document.write("."); document.write((date.getMinutes())); document.write("<br><b> Date: </b>"); document.write(date.getDate()); document.write("."); document.write(date.getMonth() + 1); document.write("."); document.write((date.getFullYear()), "<br><br><br>"); //Entered numbers, draw numbers, bonus ball, number of matches //---------------------------------------------------------------------------------------------------------------------------- document.write("<b>The numbers you have entered for the draw and bonus ball a </b>",(draw),", ",(bb),".<br><br><br>"); document.write("<b>Draw numbers from set 1 a </b>",(set1),"<br>"); document.write("<b>Draw numbers from set 2 a </b>",(set2),"<br>"); document.write("<b>Draw numbers from set 3 a </b>",(set3),"<br><br><br>"); displaymatches(); document.write("<br><br>"); document.write((bbcheck()),"<br><br><br>"); //Function to check draw and bonus ball against entries numbers //----------------------------------------------------------------------------------------------------------------------------------------------------- function drawcheck(dnums) { for (a=0; a < 6; a++) for (b=c; b < 6; b++) if (syndicates[a]=draw[b]); { document.write(dnums[a]," "); c=b; } } //Function for syndicate numbers hit //-------------------------------------------------------------------------------------------------------------------------------------------------- function hits(dnums) { for (d=0; d < 6; d++) for (e=c; e < 6; e++) if (syndicates[d] == draw[e]) { noh++; c=e; } return noh; } //Function to display matches//-------------------------------------------------------------------------------------------------------------------------------------------------- function displaymatches() { var times=syndicates.length; for (f=0; f < times; f++) { if (noh > 0) { document.write("<b>The number of hits for set ",f+1," is: </b>",noh,"<br>"); document.write("<b>Matching numbers for set ",f+1," are : </b>"); drawcheck(syndicates[f]); } else document.write("No hits for set ",f+1," this time <br>"); for (g=0; g < 6; g++) if (bb == syndicates[f][g]) document.write("<b><font color=blue>Matchig bonusball is: </b>",bb,"</font><br>"); document.write("<br><br>"); } } </script> </body> </html> I have a challenge I gave to myself. I want a script that asks me to put things in order. Say I want a quiz of family, order of age. I have a table with the left cell everybody's name I want a script where I click on a name and it moves over to the right hand cell, up top, then the next clicked named is put under it and so on until all the names are moved over. So far I have this, but I know there is a lot of room for improvment. any suggestions? <HTML> <HEAD> <TITLE>Put Bible books in proper order</TITLE> </head> <body> <h1>Hello World!</h1> <TABLE BORDER=5><TR><TD> <FORM NAME="BOOKS"> <script language="javascript" type="text/javascript"> alert('This is what an alert message looks like.'); FUNCTION TESTER() { ALERT('WORKS'); VAR GOOD=0; VAR BAD=0; if (BOOKS.FONE="A") { GOOD++; } ELSE { BAD++; }; ALERT("YOU HAVE INCORRECT"); } </script> <TABLE BORDER=0><TR><TD> <TABLE BORDER=1> <TR><TD><INPUT TYPE="BUTTON" VALUE="Adam" NAME="GONE" onClick="javascript:TEMP.value=this.value";> <TR><TD><INPUT TYPE="BUTTON" VALUE="Dave" NAME="GTWO" ONCLICK="javascript:TEMP.value=this.value";> <TR><TD><INPUT TYPE="BUTTON" VALUE="Kile" NAME="GTHREE" ONCLICK="javascript:TEMP.value=this.value";> <TR><TD><INPUT TYPE="BUTTON" VALUE="John" NAME="GFOUR" ONCLICK="javascript:TEMP.value=this.value;"> <TR><TD><INPUT TYPE="BUTTON" VALUE="Geroge" NAME="GTWO" ONCLICK="javascript:TEMP.value=this.value;"> </TABLE> <TD VALIGN="CENTER" ALIGN="CENTER" WIDTH=30> <INPUT TYPE="BUTTON" VALUE=" " NAME="TEMP"> <TD> <TABLE BORDER=1> <TR><TD><INPUT TYPE="BUTTON" VALUE="?????" NAME="FONE" ONCLICK="javascript:this.value=TEMP.value;TEMP.value=' '"> <TR><TD><INPUT TYPE="BUTTON" VALUE="?????" NAME="FTWO" ONCLICK="javascript:this.value=TEMP.value;"> <TR><TD><INPUT TYPE="BUTTON" VALUE="?????" NAME="FTHREE" ONCLICK="javascript:this.value=TEMP.value;"> <TR><TD><INPUT TYPE="BUTTON" VALUE="?????" NAME="FFOUR" ONCLICK="javascript:this.value=TEMP.value;"> <TR><TD><INPUT TYPE="BUTTON" VALUE="?????" NAME="FFIVE" ONCLICK="javascript:this.value=TEMP.value;"> </TABLE> </TABLE> <INPUT TYPE="BUTTON" NAME="CHECK" onClick="JAVASCRIPT:ALERT()" VALUE="CORRECT???"> </FORM> </TABLE> </BODY> </HTML> Box 1 - Box 2 / Box 3 and i put a round off number so the decimals dont give a million numbers the problem is...the math is wrong now.... someone please help me fix this.. <!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> <title>Calc</title> <script type="text/javascript"> function calculate() { var one = document.getElementById("one").value*1; var two = document.getElementById("two").value*1; var three = document.getElementById("three").value*1; document.getElementById("answer").value=((one-two)/three); ; } </script> </head> <body> Enter Number 1 <br> <br><input type="text" id="one" /><hr>Enter Number 2<br><br><input type="text" id="two" /><br><br><hr>Enter Average number<br><br><input type="text" id="three" /><br><br><button onclick="calculate();">Calculate</button> <br id="result"></center></br> Total <input type="text" readonly="readonly" id="answer" /><br><br></center> </body> </html> </td> </tr> </table> </center> </body> </html> Code: strapplicantid=document.getElementById('applicantid').value;
$.get("spt.asp"+ '?id=' + strapplicantid + '&rnde='+ Math.round(Math.random() * 10000), function(data){
alert("Data Loaded: " + data);
});
alert("here");
why is the alert("here") happenign before the alert dataloaded. I want to be albe to load the html into the variable data and then use that variable. How is this possible to do? Hello, I have to JS scripts running on a page, one is a fading slide-show acting as a header and the other is a light-box like image gallery. When I view a picture in the "light-box" mode it sits underneath the fading slide-show and I want it to be on top of everything - much like setting the z-index in css. Although I don't think this is the way to solve this. Anyway, you can check what I'm talking about here. Problem solved thanks to Philip M. ____________________________________________________________________________________ Here is the source code: Code: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<HTML>
<HEAD>
<TITLE>Order Forms</TITLE>
<SCRIPT>
/******************************* Form Calculations ************************************/
function calculate(fld, price) { // fld will equal pw1 or pe1
var dir = fld.name.charAt(1); // used to determine whether it is the East or West Form
var num = fld.name.charAt(2); // what Item number is it
var quant = fld.options[fld.selectedIndex].value; // how many of the items did the User choose
var subtotal = eval(quant * price);
// the eval converts a string to an Object property - in this case the value
// dir = East or West & num = Item number
// with this information we can post the result to appropriate Form &
// to the appropriate Field on the Form
eval('document.order.t' + dir + num).value = fix(subtotal);
var total = 0;
// this loop sums the totals for each of the Items to give us the Grand Total for that Form
for (i = 1; i < 11; i++) {
// does that particular Item have a "total" - in other words did the User choose this Item
var itemTotal = eval('document.order.t' + dir + i).value;
// total is a running sum of the Form's "subtotals"
if (parseFloat(itemTotal) > 0) total += parseFloat(itemTotal);
}
// prior to sticking in the Grand Total into the Total Field we need to "dollarize" the number
eval('document.order.total' + dir ).value = fix(total);
}
// a number like 6.6 should ultimately read as $6.60 and not $6.6
// a number like 6.6275 should ultimately read as $6.63
// the fix(total) function takes care of these particular problems
function fix(total) { // ie, total == 6.6275
var dollars = Math.floor(total); // dollars = 6
// browsers sometimes have rounding errors - 662.75 - 600 = 62.75
var cents = (total * 100) - (dollars * 100);
cents = Math.round(cents); // 63
if (cents < 10) cents = "0" + cents;
// .998 will become 1.00 so we need to increment the dollar value by one
if (cents == 100) dollars++;
// if cents equal 0 then dollars equal total or total + 1 incase of .998
if (dollars == total || dollars == Math.floor(total) + 1) cents = "00";
total = dollars + "." + cents; // 6.63
return total;
}
/******* End of Form Calculations ********/
</SCRIPT>
</HEAD>
<BODY BGCOLOR="#FFFFFF">
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td><form action="sendemail.php" method="post" name="order" id="order" onSubmit="return ValidateInput(this)"></td>
<td><input type="hidden" name="Formulaire de commande site Pain et Passion" value=""></td>
<td></td>
<td></td>
</tr>
<tr>
<td>Product</td>
<td>Price</td>
<td>Quantity</td>
<td>Total</td>
</tr>
<tr>
<td>Item 1</td>
<td>1.99</td>
<td><SELECT NAME="pw1" SIZE="1" ONCHANGE="calculate(this, 1.99)">
<OPTION VALUE="0">0</OPTION>
<OPTION VALUE="1">1</OPTION>
<OPTION VALUE="2">2</OPTION>
<OPTION VALUE="3">3</OPTION>
<OPTION VALUE="4">4</OPTION>
<OPTION VALUE="5">5</OPTION>
<OPTION VALUE="6">6</OPTION>
<OPTION VALUE="7">7</OPTION>
<OPTION VALUE="8">8</OPTION>
<OPTION VALUE="9">9</OPTION>
<OPTION VALUE="10">10</OPTION>
<OPTION VALUE="11">11</OPTION>
<OPTION VALUE="12">12</OPTION>
<OPTION VALUE="13">13</OPTION>
<OPTION VALUE="14">14</OPTION>
<OPTION VALUE="15">15</OPTION>
<OPTION VALUE="16">16</OPTION>
<OPTION VALUE="17">17</OPTION>
<OPTION VALUE="18">18</OPTION>
<OPTION VALUE="19">19</OPTION>
<OPTION VALUE="20">20</OPTION>
</SELECT></td>
<td><INPUT TYPE="text" NAME="tw1" SIZE="10" VALUE></td>
</tr>
<tr>
<td>Item2</td>
<td>2.99</td>
<td><SELECT NAME="pw2" SIZE="1" ONCHANGE="calculate(this, 2.99)">
<OPTION VALUE="0">0</OPTION>
<OPTION VALUE="1">1</OPTION>
<OPTION VALUE="2">2</OPTION>
<OPTION VALUE="3">3</OPTION>
<OPTION VALUE="4">4</OPTION>
<OPTION VALUE="5">5</OPTION>
<OPTION VALUE="6">6</OPTION>
<OPTION VALUE="7">7</OPTION>
<OPTION VALUE="8">8</OPTION>
<OPTION VALUE="9">9</OPTION>
<OPTION VALUE="10">10</OPTION>
<OPTION VALUE="11">11</OPTION>
<OPTION VALUE="12">12</OPTION>
<OPTION VALUE="13">13</OPTION>
<OPTION VALUE="14">14</OPTION>
<OPTION VALUE="15">15</OPTION>
<OPTION VALUE="16">16</OPTION>
<OPTION VALUE="17">17</OPTION>
<OPTION VALUE="18">18</OPTION>
<OPTION VALUE="19">19</OPTION>
<OPTION VALUE="20">20</OPTION>
</SELECT></td>
<td><INPUT TYPE="text" NAME="tw2" SIZE="10" VALUE></td>
</tr>
<tr>
<td>item3</td>
<td>3.99</td>
<td><SELECT NAME="pw3" SIZE="1" ONCHANGE="calculate(this, 3.99)">
<OPTION VALUE="0">0</OPTION>
<OPTION VALUE="1">1</OPTION>
<OPTION VALUE="2">2</OPTION>
<OPTION VALUE="3">3</OPTION>
<OPTION VALUE="4">4</OPTION>
<OPTION VALUE="5">5</OPTION>
<OPTION VALUE="6">6</OPTION>
<OPTION VALUE="7">7</OPTION>
<OPTION VALUE="8">8</OPTION>
<OPTION VALUE="9">9</OPTION>
<OPTION VALUE="10">10</OPTION>
<OPTION VALUE="11">11</OPTION>
<OPTION VALUE="12">12</OPTION>
<OPTION VALUE="13">13</OPTION>
<OPTION VALUE="14">14</OPTION>
<OPTION VALUE="15">15</OPTION>
<OPTION VALUE="16">16</OPTION>
<OPTION VALUE="17">17</OPTION>
<OPTION VALUE="18">18</OPTION>
<OPTION VALUE="19">19</OPTION>
<OPTION VALUE="20">20</OPTION>
</SELECT></td>
<td><INPUT TYPE="text" NAME="tw3" SIZE="10" VALUE></td>
</tr>
<tr>
<td>Item3</td>
<td>1.99</td>
<td><SELECT NAME="pw4" SIZE="1" ONCHANGE="calculate(this, 1.99)">
<OPTION VALUE="0">0</OPTION>
<OPTION VALUE="1">1</OPTION>
<OPTION VALUE="2">2</OPTION>
<OPTION VALUE="3">3</OPTION>
<OPTION VALUE="4">4</OPTION>
<OPTION VALUE="5">5</OPTION>
<OPTION VALUE="6">6</OPTION>
<OPTION VALUE="7">7</OPTION>
<OPTION VALUE="8">8</OPTION>
<OPTION VALUE="9">9</OPTION>
<OPTION VALUE="10">10</OPTION>
<OPTION VALUE="11">11</OPTION>
<OPTION VALUE="12">12</OPTION>
<OPTION VALUE="13">13</OPTION>
<OPTION VALUE="14">14</OPTION>
<OPTION VALUE="15">15</OPTION>
<OPTION VALUE="16">16</OPTION>
<OPTION VALUE="17">17</OPTION>
<OPTION VALUE="18">18</OPTION>
<OPTION VALUE="19">19</OPTION>
<OPTION VALUE="20">20</OPTION>
</SELECT></td>
<td><INPUT TYPE="text" NAME="tw4" SIZE="10" VALUE></td>
</tr>
<tr>
<td>Item4</td>
<td>3.99</td>
<td><SELECT NAME="pw5" SIZE="1" ONCHANGE="calculate(this, 3.99)">
<OPTION VALUE="0">0</OPTION>
<OPTION VALUE="1">1</OPTION>
<OPTION VALUE="2">2</OPTION>
<OPTION VALUE="3">3</OPTION>
<OPTION VALUE="4">4</OPTION>
<OPTION VALUE="5">5</OPTION>
<OPTION VALUE="6">6</OPTION>
<OPTION VALUE="7">7</OPTION>
<OPTION VALUE="8">8</OPTION>
<OPTION VALUE="9">9</OPTION>
<OPTION VALUE="10">10</OPTION>
<OPTION VALUE="11">11</OPTION>
<OPTION VALUE="12">12</OPTION>
<OPTION VALUE="13">13</OPTION>
<OPTION VALUE="14">14</OPTION>
<OPTION VALUE="15">15</OPTION>
<OPTION VALUE="16">16</OPTION>
<OPTION VALUE="17">17</OPTION>
<OPTION VALUE="18">18</OPTION>
<OPTION VALUE="19">19</OPTION>
<OPTION VALUE="20">20</OPTION>
</SELECT></td>
<td><INPUT TYPE="text" NAME="tw5" SIZE="10" VALUE></td>
</tr>
<tr>
<td>Item5</td>
<td>2.99</td>
<td><SELECT NAME="pw6" SIZE="1" ONCHANGE="calculate(this, 2.99)">
<OPTION VALUE="0">0</OPTION>
<OPTION VALUE="1">1</OPTION>
<OPTION VALUE="2">2</OPTION>
<OPTION VALUE="3">3</OPTION>
<OPTION VALUE="4">4</OPTION>
<OPTION VALUE="5">5</OPTION>
<OPTION VALUE="6">6</OPTION>
<OPTION VALUE="7">7</OPTION>
<OPTION VALUE="8">8</OPTION>
<OPTION VALUE="9">9</OPTION>
<OPTION VALUE="10">10</OPTION>
<OPTION VALUE="11">11</OPTION>
<OPTION VALUE="12">12</OPTION>
<OPTION VALUE="13">13</OPTION>
<OPTION VALUE="14">14</OPTION>
<OPTION VALUE="15">15</OPTION>
<OPTION VALUE="16">16</OPTION>
<OPTION VALUE="17">17</OPTION>
<OPTION VALUE="18">18</OPTION>
<OPTION VALUE="19">19</OPTION>
<OPTION VALUE="20">20</OPTION>
</SELECT></td>
<td><INPUT TYPE="text" NAME="tw6" SIZE="10" VALUE></td>
</tr>
<tr>
<td>Item6 </td>
<td>4.99</td>
<td><SELECT NAME="pw7" SIZE="1" ONCHANGE="calculate(this, 4.99)">
<OPTION VALUE="0">0</OPTION>
<OPTION VALUE="1">1</OPTION>
<OPTION VALUE="2">2</OPTION>
<OPTION VALUE="3">3</OPTION>
<OPTION VALUE="4">4</OPTION>
<OPTION VALUE="5">5</OPTION>
<OPTION VALUE="6">6</OPTION>
<OPTION VALUE="7">7</OPTION>
<OPTION VALUE="8">8</OPTION>
<OPTION VALUE="9">9</OPTION>
<OPTION VALUE="10">10</OPTION>
<OPTION VALUE="11">11</OPTION>
<OPTION VALUE="12">12</OPTION>
<OPTION VALUE="13">13</OPTION>
<OPTION VALUE="14">14</OPTION>
<OPTION VALUE="15">15</OPTION>
<OPTION VALUE="16">16</OPTION>
<OPTION VALUE="17">17</OPTION>
<OPTION VALUE="18">18</OPTION>
<OPTION VALUE="19">19</OPTION>
<OPTION VALUE="20">20</OPTION>
</SELECT></td>
<td><INPUT TYPE="text" NAME="tw7" SIZE="10" VALUE></td>
</tr>
<tr>
<td>Item7</td>
<td>5.99</td>
<td><SELECT NAME="pw8" SIZE="1" ONCHANGE="calculate(this, 5.99)">
<OPTION VALUE="0">0</OPTION>
<OPTION VALUE="1">1</OPTION>
<OPTION VALUE="2">2</OPTION>
<OPTION VALUE="3">3</OPTION>
<OPTION VALUE="4">4</OPTION>
<OPTION VALUE="5">5</OPTION>
<OPTION VALUE="6">6</OPTION>
<OPTION VALUE="7">7</OPTION>
<OPTION VALUE="8">8</OPTION>
<OPTION VALUE="9">9</OPTION>
<OPTION VALUE="10">10</OPTION>
<OPTION VALUE="11">11</OPTION>
<OPTION VALUE="12">12</OPTION>
<OPTION VALUE="13">13</OPTION>
<OPTION VALUE="14">14</OPTION>
<OPTION VALUE="15">15</OPTION>
<OPTION VALUE="16">16</OPTION>
<OPTION VALUE="17">17</OPTION>
<OPTION VALUE="18">18</OPTION>
<OPTION VALUE="19">19</OPTION>
<OPTION VALUE="20">20</OPTION>
</SELECT></td>
<td><INPUT TYPE="text" NAME="tw8" SIZE="10" VALUE></td>
</tr>
<tr>
<td>Item8</td>
<td>1.99</td>
<td><SELECT NAME="pw9" SIZE="1" ONCHANGE="calculate(this, 1.99)">
<OPTION VALUE="0">0</OPTION>
<OPTION VALUE="1">1</OPTION>
<OPTION VALUE="2">2</OPTION>
<OPTION VALUE="3">3</OPTION>
<OPTION VALUE="4">4</OPTION>
<OPTION VALUE="5">5</OPTION>
<OPTION VALUE="6">6</OPTION>
<OPTION VALUE="7">7</OPTION>
<OPTION VALUE="8">8</OPTION>
<OPTION VALUE="9">9</OPTION>
<OPTION VALUE="10">10</OPTION>
<OPTION VALUE="11">11</OPTION>
<OPTION VALUE="12">12</OPTION>
<OPTION VALUE="13">13</OPTION>
<OPTION VALUE="14">14</OPTION>
<OPTION VALUE="15">15</OPTION>
<OPTION VALUE="16">16</OPTION>
<OPTION VALUE="17">17</OPTION>
<OPTION VALUE="18">18</OPTION>
<OPTION VALUE="19">19</OPTION>
<OPTION VALUE="20">20</OPTION>
</SELECT></td>
<td><INPUT TYPE="text" NAME="tw9" SIZE="10" VALUE></td>
</tr>
<tr>
<td>Item9 (not working)</td>
<td>5.99</td>
<td><SELECT NAME="pw10" SIZE="1" ONCHANGE="calculate(this, 5.99)">
<OPTION VALUE="0">0</OPTION>
<OPTION VALUE="1">1</OPTION>
<OPTION VALUE="2">2</OPTION>
<OPTION VALUE="3">3</OPTION>
<OPTION VALUE="4">4</OPTION>
<OPTION VALUE="5">5</OPTION>
<OPTION VALUE="6">6</OPTION>
<OPTION VALUE="7">7</OPTION>
<OPTION VALUE="8">8</OPTION>
<OPTION VALUE="9">9</OPTION>
<OPTION VALUE="10">10</OPTION>
<OPTION VALUE="11">11</OPTION>
<OPTION VALUE="12">12</OPTION>
<OPTION VALUE="13">13</OPTION>
<OPTION VALUE="14">14</OPTION>
<OPTION VALUE="15">15</OPTION>
<OPTION VALUE="16">16</OPTION>
<OPTION VALUE="17">17</OPTION>
<OPTION VALUE="18">18</OPTION>
<OPTION VALUE="19">19</OPTION>
<OPTION VALUE="20">20</OPTION>
</SELECT></td>
<td><INPUT TYPE="text" NAME="tw10" SIZE="10" VALUE></td>
<tr>
<td><p align="right">grand total <img src="arrow.png" width="32" height="32" border="0" alt="" align="absmiddle"></p></td>
<td><input type="text" name="totalw" size="10" style="background: #87cefa;"></td>
<td align="left"><input type="submit" value="SEND YOUR ORDER" style="background: #87cefa;"></td>
</tr>
</tr>
<tr>
<td>Name</td>
<td><input type="text" name="name"></td>
<td></td>
<td></td>
</tr>
<tr>
<td>e-mail</td>
<td><input type="text" name="e-mail"></td>
<td></td>
<td></td>
</tr>
<tr>
<td>Phone</td>
<td><input type="text" name="phone"></td>
<td></td>
<td></td>
</tr>
</table>
</FORM>
</BODY>
</HTML>
Hello! I have a really simple JavaScript calculator I'm running, and for the life of me can not figure out how to solve this crazy number problem. It's not doing the math properly, and javascript is not my strongest suit. All my script does is take user input of numbers into a form field, subtract that from another form and multiply the answer of those two forms by whatever the user put in. Example: 210 (minus) 120 (multiplied by) .90 = 81 Here is the actual script: Code: // Calculator
function CalculateSum(Atext, Btext, Ctext, form)
{
var A = parseFloat(Atext);
var B = parseFloat(Btext);
var C = parseFloat(Ctext);
form.Answer.value = A - B * C;
}
/* ClearForm: this function has 1 argument: form.
It clears the input and answer fields on the form.
It needs to know the names of the INPUT elements in order
to do this. */
function ClearForm(form)
{
form.input_A.value = "";
form.input_B.value = "";
form.input_C.value = "";
form.Answer.value = "";
}
// end of JavaScript functions -->
And the html I am using: Code: <form name="Calculator" method="post">
<p>Base Average<input type=text name="input_A"></p>
<p>Current Average:<input type=text name="input_B"></p>
<p>Percentage of:<input type=text name="input_C"></p>
<p>Your ball speed is:
(miles per hour)
<input name="Answer" type=text readonly>
</p>
<p>
<input type="button" value="Calculate Handicap" name="AddButton" onClick="CalculateSum(this.form.input_A.value, this.form.input_B.value, this.form.input_C.value, this.form)">
<input type="button" value="Clear" name="ClearButton" onClick="ClearForm(this.form)">
</p>
</form>
Any help would be greatly appreciated! Hello, I am nearing completion on the modification of a Javascript/Html Order Form. The problem arises when I click on 'Submit Order' after filling in details and choosing a product. For some reason, the pop up box shows the correct product, but it shows the $ Total from the previous box in the table. Thank you all for your time in looking into this: Code: <html>
<head>
<title>JS Order</title>
<script language="JavaScript">
<!-- Start hiding from older browsers.
// This function displays the nag screen when a field hasn't been filled in.
function nag(form, field, x)
{
ufield=field.toUpperCase();
alert("Details missed " + ufield + "!" + "\n\nPlease fill in the field and submit the form again.");
form.elements[x].focus();
}
// This function is used to round the tax amount to the nearest hundreths.
function roundPrice(price)
{
// save a copy of the price in case it is an even dollar amount.
var workPrice = price;
// Make the price a string by adding a string 0 to the end.
workPrice += "0";
// Find out where the decimal point is.
var pointIndex = workPrice.indexOf(".",0);
// If there is a decimal point now check to see if it needs to be rounded up.
if (pointIndex >= "0") {
// Set an index for the thousands digit.
var thousands = pointIndex +3;
// if the third number past the decimal point is greater than or
// equal to 5, then we need to round up the hundredth digit.
if (workPrice.charAt(thousands) >= "5")
{
// Turn the price into a number.
workPrice=parseFloat(price);
// Round up the price.
workPrice=workPrice + .01;
// Turn it back into a string.
workPrice=workPrice + "0";
// Cut off the thousands on down.
rPrice = workPrice.substring(0,thousands);
} else {
// We didn't need to round the price up so cut off the
// thousands on down and return the price
rPrice = workPrice.substring(0,thousands);
}
// Its an even dollar amount so just put on the .00 on the end.
} else {
rPrice = price + ".00";
}
// Now return the rounded price.
return rPrice;
}
// This function calculates the form.
function updatePrice()
{
// Reset the subtotal price
var addPrice = 0;
// Reset the running total prices.
var nowPrice = 0;
// Reset the nubmer of part ordered.
var partcount = 0;
// Step through each element in the form.
for (i = 0; i < parseInt(self.document.forms[0].elements.length); i++)
{
// If the form element has "qty" in the name then we need to process it.
if (self.document.forms[0].elements[i].name.substring(0,3) == 'qty')
{
// If the item has a quantity of not 0, then we need to process it.
if (self.document.forms[0].elements[i].value != 0)
{
// Locate the cost
costIndex = i + 1;
// Increment the part counter.
partcount++;
// Get the actual value for the quantity.
nowQty = eval(self.document.forms[0].elements[i].value);
// Get the cost of the item.
nowPrice = eval(self.document.forms[0].elements[costIndex].value);
// Calculate the extended cost (i.e., quanty * cost).
nowPrice = eval(nowPrice * nowQty);
// Add to the subtotal.
addPrice += nowPrice;
}
}
}
// Round off the subTotal price.
subTotal=roundPrice(addPrice);
// Put the sub total price into the form.
self.document.forms[0].subtot.value = subTotal;
// Figure the tax.
tax = parseFloat(self.document.forms[0].taxrate.value * addPrice);
// Round off the tax price.
totalTax = roundPrice(tax);
// Put the total tax into the form.
self.document.forms[0].totaltax.value = totalTax;
// Start figuring the total including tax.
// Turn the price string into a number.
subPrice = parseFloat(addPrice);
// Turn the tax string into a number.
addTax = parseFloat(totalTax);
// Add the tax and subtotal to get the total price.
totalPrice = (addTax + subPrice);
// Round the total price.
finalPrice = roundPrice(totalPrice);
// Update the form with the total cost.
self.document.forms[0].cost.value = finalPrice;
// Update the form with the number of line items.
self.document.forms[0].items.value = partcount;
}
function orderIt(form)
{
// If the order is zero, display a message.
if (form.cost.value == "0.00")
{
alert("You have not ordered anything. Please select an item and re-submit your order.")
} else {
if (form.elements[0].value == "")
{
nag(form, form.elements[0].name,0)
} else if (form.elements[1].value == "")
{
nag(form, form.elements[1].name, 1)
} else if (form.elements[2].value == "")
{
nag(form, form.elements[2].name, 2)
} else if (form.elements[4].value == "")
{
nag(form, form.elements[4].name, 4);
} else if (form.elements[5].value == "")
{
nag(form, form.elements[5].name, 5);
} else if (form.elements[6].value == "")
{
nag(form, form.elements[6].name, 6);
} else if (form.elements[10].value == "")
{
nag(form, form.elements[10].name, 10);
} else {
var message = "You have ordered the following items:\n";
message = message + "Qty\tCost\tDescription\n";
// Step through each element in the form.
for (i = 0; i < parseInt(self.document.forms[0].elements.length); i++)
{
// If the form element has "qty" in the name then we need to process it.
if (self.document.forms[0].elements[i].name.substring(0,3) == 'qty' && self.document.forms[0].elements[i].value !=0)
{
// Get the quantity.
qtyItem = self.document.forms[0].elements[i].value;
costItem = self.document.forms[0].elements[i-2].value;
// Get the description.
descItem = self.document.forms[0].elements[i-1].value;
// add the line item to the confirmation message.
message = message + qtyItem + "\t" + costItem + "\t" + descItem + "\n";
}
}
message = message + "\nOrder total: $" + self.document.forms[0].cost.value
if (confirm(message))
{
self.document.forms[0].submit();
}
}
}
}
// end hiding from older browsers -->
</script>
</head>
<body bgcolor="white" text="black" alink="red" vlink="purple" link="blue" background="images/bkgrd.gif">
<p>
<table width=440>
<tr><td>
<p>
<form name=options method=post action="/cgi-bin/order.cgi">
<table border="0" width="100%" id="table1">
<tr>
<td width="109" align="right"><font face="Arial" size="2"> First Name:</font></td>
<td width="15"> </td>
<td align="left"><font size="1" face="Arial">
<input type=text name=FirstName size=30 maxlength=40></font></td>
</tr>
<tr>
<td width="109" align="right"><font face="Arial" size="2">Last Name:</font></td>
<td width="15"> </td>
<td align="left"><font size="1" face="Arial">
<input type=text name=LastName size=30 maxlength=40></font></td>
</tr>
<tr>
<td width="109" align="right"><font face="Arial" size="2">Address Line 1:</font></td>
<td width="15"> </td>
<td align="left"><font size="1" face="Arial">
<input type=text name=Address1 size=40 maxlength=40></font></td>
</tr>
<tr>
<td width="109" align="right"><font face="Arial" size="2">Address Line 2:</font></td>
<td width="15"> </td>
<td align="left"><font size="1" face="Arial">
<input type=text name=Address2 size=40 maxlength=40></font></td>
</tr>
<tr>
<td width="109" align="right"><font face="Arial" size="2">Suburb:</font></td>
<td width="15"> </td>
<td align="left"><font size="1" face="Arial">
<input type=text name=Suburb size=25 maxlength=40></font></td>
</tr>
<tr>
<td width="109" align="right"><font face="Arial" size="2">City:</font></td>
<td width="15"> </td>
<td align="left"><font size="1" face="Arial">
<input type=text name=City size=25 maxlength=40></font></td>
</tr>
<tr>
<td width="109" align="right"><font face="Arial" size="2">Postal Code:</font></td>
<td width="15"> </td>
<td align="left"><font size="1" face="Arial">
<input type=text name=PostalCode size=15 maxlength=40></font></td>
</tr>
<tr>
<td width="109" align="right"><font face="Arial" size="2">Country:</font></td>
<td width="15"> </td>
<td align="left"><font size="1" face="Arial">
<input type=text name=Country size=15 maxlength=40 value=NZ></font></td>
</tr>
<tr>
<td width="109" align="right"><font face="Arial" size="2">Home Phone:</font></td>
<td width="15"> </td>
<td align="left"><font size="1" face="Arial">
<input type=text name=HomePhone size=20 maxlength=40></font></td>
</tr>
<tr>
<td width="109" align="right"><font face="Arial" size="2">Mobile Phone:</font></td>
<td width="15"> </td>
<td align="left"><font size="1" face="Arial">
<input type=text name=MobilePhone size=20 maxlength=40></font></td>
</tr>
<tr>
<td width="109" align="right"><font face="Arial" size="2">E-Mail Address:</font></td>
<td width="15"> </td>
<td align="left"><font size="1" face="Arial">
<input type=text name=EmailAddress size=30 maxlength=40></font></td>
</tr>
<tr>
<td width="109" align="right"><font face="Arial" size="2">Domain Name:</font></td>
<td width="15"> </td>
<td align="left"><font size="1" face="Arial">
<input type=text name=DomainName size=30 maxlength=40></font></td>
</tr>
</table><br>
<font face="Arial" size="2">Enter a quantity of 1 into the package you require.<br><br>
Monthly payments incur a $2 per month administration fee.
Set up is <b>free</b> for all packages (for a limited time).</font><br><br>
<table border=1 cellpadding=2 width="500" bordercolorlight="#808080">
<tr>
<th><font face="Arial" size="2">Description</font></th>
<th><font face="Arial" size="2">Qty</font></th>
<th><font face="Arial" size="2">Total</font></th>
</tr>
<tr>
<td align=center><font size="1" face="Arial"><input type=hidden name="desc1" value="Basic Monthly">
</font><font face="Arial" size="2">Basic Package <BR><B> Pay Monthly</B></font></td>
<td align=center><font size="1" face="Arial"><input type=text name="qty1" size=3 maxlength=3 value="0" onchange="updatePrice()"></font></td>
<td align=center><font size="1" face="Arial"><input type=hidden name="cost1" value="11.99">
</font><font face="Arial" size="2">$11.99</font></td>
</tr>
<tr>
<td align=center><font size="1" face="Arial"><input type=hidden name="desc2" value="Basic PrePay 1 Year">
</font><font face="Arial" size="2">Basic Package - $9.99 per month<BR><B> Pre-pay 12 mths (1 month free limited offer) </B>
</font></td>
<td align=center><font size="1" face="Arial"><input type=text name="qty2" size=3 maxlength=3 value="0" onchange="updatePrice()"></font></td>
<td align=center><font size="1" face="Arial"><input type=hidden name="cost2" value="109.89">
</font><font face="Arial" size="2">$109.89</font></td>
</tr>
<tr>
<td align=center><font size="1" face="Arial"><input type=hidden name="desc3" value="Basic PrePay 2 Years">
</font><font face="Arial" size="2">Basic Package - $8.99 per month<BR><B> Pre-pay 24 mths (2 months free limited offer) </B>
</font></td>
<td align=center><font size="1" face="Arial"><input type=text name="qty3" size=3 maxlength=3 value="0" onchange="updatePrice()"></font></td>
<td align=center><font size="1" face="Arial"><input type=hidden name="cost3" value="197.78">
</font><font face="Arial" size="2">$197.78</font></td>
</tr>
<tr>
<td align=center><font size="1" face="Arial"><input type=hidden name="desc4" value="Basic PrePay 3 Years">
</font><font face="Arial" size="2">Basic Package - $7.99 per month<BR><B> Pre-pay 36 mths (3 months free limited offer) </B>
</font></td>
<td align=center><font size="1" face="Arial"><input type=text name="qty4" size=3 maxlength=3 value="0" onchange="updatePrice()"></font></td>
<td align=center><font size="1" face="Arial"><input type=hidden name="cost4" value="263.67">
</font><font face="Arial" size="2">$263.67</font></td>
</tr>
<tr>
<td align=center><font size="1" face="Arial"><input type=hidden name="desc13" value="Deluxe Monthly">
</font><font face="Arial" size="2">Deluxe Package<BR><B> Pay Monthly</B></font></td>
<td align=center><font size="1" face="Arial"><input type=text name="qty13" size=3 maxlength=3 value="0" onchange="updatePrice()"></font></td>
<td align=center><font size="1" face="Arial"><input type=hidden name="cost13" value="21.99">
</font><font face="Arial" size="2">$21.99</font></td>
</tr>
<tr>
<td align=center><font size="1" face="Arial"><input type=hidden name="desc14" value="Deluxe PrePay 1 Year">
</font><font face="Arial" size="2">Deluxe Package - $19.99 per month<BR><B> Pre-pay 12 mths (1 month free limited offer) </B>
</font></td>
<td align=center><font size="1" face="Arial"><input type=text name="qty14" size=3 maxlength=3 value="0" onchange="updatePrice()"></font></td>
<td align=center><font size="1" face="Arial"><input type=hidden name="cost14" value="219.89">
</font><font face="Arial" size="2">$219.89</font></td>
</tr>
<tr>
<td align=center><font size="1" face="Arial"><input type=hidden name="desc15" value="Deluxe PrePay 2 Years">
</font><font face="Arial" size="2">Deluxe Package - $18.99 per month<BR><B> Pre-pay 24 mths (2 months free limited offer) </B>
</font></td>
<td align=center><font size="1" face="Arial"><input type=text name="qty15" size=3 maxlength=3 value="0" onchange="updatePrice()"></font></td>
<td align=center><font size="1" face="Arial"><input type=hidden name="cost15" value="417.78">
</font><font face="Arial" size="2">$417.78</font></td>
</tr>
<tr>
<td align=center><font size="1" face="Arial"><input type=hidden name="desc16" value="Deluxe PrePay 3 Years">
</font><font face="Arial" size="2">Deluxe Package - $17.99 per month<BR><B> Pre-pay 36 mths (3 months free limited offer) </B>
</font></td>
<td align=center><font size="1" face="Arial"><input type=text name="qty16" size=3 maxlength=3 value="0" onchange="updatePrice()"></font></td>
<td align=center><font size="1" face="Arial"><input type=hidden name="cost16" value="593.67">
</font><font face="Arial" size="2">$593.67</font></td>
</tr>
</table>
<font face="Arial" size="2">
<br>
</font>
<table border=1 cellpadding=2 width="500" bordercolorlight="#808080">
<tr>
<td align=center><font size="1" face="Arial"><input type=hidden name="desc17" value="Blogging Software Installation Service">
</font><font face="Arial" size="2">Installation Service<BR><B> Blogging software
(Wordpress etc)</B></font></td>
<td align=center width="39"><font size="1" face="Arial"><input type=text name="qty17" size=3 maxlength=3 value="0" onchange="updatePrice()"></font></td>
<td align=center width="63"><font size="1" face="Arial"><input type=hidden name="cost18" value="39.00">
</font><font face="Arial" size="2">$39.00</font></td>
</tr>
<tr>
<td align=center><font size="1" face="Arial"><input type=hidden name="desc19" value="Shopping Cart Installation Service">
</font><font face="Arial" size="2">Installation Service<BR><B> Shopping Cart
(ZenCart, osCommerce, Cubecart etc)</B></font></td>
<td align=center width="39"><font size="1" face="Arial"><input type=text name="qty19" size=3 maxlength=3 value="0" onchange="updatePrice()"></font></td>
<td align=center width="63"><font size="1" face="Arial"><input type=hidden name="cost19" value="349.00">
</font><font face="Arial" size="2">$349.00</font></td>
</tr>
</table>
<p>
<table width=500>
<tr>
<td align=right>
<div align="left">
<table cellpadding=1 cellspacing=1>
<tr>
<td colspan=2 align=right><font face="Arial" size="2">Sub Total: $</font><font size="1" face="Arial"><input name=subtot value="0.00" size=10 maxlength=10 onChange="updatePrice()"></font></td>
</tr>
<tr>
<td valign=bottom><font size="1" face="Arial"><input type=hidden value=".15" name=taxrate size=5 maxlength=5 onchange="updatePrice()">
</font></td>
<td align=right><font face="Arial" size="2">GST: $</font><font size="1" face="Arial"><input type=text name=totaltax size=10 maxlength=10 value="0.00" onChange="updatePrice()"></font></td>
</tr>
<tr>
<td colspan=2 align=right><font face="Arial" size="2">Total Order: $</font><font size="1" face="Arial"><input name="cost" type=text value="0.00" size=10 maxlength=10 onChange="updatePrice(this.form)"><input type=hidden maxlength=4 size=4 name=items></font></td>
</tr>
</table>
</div>
<p>
<font size="1" face="Arial">
<input type=button value="Submit Order" onClick="orderIt(this.form);" style="float: left"></font><font face="Arial" size="2">
</font><font size="1" face="Arial">
<input type=reset value="Clear Order" style="float: left"><font face="Arial" size="2">
</form>
</font></font>
</center>
</body>
</html>
Hi everyone, I am converting a program that displays the payment options as a list of check boxes to a drop down list. I have tried using onBlur(), etc. but the program is displaying my error that says I didn't select a payment method. Here is the code, thanks for any hints or help! Code: <html>
<head>
<title>Order form</title>
<meta http-equiv="Content-Type" content="text/javascript">
<script type="text/javascript">
function total()
{
var subtotal=0;
var total=0;
var adjustment=1;
payment=false;
var elmnts=document.payform.elements;
for (var x=0; x<(document.payform.elements['item[]'].length); x++)
{
if (document.payform.elements['item[]'][x].checked)
{
subtotal=subtotal+parseFloat(document.payform.elements['item[]'][x].value);
}
}
for (var x=0; x<(document.payform.pay.length); x++)
{
if (document.payform.pay[x].checked)
{
adjustment=document.payform.pay[x].value;
payment=true;
}
}
if (payment)
{
total=subtotal*adjustment;
total = total.toFixed(2);
document.payform.display.value="subtotal: "+subtotal+"\rAdjustment: "+adjustment+"\rTotal: "+total;
}
else
{
window.alert("Please choose payment type.");
}
}
</script>
</head>
<body>
<form name="payform">
<table border="0" cellpadding="5">
<tr>
<td width="250" valign="top">
<b>Please buy some stuff!</b><br />
<input type="checkbox" name="item[]" value="14.99" />Chang $14.99<br />
<input type="checkbox" name="item[]" value="12.99" />Chartreuse verte $12.99<br />
<input type="checkbox" name="item[]" value="13.99" />Gnocchi di nonna Alice $13.99<br />
<input type="checkbox" name="item[]" value="14.99" />Gudbrandsdalsost $14.99<br /><br />
<b>Choose payment methods</b><br />
<select name = "pay" size = 0>
<option value = "0"></option>
<option value = "1.2">Monday order (20% service charge)</option>
<option value = "1.1">Personal check (10% service charge)</option>
<option value = ".8">Visa (preferred -- 20% discount)</option>
<option value = "1.2">MasterCard (10% discount)</option>
<option value = "1.2">Discover (10% discount)</option>
</select>
<br /><br />
<input type="button" value="Process Order" onClick="total()" />
<input type="reset" value="Reset Form" />
</td></tr>
<tr>
<td width="200" valign="bottom">
<textarea name="display" rows="5" cols="35"></textarea></td>
</tr>
</table>
</form>
</body>
</html>
Hi folks! I know this is a really simple script, but I'm still a beginner, still learning and struggling..haha thanks for sticking with me Anyway my aim here is to have x,y, or z Div come to the front onClick. I've figured out how to do it with two Div's (using the code below) but not with 3 or more. I'm not attached to the code, so if you want to suggest something totally different I am all ears! Thank you greatly! ian Code: <script>
function changeZunder() {
layer1.style.zIndex = 1;
layer2.style.zIndex = 2;
}
function changeZover() {
layer1.style.zIndex = 2;
layer2.style.zIndex = 1;
}
</script>
----
<body>
<div id="layer1" style="z-index: 1; position: absolute;" onClick="changeZover()">
FIRST BOX
</div>
<div id="layer2" style="z-index: 1; position: absolute;" onClick="changeZunder()">
SECOND BOX
</div>
</body>
Using the Photoslide, GK News Image VI, as seen here tools.gavick.com/demo/ni6, however its in ID order, listed. I would like to change the order of ID to Random Order. Can you please help, what code would need changing. thank you its javascript. code below: Fx.Height = Fx.Style.extend({initialize: function(el, options){$(el).setStyle('overflow', 'hidden');this.parent(el, 'height', options);},toggle: function(){var style = this.element.getStyle('height').toInt();return (style > 0) ? this.start(style, 0) : this.start(0, this.element.scrollHeight);},show: function(){return this.set(this.element.scrollHeight);}});Fx.Opacity = Fx.Style.extend({initialize: function(el, options){this.now = 1;this.parent(el, 'opacity', options);},toggle: function(){return (this.now > 0) ? this.start(1, 0) : this.start(0, 1);},show: function(){return this.set(1);}}); // window.addEvent("load",function(){ document.getElementsBySelector(".gk_ni_6_wrapper").each(function(el){ // generowanie rdzenia var mainwrap = el; var elID = el.getProperty("id"); var $G = $Gavick[elID]; var wrap = $(elID); var mouseIsOver = false; var scrollValue = 0; // var addWidth = $E("div",el).getStyle("padding-left").toInt() + $E("div",el).getStyle("padding-right").toInt() + $E("div",el).getStyle("margin-right").toInt(); // el.setStyle("width",(el.getStyle("width").toInt() + addWidth) + "px"); // $G["actual_slide"] = -1; $G["actual_anim"] = false; $G["actual_anim_p"] = false; // var slides = []; var contents = []; var pasek = false; // if(window.ie && $E(".gk_ni_6_text_bg", wrap)) $E(".gk_ni_6_text_bg",wrap).setOpacity($G["opacity"].toFloat()); // wrap.getElementsBySelector(".gk_ni_6_slide").each(function(elmt,i){slides[i] = elmt;}); slides.each(function(el,i){if(i != 0) el.setOpacity(0);}); // if($E(".gk_ni_6_text_bg", wrap)){ var text_block = $E(".gk_ni_6_text_bg",wrap); $ES(".gk_ni_6_news_text",wrap).each(function(el,i){contents[i] = el.innerHTML;}); } // animacje var amount_c = contents.length-1; if($E(".gk_ni_6_text", wrap)) $E(".gk_ni_6_text",wrap).innerHTML = contents[0]; // var loadedImages = ($E('.gk_ni_6_preloader', wrap)) ? false : true; // if($E('.gk_ni_6_preloader', wrap)){ var imagesToLoad = []; // $ES('.gk_ni_6_slide',wrap).each(function(el,i){ var newImg = new Element('img',{ "src" : el.innerHTML, "alt" : el.getProperty('title') }); imagesToLoad.push(newImg); el.innerHTML = ''; newImg.injectInside(el); }); // var timerrr = (function(){ var process = 0; imagesToLoad.each(function(el,i){ if(el.complete) process++; }); // if(process == imagesToLoad.length){ $clear(timerrr); loadedImages = process; (function(){new Fx.Opacity($E('.gk_ni_6_preloader', wrap)).start(1,0);}).delay(400); } }).periodical(200); } var timerrr2 = (function(){ if(loadedImages){ $clear(timerrr2); // ---------- var NI2 = new news_image_6(); // $ES(".gk_ni_6_tab",mainwrap).each(function(elx,index){ var hover = $E(".gk_ni_6_hover" , elx); var opacity_anim = new Fx.Opacity(hover, {duration: 250, wait: false}); // elx.addEvent("mouseenter",function(){ hover.setStyle("display", "block"); opacity_anim.start(1); }); // elx.addEvent("mouseleave",function(){ opacity_anim.start(0); (function(){hover.setStyle("display", "none");}).delay(250); }); // elx.addEvent("click", function(){ if(!$G["actual_anim_p"]){ $E(".gk_ni_6_tab_active",mainwrap).setProperty("class","gk_ni_6_tab"); elx.setProperty("class","gk_ni_6_tab_active"); } // NI2.image_anim(elID,mainwrap,wrap,slides,index,contents,$G,false); }); }); $E(".gk_ni_6_tab",mainwrap).setProperty("class","gk_ni_6_tab_active"); NI2.image_anim(elID,mainwrap,wrap,slides,0,contents,$G,($G["autoanim"]==1)); /** Slider implementation **/ if($E('.gk_ni_6_tabsbar_slider',mainwrap)){ var $offset = $E(".gk_ni_6_tab",mainwrap).getStyle("height").toInt() + $E(".gk_ni_6_tab",mainwrap).getStyle("margin-bottom").toInt(); var scrollArea = $E('.gk_ni_6_tabsbar_wrap', mainwrap); var scrollableArea = $E('.gk_ni_6_tabsbar', mainwrap); var scrollAreaH = scrollArea.getSize().size.y; var scrollableAreaH = scrollableArea.getSize().size.y; var scroller_up = new Fx.Scroll(scrollArea, {duration: 250, wait: true, transition: Fx.Transitions.Circ.easeIn, onComplete: function(){scrollValue -= $offset;}}); var scroller_down = new Fx.Scroll(scrollArea, {duration: 250, wait: true, transition: Fx.Transitions.Circ.easeIn, onComplete: function(){scrollValue += $offset;}}); // $E('.gk_ni_6_tabsbar_up', mainwrap).addEvent("click",function(){ if(scrollValue > 0) { scroller_up.scrollTo(0, scrollValue-$offset);} }); // $E('.gk_ni_6_tabsbar_down', mainwrap).addEvent("click",function(){ if((scrollValue < (scrollableAreaH-scrollAreaH))) { scroller_down.scrollTo(0, scrollValue+$offset); } }); } }}).periodical(250); }); }); // var news_image_6 = new Class({ // text_anim : function(wrap,contents,$G){ var txt = $E(".gk_ni_6_text",wrap); if(txt){ if($G["anim_type_t"] == 0){ new Fx.Opacity(txt,{duration: $G["anim_speed"]/2}).start(1,0); (function(){ new Fx.Opacity(txt,{duration: $G["anim_speed"]/2}).start(0,1);txt.innerHTML = contents[$G["actual_slide"]]; }).delay($G["anim_speed"]); } else txt.innerHTML = contents[$G["actual_slide"]]; } }, // image_anim : function(elID,mainwrap,wrap,slides,n,contents,$G,play){ var max = slides.length-1; var links = $ES('.gk_ni_6_news_link', mainwrap); var readon = $E('.gk_ni_6_readmore_button a', mainwrap); if(!$G["actual_anim_p"] && n != $G["actual_slide"]){ $G["actual_anim_p"] = true; if(readon) readon.setProperty("href", links[n].innerHTML); var actual_slide = $G["actual_slide"]; $G["actual_slide"] = n; slides[n].setStyle("z-index",max+1); if(actual_slide != -1) new Fx.Opacity(slides[actual_slide],{duration: $G["anim_speed"]}).start(1,0); new Fx.Opacity(slides[n],{duration: $G["anim_speed"]}).start(0,1); this.text_anim(wrap,contents,$G); switch($G["anim_type"]){ case 0: break; case 1: new Fx.Style(slides[n],'margin-top',{duration: $G["anim_speed"]}).start((-1)*slides[n].getSize().size.y,0);break; case 2: new Fx.Style(slides[n],'margin-left',{duration: $G["anim_speed"]}).start((-1)*slides[n].getSize().size.x,0);break; case 3: new Fx.Style(slides[n],'margin-top',{duration: $G["anim_speed"]}).start(slides[n].getSize().size.y,0);break; case 4: new Fx.Style(slides[n],'margin-left',{duration: $G["anim_speed"]}).start(slides[n].getSize().size.x,0);break; } if(play){ $E(".gk_ni_6_tab_active",mainwrap).setProperty("class","gk_ni_6_tab"); $ES(".gk_ni_6_tab",mainwrap)[n].setProperty("class","gk_ni_6_tab_active"); } (function(){slides[n].setStyle("z-index",n);}).delay($G["anim_speed"]); (function(){$G["actual_anim_p"] = false;}).delay($G["anim_speed"]); var $this = this; if(!play) this.image_pause($G); if((play || $G["autoanim"] == 1) && ($G["actual_anim"] == false)){ $G["actual_anim"] = (function(){ n = (n < max) ? n+1 : 0; $this.image_anim(elID,mainwrap,wrap,slides,n,contents,$G,true); }).periodical($G["anim_speed"] * 2 + $G["anim_interval"]); } } }, // image_pause : function($G) { $clear($G["actual_anim"]); $G["actual_anim"] = false; } }); trying to make a very simple scrambler for a 15 puzzle, i just cant doanything to comlicated. here is my table. <table border="1" " cellpadding="50" align="center"> <tr> <td ><input type="button" id="1" value="1" onclick=" swap1(id);"></td> <td > <input type="button" id="2" value="2" onclick="swap2(id)"></td> <td> <input type="button" id="3" value="3" onclick="swap3(id)"> </td> <td> <input type="button" id="4" value="4" onclick="swap4(id)"> </td> </tr> <tr> <td> <input type="button" id="5" value="5" onclick="swap5(id)"> </td> <td> <input type="button" id="6" value="6" onclick="swap6(id)"> </td> <td> <input type="button" id="7" value="7" onclick="swap7(id)"> </td> <td> <input type="button" id="8" value="8" onclick="swap8(id)"> </td> </tr> <tr> <td> <input type="button" id="9" value="9" onclick="swap9(id)"> </td> <td> <input type="button" id="10" value="10" onclick="swap10(id)"> </td> <td> <input type="button" id="11" value="11" onclick="swap11(id)"> </td> <td> <input type="button" id="12" value="12" onclick="swap12(id)"> </td> </tr> <tr> <td> <input type="button" id="13" value="13" onclick="swap13(id)"> </td> <td> <input type="button" id="14" value="14" onclick="swap14(id)"> </td> <td> <input type="button" id="15" value="15" onclick="swap15(id)"> </td> <td> <input type="button" id="16" value="" onclick="swap16(id)"> </td> </tr> </table> <p align="center"><input type="button" id="scramble" value="Scramble" onclick="random(id)"></p> <br> |
|||||||