...

View Full Version : would you look at my script



Kenney
07-05-2011, 02:17 AM
function hTools() {
var hTools = new Array(6);
hTools[0] = "hand tools";
hTools[1] = "saw";
hTools[2] = "hammer";
hTools[3] = "screwdriver";
hTools[4] = "wrench";
hTools[5] = "pliers";
}

if(hTools[0] == true)
{
document.forms[0].item_one.value ="0";

}
else if(hTools[1] == true)
{
document.forms[0].item_one.value ="$20.00"
}

then I call it fro an onchage selection list




<p><select name ="hTool" onchange ="return hTools();">
<option value ="hTool0">Hand Tool</option>



Item 1: <input type ="text" name ="item_one"

My script or my call or both is not working could you please look at it and tell me what I am doing wrong

BulletTimeBill
07-05-2011, 04:26 AM
You're not comparing hTools to anything.


if(hTools[0] == true)

Along with the rest of it is going to resolve true every time because hTools is not null, or not false. The equivalent of what you're doing is


foo = true;
bar = true;
if (foo == true){
//do some stuff
}else if(bar == true){
//do some stuff
}
//etc

As you can see, not very useful. So I think you have to change you function to include

function hTools() {
var hTools = new Array(6);
foo = hTools.selectedIndex.value;
hTools[0] = "hand tools";
hTools[1] = "saw";
hTools[2] = "hammer";
hTools[3] = "screwdriver";
hTools[4] = "wrench";
hTools[5] = "pliers";
}

if(foo == hTools[0])
{
document.forms[0].item_one.value ="0";

}
else if(foo == hTools[1])
{
document.forms[0].item_one.value ="$20.00"
}

Something like that anyway should work.

tfburges
07-05-2011, 04:52 AM
It isn't very clear what exactly you are trying to do... but I'll make a guess.

Do you want to update the value of the "item_one" input when the select menu is changed? And the value will be the price of that item?

If so, the easiest thing for you to do is set up an object (or an array) with the item names as the keys and the prices as the values. Make sure the keys of the object match the options' values in your select menu.

Your object would be:


var hTools = {
"hand tools":0,
"saw":20,
"hammer":12,
"screwdriver":2.34
"wrench":5,
"pliers":3.61
};


So now, when you make your select menu, match up the values of each option with the keys in that object. You'll see why in a minute!


<select onchange="document.getElementById('item_one').value = '$'+hTools[this.value];">
<option value="hand tools">hand tools</option>
<option value="saw">saw</option>
<option value="hammer">hammer</option>
<option value="screwdriver">screwdriver</option>
<option value="wrench">wrench</option>
<option value="pliers">pliers</option>
</select>
<input type="text" id="item_one" name="item_one" value="$0">


You'll notice that I added an "id" attribute to the text input. That's so that you can quickly get that element using "document.getElementById".

The "onchange" attribute I added to the select menu first gets "item_one" and then sets its value to the price given by the hTools object we created earlier. The reason we created the object like we did, with the keys the same as the option values, is so that we can quickly get those prices. Let's take a closer look...

(I'm going to highlight different parts of the same code multiple times.)

1) Okay so we already know that the highlighted part here is setting item_one's value to whatever is after the equal sign.
document.getElementById('item_one').value = '$'+hTools[this.value];

2) this.value is getting the value of the select menu whenever it is changed.
document.getElementById('item_one').value = '$'+hTools[this.value];

3) So suppose you change it to "saw"... it is essentially doing this:
document.getElementById('item_one').value = '$'+hTools["saw"];

And in the object, we have:
var hTools = {
"hand tools":0,
"saw":20,
"hammer":12,
"screwdriver":2.34
"wrench":5,
"pliers":3.61
};

4) So hTools["saw"] is equal to 20.

5) And of course the dollar sign highlighted here puts a dollar sign before the price.
document.getElementById('item_one').value = '$'+hTools["saw"];


Let me know if I need to further explain anything.

;)

Kenney
07-05-2011, 10:29 AM
You're not comparing hTools to anything.


if(hTools[0] == true)

Along with the rest of it is going to resolve true every time because hTools is not null, or not false. The equivalent of what you're doing is


foo = true;
bar = true;
if (foo == true){
//do some stuff
}else if(bar == true){
//do some stuff
}
//etc

As you can see, not very useful. So I think you have to change you function to include

function hTools() {
var hTools = new Array(6);
foo = hTools.selectedIndex.value;
hTools[0] = "hand tools";
hTools[1] = "saw";
hTools[2] = "hammer";
hTools[3] = "screwdriver";
hTools[4] = "wrench";
hTools[5] = "pliers";
}

if(foo == hTools[0])
{
document.forms[0].item_one.value ="0";

}
else if(foo == hTools[1])
{
document.forms[0].item_one.value ="$20.00"
}

Something like that anyway should work.

When I try this code it tells me the "foo" is undefined...am I leaving something out...

Kenney
07-05-2011, 10:32 AM
What i am trying to do is from a selection list choose either"hand tools" at a value of "0" or any of the other items at a value of "$20"...I am very new at this and am trying to learn how to do this for a project i am working on...I thank you for all of your help so far....I don't completely understand how you are saying to do this at the moment...Kenney

devnull69
07-05-2011, 10:41 AM
Let's go through it in a logical manner ... and you will ONLY need HTML to achieve want you want to achieve

Your HTML


<select name ="hTool">
<option value ="0">Hand Tool</option>
<option value ="20">Saw</option>
<option value ="20">Hammer</option>
<option value ="20">Screwdriver</option>
<option value ="20">Wrench</option>
<option value ="20">Pliers</option>
</select>


Depending on the user selection the select will have the correct value (either 0 or 20).

Do you really need the dollar value in item_one? Then you will have to copy it onchange


<select name ="hTool" onchange="copyValue()">
<option value ="0">Hand Tool</option>
<option value ="20">Saw</option>
<option value ="20">Hammer</option>
<option value ="20">Screwdriver</option>
<option value ="20">Wrench</option>
<option value ="20">Pliers</option>
</select>

function copyValue() {
document.forms[0].item_one.value = "$" + document.forms[0].hTool.value.toFixed(2);
}


Bottom line: If you use this code, it will work without the additional "item_one" field


<select name ="hTool">
<option value ="$0.00">Hand Tool</option>
<option value ="$20.00">Saw</option>
<option value ="$20.00">Hammer</option>
<option value ="$20.00">Screwdriver</option>
<option value ="$20.00">Wrench</option>
<option value ="$20.00">Pliers</option>
</select>

tfburges
07-05-2011, 05:12 PM
Did you read my post, Kenney?

Kenney
07-05-2011, 11:10 PM
/* <![CDATA[ */

function hTools() {
var hTools = new Array(6);
hTools[0] = "hand tools";
hTools[1] = "saw";
hTools[2] = "hammer";
hTools[3] = "screwdriver";
hTools[4] = "wrench";
hTools[5] = "pliers";
}

if(hTools[0] == true)
{
document.forms[0].item_one.value ="20";

}
else if(hTools[1] == true)
{
document.forms[0].item_one.value ="$20.00"
}


/* ]]> */
</script>

</head>

<body>
<div>
<!-- Your XHTML here -->
<h1>Purchase Order</h1>
<form action="FormProcessor.html" method="get" enctype="application/x-www-form-urlencoded"
onsubmit ="return confirmSubmit();"
onreset ="return confirmReset();">
<table border ="0">
<tr>
<td valign ="top">
<h3>Products</h3>
<p>Hand Tools <br />$20.00</p>
<p><select name ="hTool" onchange ="return hTools();" /></p>
<p>
<option value ="hTool0">Hand Tool</option>
<option value ="hTool1">Saw</option>
<option value ="hTool2">Hammer</option>
<option value ="hTool3">Screwdriver</option>
<option value ="hTool4">Wrench</option>
<option value ="hTool5">Pliers</option>
</select>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</p></td>

<td>&nbsp;
<p>Power Tools <br />$30.00</p>
<p><select name ="pTools" onclick="this.value=''">
<option value ="pTool0">Power Tool</option>
<option value ="pTool1">Circular Saw</option>
<option value ="pTool2">Drill</option>
<option value ="pTool3">Sabre Saw</option>
<option value ="pTool4">Belt Sander</option>
<option value ="pTool5">Table Saw</option>
</select></p></td></tr>
<table border ="0">
<tr>
<td valign ="top"><br /><br />
<p>
<h3>Shipping Fees</h3></p>
Item 1: <input type ="text" name ="item_one" onclick="this.value=''"
value ="" size ="25" />
Item 2: <input type ="text" name ="item_two" onclick="this.value=''"
value ="" size ="25" />
Shipping: <input type ="text" name ="shipping" onclick="this.value=''"
value ="" size ="25" />
Total: <input type ="text" name ="total" onclick="this.value=''"
value ="" size ="25" />
</table>

this is my project...I am trying to make the handtools show "0" when selcted and then the rest of the tools says"$20"...I am supposed to use an "if" "else" statement...this is for a class project...I have enclosed my code... can someone look at it and tell me why it doesn't work ...I am not understanding why this does not work...thank you Kenney

devnull69
07-06-2011, 12:16 AM
My conclusion: You can not be helped

Short excerpt about what is wrong with your code
1. You are using an array before it is initialized
2. You use the same array for string content and to compare its content with boolean values
3. Your code is missing functions that you call onsubmit and onreset
4. You neither read nor understood the previous answers



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum