Page 1 of 1
select input to display its corresponding price in textfield
Posted: Mon Sep 15, 2008 11:29 am
by zplits
Hi everyone. Does anybody know how to do this?
Here is my problem:
1. I have a table in the database named tbl_menu. It has two fields namely description and price. There are two values in the table:
Description: Price:
Chicken Paa Meal 40
Chicken Petcho Meal 50
2. I want to load the price of the selected item from the drop down list box. Below is the screenshot of what i want to do.
Here is the code for displaying values in a select field.
Code: Select all
<?php
$queryMenu = "SELECT * FROM tbl_menu";
$resultMenu = mysql_query($queryMenu);
echo "<select name=\"d1\" size=\"1\" class=\"formFieldsDropDownCode\" id=\"dl\" tabindex=\"2\">";
while($row = mysql_fetch_assoc($resultMenu)){
$showName=$row['description'];
$price = $row['price'];
echo "<option value=".$showName.">".$showName."</option>";
}
echo "</select>";
?>
So if the user chooses Chicken Paa Meal, the value for the textfield price will be 40. Otherwise, if the user chooses Chicken Pecho Meal, the value for the textfield price will be 50.
Please help anyone. Thanks in advance.
Re: select input to display its corresponding price in textfield
Posted: Mon Sep 15, 2008 3:01 pm
by Ziq
Simple javascript code may do this. For example:
Code: Select all
<form name="form_name">
<select name="select_box" onchange="document.forms.form_name.text_box.value=document.forms.form_name.select_box.value">
<option value="">Please select item</option>
<option value="123">Value 1</option>
<option value="456">Value 2</option>
</select>
<input type="text" name="text_box">
</form>
Re: select input to display its corresponding price in textfield
Posted: Mon Sep 15, 2008 7:49 pm
by zplits
Thank you Ziq.... Is there any other way?, because i want to get the price of the selected item in the drop-down list from the database.
Re: select input to display its corresponding price in textfield
Posted: Mon Sep 15, 2008 8:27 pm
by califdon
Since you're already retrieving the data for the price, as well as the description, you could store the prices in an array. Then, in a Javascript function, you could populate the form field with the corresponding price, each time the user selected a different choice. So the JS function would be called on the "onselect" or "onchange" event of the select element. The JS function would detect which option has been selected and replace the Value property of the Input field.
Re: select input to display its corresponding price in textfield
Posted: Mon Sep 15, 2008 8:31 pm
by zplits
Thanks for the info Califdon, can you show me some sample code that will store the price in an array? and the javascript function sample? please. Thank you so much
Re: select input to display its corresponding price in textfield
Posted: Mon Sep 15, 2008 9:11 pm
by califdon
zplits wrote:Thanks for the info Califdon, can you show me some sample code that will store the price in an array? and the javascript function sample? please. Thank you so much
I can't show you some sample code, but there are plenty of good tutorials online. First, you need to understand how to create a Javascript array, so that you can create the code that will be sent to the browser, just like with HTML, using PHP. To help you understand this, check out:
http://www.tizag.com/javascriptT/javascriptarray.php. Then, in your
while($row = mysql_fetch_assoc($resultMenu)) loop, generate the necessary lines of Javascript, using PHP's
echo command, at the same time you're creating the
<option> tags for your drop-down box. Once you have an array with values in your Javascript
<script> block, you will be able to use the array values in the Javascript function that you will need to write, that executes whenever an item is selected in your drop-down box.
Re: select input to display its corresponding price in textfield
Posted: Mon Sep 15, 2008 9:28 pm
by zplits
Okay, thank you. So, i guess i have to predefine it then, and use it in a condition and put it inside a function, that:
Code: Select all
function checkMeal(){
if(document.form1.select_name.value =="Chicken Petcho Meal"){
document.form1.textfieldPrice.value = parseInt(40);
}
elseif(document.form1.select_name.value =="Chicken Paa Meal"){
document.form1.textfieldPrice.value = parseInt(45);
}
}
Thanks a lot.