I’m working on a hotel booking project (php) and I want to create a booking-form where I will have :
Checking Date(datepicker)
Checkout Date(datepicker)
Room type (Here I want to have a dropdown menu, <select><option>Single</option></select>
, and when a option is selected to show me the price of that room type, without pressing any button.)
Price (this is a text, not a textbox)(And here I want to show me the price of that room type.)
I have the query that gives me the price data from table, put I don’t know how to show me without pressing any button, just when I select the “Single Room” option, the price field should be $30 (this is data from table, for example).
Can you give me an idea ? Is a specific function for <select>
tag for this ?
<?php if(isset($_POST['submit'])){ $tip = isset($_POST['roomtype']) ? mysql_real_escape_string($_POST['roomtype']) : ''; echo $tip; } ?>
This is my php code, but its work only if I hit ‘submit’. I want to work when I select the option.
Advertisement
Answer
Use the following example
<select class="text_select" id="field_6" name="field_6"> <option value="- Select -">- Select -</option> <option value="Option One">Option One</option> <option value="Option Two">Option Two</option> <option value="Option Three">Option Three</option> </select> <label class="form_field">Your selected <span id="aggregator_name"></span>?</label>
and jquery
function notEmpty(){ var e = document.getElementById("field_6"); var strUser = e.options[e.selectedIndex].value; document.getElementById('aggregator_name').innerHTML = strUser; } notEmpty() document.getElementById("field_6").onchange = notEmpty;
jsfiddle link http://jsfiddle.net/Mj4Vj/