JavaScript - Please Help Solve Switch Statement For Me

Hi,

I'm trying to code a script that will display an approximate postage price based on different combinations of variables, but the numbers I defined for each case aren't reflected in the text box. I'm using a switch statement for all the different combinations of options, which the user will choose by selecting check-boxes.

I'd really appreciate if anyone could point out where I'm going wrong. (Additionally, I know that this code probably isn't a very efficient way of doing what I'm doing - I'm open to suggestions on how to improve it.)

I've attached all the relevant parts of the code, including how I defined variables originally.

Many thanks in advance,
Gil

Code:

<script type="text/javascript">


function count()
{
var firstclass = document.calc.firstclass.value;
var postcard = document.calc.firstclass.value;
var numpages = document.calc.numpages.value;
var nms = document.calc.nms.value;
var large = document.calc.large.value;
var numpages = parseInt(document.calc.numpages.value);

if (document.calc.grabber.checked)
{
var vweight = (numpages + 8) * 0.17636981;
} else {
var vweight = numpages * 0.17636981;
}

var postageprice = 0;
switch(postageprice)
{
case document.calc.postcard.checked:
var postageprice = 28;
break;
case document.calc.firstclass.checked && vweight <= 1:
var postageprice = 44;
break;
case document.calc.firstclass.checked && vweight <= 2:
var postageprice = 61;
break;
case document.calc.firstclass.checked && vweight <= 3:
var postageprice = 78;
break;
case document.calc.firstclass.checked && vweight <=3.5:
var postageprice = 95;
break;
case document.calc.firstclass.checked && document.calc.large.checked && vweight <= 1:
var postageprice = 88;
break;
case document.calc.firstclass.checked && document.calc.large.checked && vweight <= 2:
var postageprice = 105;
break;
case document.calc.firstclass.checked && document.calc.large.checked && vweight <= 3:
var postageprice = 122;
break;
case document.calc.firstclass.checked && document.calc.large.checked && vweight <= 4:
var postageprice = 139;
break;
case document.calc.firstclass.checked && document.calc.nms.checked && vweight <= 1:
var postageprice = 64;
break;
case document.calc.firstclass.checked && document.calc.nms.checked && vweight <= 2:
var postageprice = 81;
break;
case document.calc.firstclass.checked && document.calc.nms.checked && vweight <= 3:
var postageprice = 98;
break;
case document.calc.firstclass.checked && document.calc.nms.checked && vweight <= 3.5:
var postageprice = 105;
break;
case document.calc.firstclass.checked && document.calc.nms.checked && document.calc.large.checked && vweight <= 1:
var postageprice = 122;
break;
case document.calc.firstclass.checked && document.calc.nms.checked && document.calc.large.checked && vweight <= 2:
var postageprice = 139;
break;
case document.calc.firstclass.checked && document.calc.nms.checked && document.calc.large.checked && vweight <= 3:
var postageprice = 156;
break;
case document.calc.firstclass.checked && document.calc.nms.checked && document.calc.large.checked && vweight <= 4:
var postageprice = 173;
break;
default:
var postageprice = 0
}
document.calc.pay.value = postageprice
}

</script>
<form name="calc" method="POST">
<input type="text" name="numpages" size="10" value=10  onpropertychange="count()" onkeypress="keypress(event)" onclick="SelectAll()">
<input type=button name=clearnumber value="Clear" onclick="document.calc.numpages.value=0"> <p></p>

<input type="checkbox" name="firstclass" size="10" onclick="count()"><p>
<input type="checkbox" name="large" size="10" onclick="count()"></p>
<p>
<input type="checkbox" name="nms" size="10" onclick="count()"></p>
<p>
<input type="checkbox" name="postcard" size="10" onclick="count()"></p>
<p>
<input type="checkbox" name="grabber" size="10" onclick="count()"></p>
<p>$<input type="text" name="pay" size="10">
$<input type="text" name="perthousand" size="10">


</p>


</form>

Thanks again.

Hi my goal was to archive a switch statement in javascript to check the users IE versions. Allowing me to switch my javascript code to which will only work in other versions. Yet I don't know if a switch would be appropriate in this matter. Any tips ore suggestions are more then welcome.
Please let me know if a if statement would be better.

it involves large javascript code.

Code:

<script type="text/javascript" language="javascript">
if (/MSIE (\d+\.\d+);/.test(navigator.userAgent))
{
	var ieversion = new Number(RegExp.$1);
	
	switch (ieversion) 
	{
		case 8:
		document.write("IE 8")
		break;
		case 5:
		document.write("IE 5")
		break;
		case 6:
		document.write("IE 6")
		break;
		case 7:
		document.write("IE 7")
		break;

	}
}

</script>

Hey everyone, I'm a newbie writing a tic tac toe program using OOP. It was simple setting it up so that a player could click on a box to put an X or an O there, but I've run into serious issues when trying to make it so a player couldn't overwrite the AI's choice and the AI couldn't overwrite the player's.

An example of this would be if I made the top right box an X and the AI then made the center box an O, and then I accidentally clicked the center box and made it into an X. I want to prevent that.

Every box on the grid is an object with the property of "taken" that helps the program know if a box is empty or not, so as to avert any overwriting in the first place.

If the box is empty, this.taken = 0. If the box is filled by a player, taken = 1. If filled by AI, taken = 2. I made it matter whether it was AI or human so later i can check if one of them got tic tac toe. Anyway, by default the constructor class sets this.taken = 0. But the method for checking availability and writing the X or O uses a switch which checks if taken = 0. If it is, it sets taken to either 1 or 2 and writes the necessary symbol. If taken = 1 or 2, it just alerts the player that the spot is taken.

But for some reason the switch statement can't tell when taken = anything other than 0. It always executes the code for 0 even though the code for 0 inherently makes it so that taken never equals 0 again, which means case 0 cannot happen anymore.

Below is the code with notes.


Code:

function main(input){//start of main function//
		
	function Click(who, where, what){ //this is the method for checking if it's taken or not and writing the X or O if it isn't//


 /*the argument who represents a number. 0 is no one, 1 is human, 2 is AI; where is a string literal 
representing the spot on the grid*/

		switch(this.taken){
			
			case 0:
			this.taken = who;
			document.getElementById(where).innerHTML = what;
			break;
		
			case 1:
			alert("this spot is taken");
			break;
			
			case 2:
			alert("this spot is taken");
		}//end switch
	}//end Click
			

	function Box(inputhere){//start of class//	
		this.taken = 0;
		this.pick = Click;
	}

//end of Box class//

   //object declarations (I cut out most of them and left only the relevant ones//

	var topleft = new Box();
        var topmid = new Box();
	var topright = new Box();
	var centerright = new Box();

   //end of object declarations//


	switch (input){

/*in each .pick(), the first arg is whether or not a player chose it (1 = player did, 2 = comp did). 
The second arg is which box and the third is whether to put an X or O. The input variable in the switch statement is an argument passed through main() when the 
player clicks on a box. Topleft passes 1.1, topmid passes 1.2 and so on.*/

			case 1.1:{

//The first instance of .pick() in each case is what the player did. The second is what the AI will do in repsonse.//

               
			topleft.pick(1, "topleft", "X");
                        topmid.pick(2, "topmid", "<span>O</span>");

		break;
			}//end of case 1.1
			
			case 1.3:{
			topright.pick(1, "topright", "X");
			centerright.pick(2, "centerright", "<span>O</span>");
		break;
			}//end of case 1.3
	}//end of switch


}//end of main//

Is there anyone who has any idea why on earth this is happening? I've been at it for an embarrassing amount of hours.

Also, thanks to anyone who even considers helping : )
(feel free to flame me if my code sucks or my post is too long or anything).

1)HOW TO SET THE DECIMAL TO 1 OR 2 POINT ONLY
2)HOW TO MAKE SURE ALL THE QUESTIONS ANSWERED B4 PERCENTAGE IS CALCULATED
why it is not working in firefox?
HERE IS THE EDITED CODE.

var numOfGroups = 12;

function calc() {
var score = 0;
for (var j=1; j<=numOfGroups; j++) {
var f = document["myform"]["ques"+j];
for (var i=0; i<f.length; i++) {
if (f[i].checked) {
score += Number(f[i].value /72 *100);
}
}
}
//confused here..do i need to create new function somenthing like this
function showScore() {
if(answered != answers.length) {
alert("You have not answered all of the questions yet!");
return false; OR
}

//if numOfGroups != 12 {

alert("You have not answered all of the questions yet!");
}
else{

alert ("Your Score is " + score);
return false;


}
</script>

hey guys, I'm not the quickest running in the race, but I'm slowly learning JavaScript.

I'm attempting to use the jQuery iviewer to control the viewing of images. I'm essentially making my own slideshow.

In any event, I'm trying to tag a map along with the image. The only way I know of doing this is with standard markup doing usemap="#map_name".

so here's my JavaScript code, and the HTML to follow.

Code:

 var $ = jQuery;
            $(document).ready(function(){
                  $("#viewer").iviewer(
                       {
                       src: "images/page11.jpg", 
                       update_on_resize: false,
                       initCallback: function ()
                       {
                           var object = this;
                           $("#in").click(function(){ object.zoom_by(1);}); 
                           $("#out").click(function(){ object.zoom_by(-1);}); 
                           $("#fit").click(function(){ object.fit();}); 
                           $("#orig").click(function(){  object.set_zoom(100); }); 
                           $("#update").click(function(){ object.update_container_info();});
                       },
                       onMouseMove: function(object, coords) { },
                       onStartDrag: function(object, coords) { return false; },
                       onDrag: function(object, coords) { } 
                  });

                  $("#viewer2").iviewer(
		      {
		      src: "images/page11.jpg",
		      update_on_resize:false,
		      initCallBack: function ()
		      {
		      document.images[0].useMap = "#map1";
		      }
		 });
            });

And the 'scaler'

Code:

function scalecoordimages(elImage, amount){
        var elMap = getMap(elImage)
        elImage.width *= amount;
        elImage.height *= amount;
        if (null != elMap){
           for (var intLoop = 0; intLoop < elMap.areas.length;
                   intLoop++)  {
               var elArea = elMap.areas[intLoop];
               var coords = elArea.coords.split(",");
               var scaledCoords = "";
               for (coords in coords) {
                    scaledCoords += (coords[coord] * amount) + ",";
               }

                elArea.coords = scaledCoords;
             }
        }
    }

and now the HTML where this is all delivered.

Code:

<div class="wrapper">
      <div id="viewer2" class="viewer" style="margin: 50px auto;"></div>
</div>

the 'wrapper' is because in Safari the overflow doesn't hold properly and breaks.

the Map is just rectangles...it's below >

Code:

<map name="map1" id="map1">
                        <area class="hotspot" shape="rect" coords="105, 1110, 371, 1125" href="" onMouseOver="tooltip.show('<ul>Northeast States:<br /><li>Connecticut</li><li>Maine</li> <li>Massachusetts</li><li>New Hampshire</li><li>Rhode Island</li><li>Vermont</li><li>New Jersey</li><li>New York</li><li>Pennsylvania</li></ul>');" onMouseOut="tooltip.hide();" >	
                        
                        <area class="hotspot" shape="rect" coords="105, 1135, 371, 1150" href="" onMouseOver="tooltip.show('<ul>Midwest States:<br /><li>Indiana</li><li>Illinois</li><li>Michigan</li><li>Ohio</li><li>Wisconsin</li><li>Iowa</li><li>Kansas</li><li>Minnesota</li><li>Missouri</li><li>Nebraska</li><li>North Dakota</li><li>South Dakota</li></ul>');" onMouseOut="tooltip.hide();"></area>
                        
                        <area class="hotspot" shape="rect" coords="105, 1160, 371, 1175" href="" onMouseOver="tooltip.show('<ul>Southern States:<br /><li>Delaware</li><li>Florida</li><li>Georgia</li><li>Maryland</li><li>North Carolina</li><li>South Carolina</li><li>Virginia</li><li>West Virginia</li><li>Alabama</li><li>Kentucky</li><li>Mississippi</li><li>Tennessee</li><li>Arkansas</li><li>Louisiana</li><li>Oklahoma</li><li>Texas</li></ul>');" onMouseOut="tooltip.hide();"></area>
                         
                        <area class="hotspot" shape="rect" coords="105, 1185, 371, 1200" href="" onMouseOver="tooltip.show('<ul>Western States:<br /><li>Arizona</li><li>Colorado</li><li>Idaho</li><li>New Mexico</li><li>Montana</li><li>Utah</li><li>Nevada</li><li>Wyoming</li><li>Alaska</li><li>Californai</li><li>Hawaii</li><li>Oregon</li><li>Washington</li></ul>')" onMouseOut="tooltip.hide();"></area>                    
                    </map>

Any help is appreciated. Thank you.

This is very basic yet i can find the answer. How do you stop a countdown function?

I have a form and the Js validation wont work on it. Here is the html




PHP Code:
    <form name="frm" action="index.php" method="POST" onsubmit="return validateForm();">
                            <table width="100%" border="0" cellspacing="2" cellpadding="3"  class="mainForm">
                                <tr>
                                <td class="normalText" align="left" style="padding:0px 0px 0px 33px">
                                    <table border="0" cellspacing="3" cellpadding="2">
                                        <tr>
                                            <td class="normalHeading" colspan="2" style="padding-bottom:6px">
                                    
                                                <div id="error_msg" class="txtErrorMsg" align="center"></div>
                                        <!--        <?php echo "<p id=\"error_msg\">".$message."</p>"?> -->
                                            </td>
                                        </tr>
                                        <tr >
                                            <td class="normalText" width="30%">First Name</td>
                                            <td><input type="text" name="firstName" id="firstName"  class="input1" style="width:195px" maxlength="10"/></td>
                                        </tr>
                                        <tr>
                                            <td class="normalText">Last Name</td>
                                            <td><input type="text" name="lastName" id="lastName" class="input1" style="width:195px" maxlength="10"/></td>
                                        </tr>
                                        <tr>
                                            <td class="normalText">Mobile</td>
                                            <td><input type="text" name="mobile"  id="mobile" class="input1"  style="width:195px" maxlength="10" onkeypress="return fnIsIntNumber(event,this);"/></td>
                                        </tr>
                                        <tr>
                                            <td class="normalText">Email</td>
                                            <td><input type="text" name="email" id="email" class="input1"  style="width:195px" onblur="IsEmail(this.vlaue)"/></td>
                                        </tr>
                                        <tr>
                                            <td class="normalText">Comments</td>
                                            <td>
                                                <textarea name="comments" id="comment" cols="22" rows="3" ></textarea>    
                                            </td>
                                        </tr>
                                        
                                        <tr>
                                            <td class="normalText">&nbsp;</td>
                                            <td valign="middle"><input class="send" type="image" value='submit' src="images/submit.gif" name="submit" /></td>
                                        </tr>
                                    </table>
                                </td>
                            </tr>
                        </table>
                        </form>

and here is the JS

PHP Code:
var $j = jQuery.noConflict();
    function isValidEmail(str) {
       return (str.indexOf(".") > 2) && (str.indexOf("@") > 0);
    }
    function validateForm(){
            var firstName;
            var lastName;
            var email;
            var mobile;
            var comment;
            var error;
            
            firstName = $j('#firstName').val();
            lastName = $j('#lastName').val();
            email = $j('#email').val();
            mobile = $j('#mobile').val();
            comment = $j('#comment').val();
            if(firstName=='' || firstName.length < 3){
                error = 'Please Enter Your First Name';
                $j('#errormsg').html('<p class="errors">'+ error +'</p>');
                return false;
            }
            if(lastName=='' || lastName.length < 3){
                error = 'Please Enter Your Second Name';
                $j('#errormsg').html('<p class="errors">'+ error +'</p>');
                return false;
            }
            if(email=='' || !isValidEmail(email)){
                error = 'Please Enter Your Correct Email';
                $j('#errormsg').html('<p class="errors">'+ error +'</p>');
                return false;
            }
            //mob
            //$jmob_pattern = '^\d{10}$j';
            if(mobile.length != 10 || isNaN(mobile)){
                error = 'Please Enter Your Correct Mobile Number';
                $j('#errormsg').html('<p class="errors">'+ error +'</p>');
                return false;
            }
            
            
            if(comment.length < 10){
                error = 'Please Enter A Comment More Than 10 Characters';
                $j('#errormsg').html('<p class="errors">'+ error +'</p>');
                return false;
            }
            return true;
    } 


Can anybody tell me what the problem is

The following code is needed for the prettyphoto javascript popup. It works fine in Firefox and Safari, but not in any version of IE. Can anyone suggest why?

<script>
jQuery.noConflict();
$(document).ready(function(){
jQuery("a[rel^='prettyPhoto']").prettyPhoto();
});
</script>

Hey all ,
the attached file contains the source code of a MCQ exam , i need a JS code that solves that MCQ exam . I really need it and as soon as possible . thank you so much for your time


Best Regards,
MIG()ZZZZ

Please Check the webpage to see what I am trying to do. I am told It cant be done in HTML. That I will have to use Java Script. Can someone Please help me out here. Go to:

http://www.capthelm.net

If You can assist me please use the email link on my site.
Thanks.

The Captain

Hello
I'd really appreciate some help please, no other forum seems to have an answer for this.

Example :

I have a file called values.asp and in that file are 100 different variables all assigned a specific number.

I also have a results.asp file or a simple html page.

The target is to read a specific variable in the values.asp file and then display it in another asp file or standard HTML file using Javascript's document.write(variablename); method.

So in other words, i wish to fetch a specific variables value from values.asp and show it in another asp file or a simple html file using javascript.

Your help will be very much appreciated.
Thanks!
Ron

I am not super familiar with code - I can easily take code and with a little direction get the desired end result so anyone who can help me with this it will be VERY appreciated. I don't even know what terms to search in order to create a page that I am looking for....

So here goes:

I want to model our distributor page after a R E D K E N.com Distributor Locator Page.

Here is what happens....

There is a drop down menu of the 50 states, and when you select the state the table of information below changes.

screen shots below






I am sure this is fairly easy to resolve, however I don't know where to begin.

Thank You in advance for your time.

Kristi

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<title>
	Jackhammer
</title>

<meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />

<script type="text/javascript">
/* <![CDATA[ */ 

	var jackhammers = new Array(11); 
	var curJackhammer = 0; 
	var direction;
	var begin; 
	
	jackhammers[0] = "jackhammer0.gif"; 
	jackhammers[1] = "jackhammer1.gif"; 
	jackhammers[2] = "jackhammer2.gif"; 
	jackhammers[3] = "jackhammer3.gif"; 
	jackhammers[4] = "jackhammer4.gif"; 
	jackhammers[5] = "jackhammer5.gif"; 
	jackhammers[6] = "jackhammer6.gif"; 
	jackhammers[7] = "jackhammer7.gif"; 
	jackhammers[8] = "jackhammer8.gif"; 
	jackhammers[9] = "jackhammer9.gif"; 
	jackhammers[10] = "jackhammer10.gif"; 
	
	function bounce()
	{
		if(curJackhammer == 10) 
			curJackhammer = 0; 
		else
			++curJackhammer; 
		
		/* 
		    Firefox does not register an error with the line of code below, but other browsers do . . . 
		    It looks like it is a typo left over from the slightly more advanced technique in 10-4 where 
		    jackhammers.src is defined.  Also, were you to comment out the final line in this function you would 
		    see the animation does not work.  In browsers other than Firefox which apparently just ignores 
		    this code and no animation occurs, the image element is assigned the source value of "undefined"
		    and of course no image is named "undefined".  
		*/
		 
		document.getElementsByTagName('img')[0].src = jackhammers[curJackhammer].src; 
		
		if(curJackhammer == 0)
			direction = "up"; 
		else if(curJackhammer == 10)
			direction = "down"; 
		document.getElementsByTagName('img')[0].src = jackhammers[curJackhammer]; 
	} 
	
	function startBouncing() 
	{
		if(begin) 
			clearInterval(begin); 
		begin = setInterval("bounce()",90); 
	} 

/* ]]> */ 
</script>

</head>
<body>

	<h1>
		Jackhammer Man
	</h1>
	
	<p>
		<img src="jackhammer0.gif" height="113" width="100" alt="Image of a man with a jackhammer." />
	</p>
	
	<form action="" enctype="text/plain">
		<p>
			<input type="button" value="Start Bouncing" onclick="startBouncing();" />
			<input type="button" value="Stop Bouncing" onclick="clearInterval(begin);" />
		</p>
	</form>
	
</body>
</html>

My teacher insists that the above code is valid (straight out of our book). He says this because (I'm guessing) it runs okay in Firefox and other browsers. It also throws a ton of error messages in Chrome and makes no logical sense. We define the values of the jackhammer array as literal strings, and then the book instructs us to change the source of the image element on the page to jackhammers[i].src. It then has us change the source of the image element again, correctly at the end of the function. It also has us create a useless variable: "direction" (and I say useless because we never use it, it is just fluff I guess).

On a side note, would some of you guys like to check out this animation I created here and let me know what you think.

Thanks guys.

I'm getting 'XMLSerializer is undefined' when I used the below code snippet in Java script.
var xmlDoc=xmlhttp.responseXML;
var Xml2String=xmlhttp.responseXML.xml;
if (xmlDoc.xml) {
Xml2String=xmlDoc.xml;
}else{
Xml2String= new XMLSerializer().serializeToString(xmlDoc);
}

Please help me to solve this problem?

Thanks in advance.
airwindjai.

the title kind of sums it up... if I have an array of equations (I'm guessing they should be strings but they don't have to be) and a user-defined variable can that variable be used for the "x" in the equations? I already did the easy part ...

Code:

<!DOCTYPE html>
 <html>
 <head>
 </head>
 <body>
 <input onkeyup="solve(this.value)" /><br>
 <input id="box0" /><br>
 <input id="box1" /><br>
 <input id="box2" /><br>
 <script type="text/javascript">

var equations=["(x*9/5)+32","x+273.15","x-50*(8/13)"]
 
function solve(val){
for (var i = 0; i < equations.length; i++) {
document.getElementById("box"+i).value= //ummm...

	}
} 

</script>
 </body>
 </html>