Newsgroup: it.comp.lang.javascript
Titolo: How To Modify This Simple Catalog Script?

I have a script that automatically calculates the total of an item once its
checkbox & quantity is selected... What I'm trying to figure out is how can
i change the script so that i can hide the quantity box and set its value to
one, so that when the checkbox is selected the price will automatically show
up in the "total" field.
Basically what i need is to have the form function exactly as it does, but
without the "Quantity" boxes. The reason for this is : 1) Each one of my
items are exactly the same price, and 2) It is an unnecessary /extra step
for my form since each item can only have a quantity of one.
Any help would be GREATLY appreciated! (Thanks in advance)
Below is the script:
------------------------------------------------
<html>
<title>Your Web Page Title</title>
<body bgcolor=white>
<script language="JavaScript">
<!--
function createArray(size) {
for (var i=0; i < size; i++) {
  this[i] = null }
this.length = size;
return this
}
function Product(descrip, money) {
this.description = descrip;
this.price = money;
}
var items = new Object();
// STEP NUMBER ONE
// enter the color for rows of the table
// (either javascript name or hex code)
color1 = "tan";
color2 = "khaki";
// STEP NUMBER TWO:
// change the following declarations to fit your needs
//
// items[1] = new Product("Product 1 Name", 25.50);
// items[2] = new Product("Product 2 Name", 39.95);
//
// NOTE: You must define both the items array consecutively starting at 1.
//       Again, the index of both arrays starts at 1
items[1] = new Product("Product 1 Name", 25.50);
items[2] = new Product("Product 2 Name", 39.95);
items[3] = new Product("Product 3 Name", 5.23);
items[4] = new Product("Product 4 Name", 13);
// ***** NO NEED TO CHANGE ANY CODE AFTER THIS COMMENT ***
function SetLengths() {
var k=1;
while(items[k] != null) k++;
items.length = k;
}
SetLengths();
function writeSelect(num) {
// you can change the values in each quantity pop-up menu
// by changing the values in the options array below
leng = 10;
options = new createArray(leng);
options[0] = 0;
options[1] = 1;
options[2] = 2;
options[3] = 3;
options[4] = 4;
options[5] = 5;
options[6] = 6;
options[7] = 7;
options[8] = 8;
options[9] = 9;
html_code = "";
html_code += '<select size=1 name="quantity'+num+'" '
  + 'onChange="update(' + num + ')">';
for (o=0;o<leng;o++)
  html_code += '<option value="'+options[o]+'"'
   + ((o==0) ? ' selected>':'>') + options[o];
html_code += '</select>';
return html_code;
}
function writeShipping() {
// you can change the values in the shipping pop-up menu
// by changing the values in the options array below
// The first option adds no shipping to the total.
leng = 5;
options = new createArray(leng);
options[0] = "SEE SPECIAL INSTRUCTIONS";
options[1] = "PARCEL POST";
options[2] = "PRIORITY";
options[3] = "UPS";
options[4] = "FedEx";
html_code2 = "";
html_code2 += 'SHIPPING and HANDLING: <br><select size=1 name="shipping" '
  + 'onChange="update(1)">';
for (o=0;o<leng;o++)
  html_code2 += '<option value="'+options[o]+'"'
   + ((o==0) ? ' selected>':'>') + options[o];
html_code2 += '</select></td><td>';
html_code2 += '<input type="text" name="display_shipping" size=12
maxlength=12 value="0.00"
onFocus="document.form1.display_shipping.blur()">';
return html_code2;
}
function writeTableRow(i) {
document.write('<tr bgcolor="' + ((i%2 == 0) ? color1 : color2) +
'"><td><input type=checkbox name="menu' + i
  + '" onClick="update(' + i + ')">' + items[i].description
  + ' - $' + fix(items[i].price) + '&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</td>'
  + '<td valign=bottom><input type="text" value="0.00" name="price' + i + '"
'
  + 'size=12 maxlength=12 onFocus="document.form1.price' + i + '.blur()">'
  + '</td><td valign=bottom>' + writeSelect(i) + '</td></tr>');
}
function writeTable() {
document.write('<table cellspacing=8 cellpadding=0 border=0>'
  + '<tr><td><B>PRODUCT
CHOICES</B></TD><TD></TD><TD><B>QUANTITY</B></TD></TR>');
for (i=1; i<items.length; i++)
  writeTableRow(i);
document.write('<tr bgcolor="' + ((items.length%2==0) ? color1 : color2)
  + '"><td align=right>SUB TOTAL: </td><td><input type="text" '
  + 'name="subtotal" size=12 maxlength=12 value="0.00" '
+ 'onFocus="document.form1.subtotal.blur()"></td></tr>'
+ '<tr bgcolor="' + ((items.length%2==0) ? color2 : color1)
+ '"><td align=right>Do You Live In Texas?: <br><input type="radio" '
+ 'name="state" value="No" CHECKED onClick=update(1)>No<input type="radio"
'
+ 'name="state" value="Yes" onClick=update(1)>Yes = 8.25% Sales
Tax</td><td> '
+ '<input type="text" name="display_taxes" size=12 maxlength=12
value="0.00" '
+ 'onFocus="document.form1.display_taxes.blur()"</td></tr>'
+ '<tr bgcolor="' + ((items.length%2==0) ? color1 : color2)
+ '"><td align=right>' + writeShipping() + '</td></tr>'
+ '<tr bgcolor="' + ((items.length%2==0) ? color2 : color1)
+ '"><td align=right>GRAND TOTAL: </td><td><input type="text" '
+ 'name="grandtotal" size=12 maxlength=12 value="0.00" '
+ 'onFocus="document.form1.grandtotal.blur()"></td></tr></table>');
}
// document.write('<tr><td align=right>GRAND TOTAL: </td><td><input
type="text" '
//  + 'name="total" size=12 maxlength=12 value="0.00"></td></tr></table>');
// }
// The function below establishes the shipping charge based upon a
percentage
// of the total cost of the order. Adjust these factors as needed to vary
the
// shipping charges. These factors are applied based upon the selection in
the
// shipping select box.
var shipCost = ""
function shippingCost() {
shipCost = 0
if (document.form1.shipping.options[1].selected) {
   shipCost = .1 }  // shipping = 10% of total
if (document.form1.shipping.options[2].selected) {
   shipCost = .15 }  // shipping = 15% of total
if (document.form1.shipping.options[3].selected) {
   shipCost = .2 }  // shipping = 20% of total
if (document.form1.shipping.options[4].selected) {
   shipCost = .25 }  // shipping = 25% of total
}
function update(num) {
eval('q_selected = document.form1.quantity' + num + '.selectedIndex;');
eval('quant = document.form1.quantity' + num +
'.options[q_selected].value;');
if (eval('document.form1.menu' + num + '.checked'))
  cost = fix(items[num].price * quant);
else
  cost = fix(0);
eval('document.form1.price' + num + '.value = cost;');
var sub_total = 0;
for (i=1; i<items.length; i++)
  eval('sub_total += parseFloat(document.form1.price' + i + '.value);');
document.form1.subtotal.value = fix(sub_total);
shippingCost()
taxes = fix(sub_total) * .0825 // adjust for your tax rate.
with_Shipping = fix(sub_total) * shipCost
// if you want to establish a minimum shipping charge, adjust the statements
// below for the mimimum charge per category and uncomment the statements
/*
if ((with_Shipping < 4) && (document.form1.shipping.options[1].selected)) {
   with_Shipping = 4 // adjust to minimum shipping charge for shipping
option 1
}
if ((with_Shipping < 6) && (document.form1.shipping.options[2].selected)) {
   with_Shipping = 6 // adjust to minimum shipping charge for shipping
option 2
}
if ((with_Shipping < 8) && (document.form1.shipping.options[3].selected)) {
   with_Shipping = 8 // adjust to minimum shipping charge for shipping
option 3
}
if ((with_Shipping < 10) && (document.form1.shipping.options[4].selected))
{
   with_Shipping = 10 // adjust to minimum shipping charge for shipping
option 4
}
*/
// if you want to establish a maximum shipping charge, adjust the statements
// below for the top charge per category and uncomment the statements
/*
if ((with_Shipping > 10) && (document.form1.shipping.options[1].selected))
{
   with_Shipping = 10 // adjust to maximum shipping charge for shipping
option 1
}
if ((with_Shipping > 12) && (document.form1.shipping.options[2].selected))
{
   with_Shipping = 12 // adjust to maximum shipping charge for shipping
option 2
}
if ((with_Shipping > 16) && (document.form1.shipping.options[3].selected))
{
   with_Shipping = 16 // adjust to maximum shipping charge for shipping
option 3
}
if ((with_Shipping > 20) && (document.form1.shipping.options[4].selected))
{
   with_Shipping = 20 // adjust to maximum shipping charge for shipping
option 4
}
*/
if (document.form1.state[0].checked) {
   document.form1.display_taxes.value = "0.00"
} else {
  document.form1.display_taxes.value = fix(taxes)
}
document.form1.display_shipping.value = fix(with_Shipping)
grand_total = sub_total + taxes + with_Shipping
noTaxTotal = sub_total + with_Shipping
if (document.form1.state[0].checked) {
   document.form1.grandtotal.value = fix(noTaxTotal)
} else {
  document.form1.grandtotal.value = fix(grand_total)
}
}
function fix(num) {
string = "" + num;
if (string.indexOf('.') == -1)
  return string + '.00';
seperation = string.length - string.indexOf('.');
if (seperation > 3)
  return string.substring(0,string.length-seperation+3);
else if (seperation == 2)
  return string + '0';
return string;
}
function validate_form() {
validity = true;
if (document.form1.shopper_name.value == "") {
  alert('You must enter your name!');
  validity = false;
}
if (document.form1.email.value == "") {
  if (confirm("Do you want to enter your email address?"))
   valid = false;
  else
   document.form1.email.value = 'no email address';
}
if (document.form1.phone.value == "") {
  alert('You must enter your phone number!');
  validity = false;
}
if (document.form1.credit_card_number.value == "") {
  alert('You must enter the credit card number!');
  validity = false;
} else if (document.form1.expiration_date.value == "") {
  alert('You must enter the expiration date!');
  validity = false;
}
if (document.form1.bill.value == "") {
  alert('You must enter a billing address!');
  validity = false;
} else if (document.form1.mail.value == "") {
  if (!confirm("The mailing address is the same as the billing address?"))
   validity = false;
  else
   document.form1.mail.value = 'same as billing address';
}
if ((document.form1.instructions.value == "") &&
(document.form1.shipping.options[0].selected)) {
  alert('You must enter Shipping Instructions or select a shipment
method!');
  validity = false;
}
if (validity)
  alert("Thank you for your order!");
return validity;
}
// -->
</script>
<font face="Arial, Helvetica, Geneva" size=+2><b>
Online Shopping Catalog
</b></font><br><br>
<script language="JavaScript">
<!--
writeTable();   // writes all categories
document.write('<br><table cellspacing=0 cellpadding=5 '
+ 'bgcolor="' + color1 + '">');
// -->
</script>
<table>
<tr><td align=left>
Name: <input type="text" name="shopper_name" size=30><br>
Email: <input type="text" size=30 name="email"><br>
Area Code and Phone Number: <input type="text" size="14" name="phone"><br>
Credit Card Number: <input type="text" size="18" name="credit_card_number">
Exp: <input type="text" size="5" maxlength="5" name="expiration_date">
</td></tr>
<tr><td align=center>
Send Bill to:<br>
<textarea wrap=virtual rows=5 cols=30 name="bill"></textarea>
</td></tr><tr><td align=center>
Mail Order to:<br>
<textarea wrap=virtual rows=5 cols=30 name="mail"></textarea>
</td></tr><tr><td align=center>
Special Instructions:<br>
<textarea wrap=virtual rows=5 cols=30 name="instructions"></textarea>
</td></tr>
  <br>
<input type="submit" name="submit" value="*Send Your Order*">
<input type="reset" value="Start Over"><br>
</form>
</body>

 Any help would be GREATLY appreciated! (Thanks in advance)
"it.comp.lang.javascript" stands for "it[-alia].comp.lang.javasctipt 
where "it" means "it" (Italy) ierarchy. Are you sure of the place where 
you attached your post?
-- 
Ciao, Riccardo
------------------------------------------------------------------------
WebMaster: ----> 
http://www.jsdir.com
 <---- (aka 
http://www.jspoint.it
)
              All the JavaScript you need
------------------------------------------------------------------------
               Nessun traguardo è abbastanza lontano.
------------------------------------------------------------------------