Still celebrating National IT Professionals Day with 3 months of free Premium Membership. Use Code ITDAY17

x
?
Solved

How do I populate a text field with data associated in a drop down box

Posted on 2012-03-14
3
Medium Priority
?
390 Views
Last Modified: 2012-03-15
I have a MySQL table where I read some rows that match my sale type.
I place the index and description into an HTML drop down box for my sales agent
(in-house) to select from.

When they make a selection, I would like to populate some text boxes with the
associated data like price  and weight, etc.

So far, I have the data in a php array, one per record that matches the possibilities.
 
for ($i = 0; $i < $SCRows; ++$i)
{
    $row = mysql_fetch_array($SCResult);
    if ($row['Category'] = 'S')
      {
    $SCCodes[$i] = "   <option Value=".$row['SCRecNo'].'>'.$row['CallResultDescription'].'</option>\n\r';
    $SCJSON[$i]  = "   <option Value = ".$row['SCRecNo'].'>'.json_encode($row)."></option>\n\r";
      }
}

 

Open in new window


I have the data in memory, I am trying to not call the server again (I don't know how to, I presume AJAX but I don't know AJAX, yet...

I was going to put a json_encode string as the text in a hidden drop down and traverse that
by javascript each time the agent makes a selection.  Then parse that string and display the
associated values in a text box for the agent to see the values that go with their selection.

Am I clear?
Thanks in advance!
0
Comment
Question by:pootwaddle
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 2
3 Comments
 
LVL 13

Accepted Solution

by:
dsmile earned 2000 total points
ID: 37723239
This is a simple approach using jquery.
In your case, recordInfo should get your json encoded string that could be easily get by call

var recordInfo = $('#YOUR_HIDDEN__FIELD_ID').val();

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
 <head>
  <title> New Document </title>
  <meta name="Generator" content="EditPlus">
  <meta name="Author" content="">
  <meta name="Keywords" content="">
  <meta name="Description" content="">
  <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6/jquery.min.js" type="text/javascript"></script>
 </head>

 <body>
  <form method="post" action="#" id="frm_test">
	Select me to change text values<select name="cmb" id="cmb">
		<option value="">-----</option>
		<option value="0">Item 1</option>
		<option value="1">Item 2</option>
		<option value="2">Item 3</option>
	</select><br />
	Price:  <input type="text" name="txtPrice" id="txtPrice"><br />
	Weight: <input type="text" name="txtWeight" id="txtWeight">
  </form>
  
  <script language="JavaScript">
  <!--
	var recordInfo = {0:{'price':'1000', 'weight':'100'}, 1:{'price':'1001', 'weight':'101'}, 2:{'price':'1002', 'weight':'102'}};

	$('#cmb').change(function() {
	  var selected = $("#cmb option:selected").val();
	  $('#txtPrice').val(recordInfo[selected].price);
	  $('#txtWeight').val(recordInfo[selected].weight);
	});

  //-->
  </script>
 </body>
</html>

Open in new window

0
 

Author Comment

by:pootwaddle
ID: 37723344
Thank you, dsmile -
Your code does exactly what I need.

Working backwards, I need to figure out how to get my
PHP associative array into the Javascript array.

So far I have.

1. Lookup records from MySQL, each of them containing ~ 25 fields.
2. find number of rows using mysql_num_rows...
3. iterate through the rows using mysql_fetch_array (gives me my PHP
associative array in $SCCodes[])

4. Put the Record ids and descriptions into a dropdown box.

and here is where I need more help -
when the user selects an item from the dropdown box I
need to search through a javascript array to find the corresponding
record where RecordID matches the selected one in the drop down box.

(It is in a PHP array, currently, although I contemplated storing it in a
hidden html dropdownbox)

And thanks to you I can pick up here...
Then, I use the .change function you gave me I can set my text boxes with
the data from the correct row.

Thanks again!! (oh, and I was going to use jquery for some stuff anyway!)
I'm doing well in PHP, but not so much in Javascript...
0
 

Author Closing Comment

by:pootwaddle
ID: 37725090
After letting this soak in overnite and reading the answer a couple more times it is clear that he answered the entire question, or enough to point me in the direction I need to go.

Thank you!!
0

Featured Post

Build and deliver software with DevOps

A digital transformation requires faster time to market, shorter software development lifecycles, and the ability to adapt rapidly to changing customer demands. DevOps provides the solution.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

When it comes to write a Context Sensitive Help (an online help that is obtained from a specific point in state of software to provide help with that state) ,  first we need to make the file that contains all topics, which are given exclusive IDs. …
This article discusses how to implement server side field validation and display customized error messages to the client.
The viewer will learn how to count occurrences of each item in an array.
Learn how to create flexible layouts using relative units in CSS.  New relative units added in CSS3 include vw(viewports width), vh(viewports height), vmin(minimum of viewports height and width), and vmax (maximum of viewports height and width).

715 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question