JavaScript - Move Values Of Two Drop-down Menus To A List Box

I'm trying to move a list of names from a textbox (jim;bill;sam;cathy to a listbox. My code so will move the name to listbox but all one line. I need the list the names in the listbox so that can click them one at a time. Please see my code. How can I modify it to fill the list one name per line?



function addItem(){
var tb = $get('<%=txtWhoTo.ClientID%>');
var rightListbox = document.getElementById('<%=lstNDisplay.ClientID%>');

if(strText.length > 0){
var nlength = rightListbox.options.length;
rightListbox.options[nlength] = new Option(strText, nlength, false, false);
}

}

I don't want remove any names from the listbox till I click the "OK" button and overwrite what is in the textbox.

Hello! I am currently using this code on a webpage that lists the site members.

Code:

function toggleMenu(objID) {
if (!document.getElementById) return;
var ob = document.getElementById(objID).style;
ob.display = (ob.display == 'block')?'none': 'block';
}[

For some reason, and maybe this is the function of it (I am not sure,) when you click 'characters' on the tables lower down on the page, you are sent to the top of the page again.

Here is the page in question, if it's necessary: http://oursideofthemountain.webs.com/members.htm

Any help in this matter would be greatly appreciated! I am very new to Javascript, so please be patient with me!

Hi All,

Hope someone can help me with this.

I have been using a free javascript code to make some drop-down menus.

this is the link for the code on dynamic drive. http://www.dynamicdrive.com/dynamici...anylinkcss.htm

The script works fine and I have been using it for a while now. However, one of the websites that I run has just asked me to include a sub menu on one of the menu items.

I have managed to get the sub menu to show as requested by using the normal drop down menu and adding a Quote:
rev="lr"
and giving it another class and rel. However, When the link is hovered over the menu appears to the side as expected but when you move onto that "sub-menu" the original menu disappears. can anyone suggest what changes I would need to make so that the first menu does not disappear?

Any help would be greatly appreciated.

As you can tell I am new to JavaScript (hence the use of free codes)

Hi,

I am trying to use JavaScript for several linked drop down menus. The contents of the first drop down menu is defined in the code of the form, however, I do not know the best way to populate the following drop down menus depending on the selection of the previous.

I have something working with the following JavaScript code, however as there are lots of options I am not sure whether this is the best way of doing this.

Code:

 <script type="text/javascript">

function setYear(chosen, selbox) {
 
selbox.options.length = 0;
if (chosen == " ") {
  selbox.options[selbox.options.length] = new Option('Please select a year',' ');
setTimeout(setYear(' ',document.question.subject),5);
 
}
if (chosen == "1") {
  selbox.options[selbox.options.length] = new
Option('exam1','11');
  selbox.options[selbox.options.length] = new
Option('exam2','12');
selbox.options[selbox.options.length] = new
Option('exam3','13');
selbox.options[selbox.options.length] = new
Option('exam4','14');
selbox.options[selbox.options.length] = new
Option('exam5','15');
setTimeout(setYear('11',document.question.subject),5);

}




if (chosen == "2") {
  selbox.options[selbox.options.length] = new
Option('exam6','twoone');
  selbox.options[selbox.options.length] = new
Option('exam7','twotwo');
 selbox.options[selbox.options.length] = new
Option('exam8','twothree');
 selbox.options[selbox.options.length] = new
Option('exam8','twofour');
 selbox.options[selbox.options.length] = new
Option('exam9','twofive');
 selbox.options[selbox.options.length] = new

}
if (chosen == "3") {
  selbox.options[selbox.options.length] = new
Option('exam10','threeone');
  selbox.options[selbox.options.length] = new
Option('exam11','threetwo');
  selbox.options[selbox.options.length] = new
Option('exam12','threethree');
  selbox.options[selbox.options.length] = new

}


if (chosen == "11") {
  selbox.options[selbox.options.length] = new
Option('subject1','111');
}


}


</script>

This is what I have in the form:
Code:

   
        <td>Minimum DBS Year: </td><td colspan="2">
     <select name="DBSyear" onchange="setYear(document.question.DBSyear.options
[document.question.DBSyear.selectedIndex].value,
document.question.exam);">
<option value=" " selected="selected"> </option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
</select>
		</tr>
		<tr>
		<td>
		Exam Paper:
		</td>
		<td>
		 <select name="exam" onchange="setYear(document.question.exam.options
[document.question.exam.selectedIndex].value,
document.question.subject);">
<option value=" " selected="selected">Please select a year</option>
</select>
</td>
		</tr>
		<tr>
		<td>
		Subject:
		</td>
		<td>
		<select name="subject" size="1">
<option value=" " selected="selected">Please select an exam</option>
</select>
		</td>
		</tr>

How would I populate the drop down menus from tables in the database and filter the options depending on the previous drop down selection??

I would appreciate any help!

I'm currently looking to revamp the Link Exchange section on my website.

Rather than clutter it with banners, I am going to put all the links into a drop down menu, with the banner for the selected site under it.

The intention is that when you select a site from the list, the banner underneath changes. However, I can only get it to do this once, then it simply refuses to let you select anything else.

This is the code I am using to change it:

Code:

function defineimage()
{
	if (document.forms[0].gourl.value = "http://jeff.zhomg.com")
	{
		document.images.linkimage.src = '/images/exchange/jeff.gif'
	}
	else if (document.forms[0].gourl.value = "http://www.strangedrawingsartgallery.com")
	{
		document.images.linkimage.src = '/images/exchange/SCH.jpg'
	} 
}

And this is my drop down menu, and the image I'd like to change:

Code:

<p><select name="gourl" onChange="defineimage()">
  <option value="http://www.strangedrawingsartgallery.com" selected>Strange City Heroes</option>
  <option value="http://jeff.zhomg.com">Invincible Jeff</option>
  </select>&nbsp;<input type="submit" name="Submit" value="Go to Site" onClick="dropdown()"></p><p><img src="/images/exchange/SCH.jpg" alt="SCH" name="linkimage" width="468" height="60" border="0" id="linkimage"></p>

If you are unsure what I mean by this, you can see for yourself by going to the page in question and selecting 'Invincible Jeff' from the list. The banner will change, but you won't be able to change the selection again.

Many thanks (again) for the help.

Hi all,

I have been struggling on a bit of code for a while now. I need to populate a second drop down list (Region) based upon the selection of the first (County).
I have found a piece of code that works on its own and have adapted to suit my needs - see below. However, when I drop it into my main page the javascript is not working. It's because of the formObject but I just don't know enough to resolve this! Furthermore, I need the textboxes the user has already completed in the form to retain their value once the javascript kicks in as the completed form will submit to a database.

This piece of code is working well . . . .
Code:

<?php

$link = mysql_connect('myhost', 'myusername', 'mypassword') or die('Could not connect: ' . mysql_error());
mysql_select_db('mydatabase') or die('Could not select database');

if(isset($_GET["County"]) && is_numeric($_GET["County"]))
{
$County = $_GET["County"];
}

if(isset($_GET["Region"]) && is_numeric($_GET["Region"]))
{
$Region = $_GET["Region"];
}

?>

<script language="JavaScript">

function autoSubmit()
{
var formObject = document.forms['theForm'];
formObject.submit();
}

</script>

<form name="theForm" method="get">

<!-- County SELECTION BASED ON city VALUE -->

<?php

?>

<select name="County" onChange="autoSubmit();">
<option value=''</option>

<?php

//POPULATE DROP DOWN MENU WITH COUNTRIES FROM A GIVEN city

$sql = "SELECT * FROM county_regions";
$counties = mysql_query($sql,$link);

while($row = mysql_fetch_array($counties))
{
echo ("<option value=\"$row[CountyID]\" " . ($County == $row["CountyID"]? " selected" : "") . ">$row[County]</option>");
}

?>

</select>

<?php

?>

<br><br>

<?php

if($County!= null && is_numeric($County))
{

?>

<select name="Region" onChange="autoSubmit();">


<?php

//POPULATE DROP DOWN MENU WITH RegionS FROM A GIVEN city, County

$sql = "SELECT * FROM county_regions WHERE CountyID = $County ";
$Regions = mysql_query($sql,$link);

while($row = mysql_fetch_array($Regions))
{
echo ("<option value=\"$row[CountyID]\" " . ($Region == $row["CountyID"]? " selected" : "") . ">$row[Region]</option>");
}

?>

</select>

<?php

}

?>

What follows is my form where the javascript is not working - edited quite a bit to save on space!

Code:

<head>
 
<script language="JavaScript">

function autoSubmit()
{
var formObject = document.forms['subform'];
formObject.submit(); 
}

</script>

</head>

<form enctype="multipart/form-data" method="post" action="add_attraction01.php" FORM NAME="FormName">     
<input type="hidden" name="MAX_FILE_SIZE" value="32768" />    
<label for="Business_name">Business Name</label>    
<input type="text" size="60" STYLE="color: #FFFFFF; font-family: Arial, Helvetica, sans-serif; font-weight: bold; font-size: 12px; background-color: #72A4D2;"     
<id="Business_name" name="Business_name" maxlength=60/><font size="1" face="arial" color="red">Required field</font><br />    
<label for="StreetAddress">Address</label>    
<input type="text" size="60" rows="2" id="StreetAddress" name="StreetAddress" maxlength=120/><font size="1" face="arial" color="red">Required field</font><br />    
<label for="Town">Town</label>    <input type="text" size="25" id="Town" name="Town" maxlength=25/><font size="1" face="arial" color="red">Required field</font><br /> 

<?php

$link = mysql_connect('myhost', 'myusername', 'mypassword') or die('Could not connect: ' . mysql_error());
mysql_select_db('mydatabase') or die('Could not select database');

if(isset($_GET["County"]) && is_numeric($_GET["County"]))
{
$County = $_GET["County"];
}

if(isset($_GET["Region"]) && is_numeric($_GET["Region"]))
{
$Region = $_GET["Region"];
}

?>

<form name = "subform" method="get"> 

<select name="County" onChange="autoSubmit();"> 
<option value=''</option>

<?php

$sql = "SELECT * FROM county_regions";
$counties = mysql_query($sql,$link);

while($row = mysql_fetch_array($counties))
{
echo ("<option value=\"$row[CountyID]\" " . ($County == $row["CountyID"]? " selected" : "") . ">$row[County]</option>");
}

?>

</select>

<?php

?>

<br><br>

<?php

if($County!= null && is_numeric($County))
{

?>

<select name="Region" onChange="autoSubmit();">


<?php

$sql = "SELECT * FROM county_regions WHERE CountyID = $County ";
$Regions = mysql_query($sql,$link);

while($row = mysql_fetch_array($Regions))
{
echo ("<option value=\"$row[CountyID]\" " . ($Region == $row["CountyID"]? " selected" : "") . ">$row[Region]</option>");
}

?>

</select>

<?php

}

?>
<input type="text" size="20"id="Tel_No" name="Tel_No" maxlength=20 onkeypress="return isNumberKey(event)"/><font size="1" face="arial" color="red">Required field</font><br />    
<br/>    
<input type="submit" value="Submit your attraction" name="submit" onclick="return BothFieldsIdenticalCaseSensitive();"/>   
</form>
</body>
</html>

It's probably obvious to you guys!!

Thanks in advance for your help.

hey guys, happy new year! , I was wondering how to calculate an outcome/number through a combination of 4 drop down menus (drop down menu's 1 and 2 combine to form a specific value and menu's 3 and 4 combine to form a specific value), example ;
1st drop down menu (1*) = a,b,c,d,e
2nd drop down menu (2*) = 5,4,3,2,1
3rd drop down menu (3*)= a,b,c,d,e
4th drop down menu (4*)= 5,4,3,2,1

Example of drop down menu layout - View image: example

a->e = low to high (value) predominant value so b5>a1 ; d5>c1
5->1 = low to high (value)

Then the calculation involves the 1st and 2nd menu to form 1 value, so c3, e4 etc and the 3rd and 4th menu unite to form 1 value that is different from the first; c2, e3
So (1*2*) b3 ; (3*4*) b1 = x value
Also the value from 1*2* menu must be lower than value from menu 3*4*; so you cannot input 1*2* c4 ; 3*4* c5 /or b1 (so once the first menu is selected, the 3rd and 4th menu's wont show anything lower)

I am not sure the best way about going to calculate the value for x (generated from the menu combinations) however I can outline the values for each combination as it involves simple addition;
Example; 1*2* c5 ; 3*4* c4 = 39
Example; 1*2* c4 ; 3*4* c3 = 43
Example; 1*2* c3 ; 3*4* c2 = 44
Example; 1*2* c2 ; 3*4* c1 = 49
Therefore 1*2* c5 ; 3*4* c1 = 175 (c5>c4 + c4>c3 + c3>c2 + c2>c1 = 175)
Starting from a5 to e1 the values are as follows; [(a5->a4 = 17),17,17,17],[(a1->b5 = 22.5),22.5,22.5,22.5],[39.6,39.6,43,44],[49,56.7,56.7,60],[69,76.5,90,161],[189.5,216,(e2->e1 = 246.5),no further value (no f5)]

If you could help me out that would be amazing, appreciate any help/feedback in advance!

hi im new to javascript and after hours of trying to figure it out myself and failing, i might as well just ask for help

the problem is really simple...

http://i307.photobucket.com/albums/n...eaker/help.jpg
check the image^

what i want to do is after selecting an item from the drop down menu and clicking "Go" an image underneath the button will show up

ex.(i pick a and click on Go and an image of an airplane shows up, i pick b and click Go and an image of a boat shows up, etc)

help please?

Hello All,
I'm trying to find a script that would be able to do the following:
The are two drop down boxes, the first one populating the second (state/county --> town)
The first box is single choice, the second is multiple choice. I'm looking for a script that would be able to deal with generating the code for all possible values that could be chosen in the second drop down box.
The drop down boxes are part of a form which allow people to search for educational courses within areas of a state/county.

I've had a good root around the internet but am rapidly getting confused ...

many thanks in advance.
Si.

Hi,

I have created a global navigation includes document. Unfortunately the drop down menus that are part of the navigation aren't working. They worked fine when they were part of the page, but now that they are separated from the page as includes the drop down menus don't appear in my test site (posted to a web server). All other content in the includes file appears and works. Any ideas?

Thanks for your help.

I got no idea how to create a filter based on multiple drop menus to filter & sort data from php mysql query. Can anyone help me to write javascipt for this problem?

My php mysql query as below:-
mysql_select_db($database_winwin, $winwin);
$query_rsMobile = "SELECT product_detail.product_Id, product_detail.product, product_detail.product_category, product_detail.product_brand, product_detail.product_name, product_detail.product_price, product_detail.thumbnail_url, product_detail.product_url, product_detail.product_status, product_detail.commission, product_detail.product_added_date FROM product_detail WHERE product_detail.product='Mobile Devices' AND product_detail.product_status='For sales'";
$rsMobile = mysql_query($query_rsMobile, $winwin) or die(mysql_error());
$row_rsMobile = mysql_fetch_assoc($rsMobile);
$totalRows_rsMobile = mysql_num_rows($rsMobile);

Whereby:-
Product Brand: product_brand
Product price: product_price
Commission: commission
Product name: product_name
Product Thumbnail: thumbnail_url
Product URL: product_url

HTML for filters & sorter:-
<div id="filters">
<form action="" method="post" name="form_filters" id="form_filters">
<table width="750" border="0">
<tr>
<td>Brand:</td>
<td><select name="productBrand" id="productBrand">
<option value="All Brands">All Brands</option>
<option value="Sony Ericsson">Sony Ericsson</option>
<option value="Samsung">Samsung</option>
<option value="Nokia">Nokia</option>
</select></td>
<td>Price:</td>
<td><select name="priceRange" id="priceRange">
<option value="All Price">All Price</option>
<option value="Below RM1000">Below RM1000</option>
<option value="RM1000-RM1999">RM1000-RM1999</option>
<option value="RM2000 & Above">RM2000 & Above</option>
</select></td>
<td>Sort by:</td>
<td><select name="productSort" id="productSort">
<option value="Sort By Name">Name</option>
<option value="Sort By Price">Price</option>
</select></td>
<td><input name="Apply Filters" type="submit" value="Apply Filters"/></td>
<td><input name="Reset Filters" type="Reset" value="Reset Filters"/></td>
</tr>
</table>
</form>
</div>

Once user click on "Apply Filters" javascript has to sort list the product items.

HTML for Pager (Value for total items, display some page numbers with hyperlink (1,2,3....10,11,12), hyperlink to previous page, hyperlink to next page) :-

<div id="pager">
No. of items per page:
<select name="NumOfItem" id="NumOfItem">
<option value="20">20</option>
<option value="50">50</option>
<option value="100">100</option>
</select>
Total Item:
Pages ...
Next...
Previous
</div>

Javascript has to manage pager column.

HTML for Product display:-
<div id="product">
<div id="Thumbnail">
Here Javascript has to display Thumbnail image based on filters & sorter drop menus inputs. When click on this image page must redirect to "Product URL".
</div>
<div id="Price">
Here Javascript has to display "Price" based on filters & sorter drop menus inputs. When click on this "Price" page must redirect to "Product URL".
</div>
<div id="Commission">
Here Javascript has to display "Commission" image based on filters & sorter drop menus inputs. When click on this "Commission" page must redirect to "Product URL".
</div>
</div>

Javascript has to repeat regions (<div id="product"></div>)based on "NumOfItem" drop menu (number of items display per page) and also update the pager column

It adds fine when any number but 12.3 is used if 12.3 is used however it gives
54.099999999999994

var liu = [10.6,11.2,9.4,12.3,10.1];


var calculateTotal= function(raceTimes){
var totalTime;
var raceTime = raceTimes[0];
var i =0;
for (i = 0; i< 4; i++){

raceTime = raceTime+raceTimes[i];
totalTime = raceTime;
}
return totalTime;
};
var liuTotal = calculateTotal(liu);

console.log(liuTotal);

Hi guys, i'm trying to develop a code for my sister, i would like to use javascript
to finish off the following task:

1. I want to be able to select marks from 0 to 30, from 5 drop down boxes.
2. and as marks are selected, it should upgrade the total.
3. and then show me the total marks when finished.

i've got up to creating the drop down boxes, now it's just adding the values once selected.

Thanks! anyhelp would be welcome

Hi, I'm trying to find out the min and max values of randomly generated values in a array list. Its a checkout system that randomly add a customer to a queue and does the same to remove a customer depending on a randomly generated number. Ive managed to figure out the mean of the queue but can only display the total values added to the list rather than display when the queue was at it biggest value. If anyone can point me in the right direction it would be greatly appreciated.

___________________________________________________________________

import java.io.BufferedWriter;
import java.io.FileWriter;
import java.io.IOException;
import java.util.ArrayList;
import java.util.LinkedList;
import java.util.ListIterator;
import java.util.Queue;
import java.util.Random;


public class Checkout {

private Queue<String> tillQueue;
private int rndNumber;
private int currentLen;
private ArrayList <Integer>lengthList;
private Random r;
public Checkout()
{
tillQueue = new LinkedList<String>();
currentLen = 0; //current queue length
lengthList = new ArrayList <Integer>();
r= new Random();

}
public void simulation()
{
System.out.println("Time" + "\t" + "Rnd" + "\t" +"Queue Status");

for (int t=2; t<10; t++)
{
rndNumber =r.nextInt(6)+1;

if (rndNumber==2 || rndNumber==4 || rndNumber==6)
{
tillQueue.add(String.valueOf(t));
currentLen++;
}
else if ((rndNumber==1 || rndNumber==3) && !tillQueue.isEmpty())
{
tillQueue.remove();
currentLen--;
}
else if(rndNumber==5)
{
//do nothing
}
if(tillQueue.isEmpty())
{
System.out.println(t + "\t" + rndNumber + "\t" + "Queue is empty");
}
else
{
System.out.println(t + "\t" + rndNumber + "\t" + tillQueue.toString());
}

lengthList.add(new Integer(currentLen));
}
}
public double CalculateMeanLength()
{
double mean=0.0;
int sumOfLengths = 0;

for (int i = 0; i<lengthList.size();i++)
{
sumOfLengths=sumOfLengths+(Integer)lengthList.get(i).intValue();
}

mean = (double)sumOfLengths/lengthList.size();

return mean;
}

public int ShowMax()
{
int max = 0;
//i know its going to be a for loop of some kind but not sure how to do it//
}


----------------------------output via controller================

Time Rnd Queue Status
2 6 [2]
3 5 [2]
4 3 Queue is empty
5 5 Queue is empty
6 1 Queue is empty
7 5 Queue is empty
8 5 Queue is empty
9 4 [9]
mean length = 0.375
max length = 3
//the max length here should be 1

===========================================

Thanks in advance for your help

I have the following code working with the checkbox options but once I added a drop down menu with values, it doesn't calculate it. I've done some different things to try to add the drop down to the function but nothing would work that I've tried so far.

I have it setup so when a box is unchecked, that option is taken off the price, the drop down should do the same to switch between the options price.

Thanks for the help!

Code:

<script language="javascript">
totalOptions = 0;

function calculateTotalOptions(thisCheckbox){
	if (thisCheckbox.checked)
	{
		totalOptions += parseFloat(thisCheckbox.value);
	} else {
		totalOptions -= parseFloat(thisCheckbox.value);
	}
	document.getElementById("totalOptions").value = "$" + totalOptions + ".00";
}
</script>
<form name="Options" >
<table width="765" border="0" cellspacing="0" cellpadding="0">
  <tr>
    <td colspan="8" align="center" bgcolor="#FFFFFF">Please select which model you would like to price and then add your optional equipment.</td>
    <td width="4" align="center" bgcolor="#FFFFFF">&nbsp;</td>
    <td width="4" align="center" bgcolor="#FFFFFF">&nbsp;</td>
    <td width="4" align="center" bgcolor="#FFFFFF">&nbsp;</td>
  </tr>
  <tr>
    <td colspan="3" align="center" bgcolor="#FFFFFF"><strong>Available on these models</strong></td>
    <td width="85" align="center" bgcolor="#FFFFFF">Most Popular Options</td>
    <td width="97" align="center" bgcolor="#FFFFFF">Option Code</td>
    <td width="192" align="center" bgcolor="#FFFFFF"><strong>Optional Equipment</strong></td>
    <td width="61" align="center" bgcolor="#FFFFFF"><strong>Price</strong></td>
    <td width="149" align="center" bgcolor="#FFFFFF"><strong>Add Option</strong></td>
  </tr>
  <tr>
    <td width="58" align="center"><p><strong>SR 125<br />
    </strong></p></td>
    <td width="58" align="center"><p><strong>SR 225<br />
    </strong></p></td>
    <td width="58" align="center"><p><strong>SR 325<br />
    </strong></p></td>
    <td colspan="5" align="right"><strong>Select Base Model: 
      </strong>      <select name="model" id="model">
        <option value="0.00" selected onclick="calculateTotalOptions(this);">--------</option>
        <option value="-6995.00" onclick="calculateTotalOptions(this);">SR 125 Standard</option>
        <option value="-7495.00" onclick="calculateTotalOptions(this);">SR 125 H.D.</option>
        <option value="7995.00" onclick="calculateTotalOptions(this);">SR 125 S.D.</option>
        <option value="8495.00" onclick="calculateTotalOptions(this);">SR 225 Standard</option>
        <option value="8995.00" onclick="calculateTotalOptions(this);">SR 225 H.D.</option>
        <option value="9595.00" onclick="calculateTotalOptions(this);">SR 225 S.D.</option>
        <option value="9995.00" onclick="calculateTotalOptions(this);">SR 325 Standard</option>
        <option value="10495.00" onclick="calculateTotalOptions(this);">SR 325 H.D.</option>
        <option value="10995.00" onclick="calculateTotalOptions(this);">SR 325 S.D.</option>
      </select></td>
    </tr>
  <tr>
    <td align="center" bgcolor="#FFFFFF"><img src="dot.png" width="11" height="11" /></td>
    <td align="center" bgcolor="#FFFFFF"><img src="dot.png" alt="" width="11" height="11" /></td>
    <td align="center" bgcolor="#FFFFFF">&nbsp;</td>
    <td bgcolor="#FFFFFF">&nbsp;</td>
    <td bgcolor="#FFFFFF">SR-ES</td>
    <td bgcolor="#FFFFFF">•Electric start </td>
    <td bgcolor="#FFFFFF">$345.00</td>
    <td align="center" bgcolor="#FFFFFF"><input type="checkbox" name="t1" id="t1" value="345.00" onclick="calculateTotalOptions(this);"> </td>
  </tr>
  <tr>
    <td align="center"><img src="dot.png" alt="" width="11" height="11" /></td>
    <td align="center"><img src="dot.png" alt="" width="11" height="11" /></td>
    <td align="center">&nbsp;</td>
    <td align="center"><img src="dot.png" alt="" width="11" height="11" /></td>
    <td>SR-OCP</td>
    <td>•Operator convience package; includes tach, hour, lube meter, hydraulic pressure gauge and bottle holder</td>
    <td>$125.00</td>
    <td align="center"><input type="checkbox" name="t1" id="t1" value="125.00" onclick="calculateTotalOptions(this);"></td>
  </tr>
  <tr>
    <td align="center" bgcolor="#FFFFFF">&nbsp;</td>
    <td align="center" bgcolor="#FFFFFF">&nbsp;</td>
    <td align="center" bgcolor="#FFFFFF"><img src="dot.png" alt="" width="11" height="11" /></td>
    <td align="center" bgcolor="#FFFFFF">&nbsp;</td>
    <td bgcolor="#FFFFFF"><table cellspacing="0" cellpadding="0">
  <td width="127">SR-EZM</td>
    </table></td>
    <td bgcolor="#FFFFFF">•EZ maintance hydraulic package; includes temperature and fill sight guage and quickdrain ball valve</td>
    <td bgcolor="#FFFFFF">$100.00</td>
    <td align="center" bgcolor="#FFFFFF"><input type="checkbox" name="t1" id="t1" value="100.00" onclick="calculateTotalOptions(this);"></td>
  </tr>
  <tr>
    <td align="center">&nbsp;</td>
    <td align="center">&nbsp;</td>
    <td align="center"><img src="dot.png" alt="" width="11" height="11" /></td>
    <td align="center">&nbsp;</td>
    <td><table cellspacing="0" cellpadding="0">
  <td width="127">SR-6W</td>
    </table></td>
    <td>•Six way wedge with on board storage</td>
    <td>$495.00</td>
    <td align="center"><input type="checkbox" name="t1" id="t1" value="495.00" onclick="calculateTotalOptions(this);"></td>
  </tr>
  <tr>
    <td align="center" bgcolor="#FFFFFF"><img src="dot.png" alt="" width="11" height="11" /></td>
    <td align="center" bgcolor="#FFFFFF"><img src="dot.png" alt="" width="11" height="11" /></td>
    <td align="center" bgcolor="#FFFFFF">&nbsp;</td>
    <td align="center" bgcolor="#FFFFFF">&nbsp;</td>
    <td bgcolor="#FFFFFF"><table cellspacing="0" cellpadding="0">
  <td width="127">SR-JLL</td>
    </table></td>
    <td bgcolor="#FFFFFF">•Jointed log lift</td>
    <td bgcolor="#FFFFFF">$495.00</td>
    <td align="center" bgcolor="#FFFFFF"><input type="checkbox" name="t1" id="t1" value="495.00" onclick="calculateTotalOptions(this);"></td>
  </tr>
  <tr>
    <td align="center"><img src="dot.png" alt="" width="11" height="11" /></td>
    <td align="center">&nbsp;</td>
    <td align="center">&nbsp;</td>
    <td align="center"><img src="dot.png" alt="" width="11" height="11" /></td>
    <td><table cellspacing="0" cellpadding="0">
  <td width="127">SR-SEGTR</td>
    </table></td>
    <td>•Segmented tire for spotting includes spotting hitch</td>
    <td>$350.00</td>
    <td align="center"><input type="checkbox" name="t1" id="t1" value="350.00" onclick="calculateTotalOptions(this);"></td>
  </tr>
  <tr>
    <td align="center" bgcolor="#FFFFFF">&nbsp;</td>
    <td align="center" bgcolor="#FFFFFF"><img src="dot.png" alt="" width="11" height="11" /></td>
    <td align="center" bgcolor="#FFFFFF"><img src="dot.png" alt="" width="11" height="11" /></td>
    <td align="center" bgcolor="#FFFFFF"><img src="dot.png" alt="" width="11" height="11" /></td>
    <td bgcolor="#FFFFFF"><table cellspacing="0" cellpadding="0">
  <td width="127">SR-MGST</td>
    </table></td>
    <td bgcolor="#FFFFFF">•Motor guard with saddle for segmented tire</td>
    <td bgcolor="#FFFFFF">$95.00</td>
    <td align="center" bgcolor="#FFFFFF"><input type="checkbox" name="t1" id="t1" value="95.00" onclick="calculateTotalOptions(this);"></td>
  </tr>
  <tr>
    <td align="center"><p><img src="dot.png" alt="" width="11" height="11" /></p></td>
    <td align="center"><img src="dot.png" alt="" width="11" height="11" /></td>
    <td align="center"><img src="dot.png" alt="" width="11" height="11" /></td>
    <td align="center">&nbsp;</td>
    <td><table cellspacing="0" cellpadding="0">
  <td width="127">SR-MG</td>
    </table></td>
    <td>•Motor guard w/o saddle</td>
    <td>$75.00</td>
    <td align="center"><input type="checkbox" name="t1" id="t1" value="75.00" onclick="calculateTotalOptions(this);"></td>
  </tr>
  <tr>
    <td align="center" bgcolor="#FFFFFF"><img src="dot.png" alt="" width="11" height="11" /></td>
    <td align="center" bgcolor="#FFFFFF"><img src="dot.png" alt="" width="11" height="11" /></td>
    <td align="center" bgcolor="#FFFFFF"><img src="dot.png" alt="" width="11" height="11" /></td>
    <td align="center" bgcolor="#FFFFFF">&nbsp;</td>
    <td bgcolor="#FFFFFF"><table cellspacing="0" cellpadding="0">
  <td width="127">SR-SPRTR</td>
    </table></td>
    <td bgcolor="#FFFFFF">•Spare tire and holder</td>
    <td bgcolor="#FFFFFF">$250.00</td>
    <td align="center" bgcolor="#FFFFFF"><input type="checkbox" name="t1" id="t1" value="250.00" onclick="calculateTotalOptions(this);"></td>
  </tr>
  <tr>
    <td align="center"><img src="dot.png" alt="" width="11" height="11" /></td>
    <td align="center"><img src="dot.png" alt="" width="11" height="11" /></td>
    <td align="center"><img src="dot.png" alt="" width="11" height="11" /></td>
    <td>&nbsp;</td>
    <td><table cellspacing="0" cellpadding="0">
  <td width="127">SR-HOC</td>
    </table></td>
    <td>•Hydraulic oil cooler</td>
    <td>$795.00</td>
    <td align="center"><input type="checkbox" name="t1" id="t1" value="795.00" onclick="calculateTotalOptions(this);">
    </td>
  </tr>
  <tr>
    <td align="center" bgcolor="#FFFFFF"><img src="dot.png" alt="" width="11" height="11" /></td>
    <td align="center" bgcolor="#FFFFFF"><img src="dot.png" alt="" width="11" height="11" /></td>
    <td align="center" bgcolor="#FFFFFF"><img src="dot.png" alt="" width="11" height="11" /></td>
    <td bgcolor="#FFFFFF">&nbsp;</td>
    <td bgcolor="#FFFFFF"><table cellspacing="0" cellpadding="0">
  <td width="127">SR-GRLP</td>
    </table></td>
    <td bgcolor="#FFFFFF">•Grip Rightâ„¢ log points (each additional point)</td>
    <td bgcolor="#FFFFFF">$20.00</td>
    <td align="center" bgcolor="#FFFFFF"><input type="checkbox" name="t1" id="t1" value="20.00" onclick="calculateTotalOptions(this);">
    </td>
  </tr>
  <tr>
    <td align="center"><img src="dot.png" alt="" width="11" height="11" /></td>
    <td align="center"><img src="dot.png" alt="" width="11" height="11" /></td>
    <td align="center"><img src="dot.png" alt="" width="11" height="11" /></td>
    <td>&nbsp;</td>
    <td><table cellspacing="0" cellpadding="0">
  <td width="127">SR-HDF</td>
    </table></td>
    <td>•Heavy duty fenders</td>
    <td>$145.00</td>
    <td align="center"><input type="checkbox" name="t1" id="t1" value="145.00" onclick="calculateTotalOptions(this);"></td>
  </tr>
  <tr>
    <td align="center" bgcolor="#FFFFFF"><img src="dot.png" alt="" width="11" height="11" /></td>
    <td align="center" bgcolor="#FFFFFF"><p><img src="dot.png" alt="" width="11" height="11" /></p></td>
    <td align="center" bgcolor="#FFFFFF"><img src="dot.png" alt="" width="11" height="11" /></td>
    <td bgcolor="#FFFFFF">&nbsp;</td>
    <td bgcolor="#FFFFFF"><table cellspacing="0" cellpadding="0">
  <td width="127">SR-LP</td>
    </table></td>
    <td bgcolor="#FFFFFF">•Light package</td>
    <td bgcolor="#FFFFFF">$195.00</td>
    <td align="center" bgcolor="#FFFFFF"><input type="checkbox" name="t1" id="t1" value="195.00" onclick="calculateTotalOptions(this);"></td>
  </tr>
  <tr>
    <td align="center"><img src="dot.png" alt="" width="11" height="11" /></td>
    <td align="center"><p><img src="dot.png" alt="" width="11" height="11" /></p></td>
    <td align="center"><img src="dot.png" alt="" width="11" height="11" /></td>
    <td>&nbsp;</td>
    <td><table cellspacing="0" cellpadding="0">
  <td width="127">SR-38LO</td>
    </table></td>
    <td>•38&quot; log opening *includes 2 1/2&quot; cylinder rod </td>
    <td>$995.00</td>
    <td align="center"><input type="checkbox" name="t1" id="t1" value="995.00" onclick="calculateTotalOptions(this);"></td>
  </tr>
  <tr>
    <td colspan="8" align="center" bgcolor="#FFFFFF">&nbsp;</td>
  </tr>
  <tr>
    <td align="center">&nbsp;</td>
    <td align="center">&nbsp;</td>
    <td align="center">&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td><strong>TOTAL:</strong></td>
    <td><input type="text" id="totalOptions" readonly>
      
  </td>
  </tr>
</table>
</form>