Updating Cost Automatically

Hi guys,

I’m trying to create a simple quote calculator to show the user how much tickets will cost if they choose X quantity of tickets. I’d like the quote to update in the #total_figure div each time they change the quantity from the option selections.

For example, if they choose 2 tickets at $50 and 1 ticket @ $20, the #total_figure should be $120

Many thanks for any help!!

[code=html]

<form id=”book” method=”post”>

<label>

<span class=”bold_yellow”>Ticket 1 @ $20</span>

<select id=”adults”>

<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>

</select>

</label>

<label>

<span class=”bold_yellow”>Ticket 2 @ $50</span>

<select id=”children”>

<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>

</select>

</label>

<label>

<span class=”bold_yellow”>Ticket 3 @ $100</span>

<select id=”family”>

<option value=”0″>0</option>
<option value=”1″>1</option>

</select>

</label>

<div class=”total”>

<div class=”total_title”>

<p class=”bold_yellow”>TOTAL:</p>

</div>

<div class=”total_figure”>

<p id=”total_figure” class=”bold_yellow”>$0.00</p>

</div>

</div>

<input type=”submit” value=”submit”/>

</form>

[/code]

Also in #JavaScript _↴