JavaScript Forum

**Frodocyber** · 06-27-2006, 10:11 AM

I am trying to improve one of my current HTML/php scripts. It currently extracts values from a mysql database and displays them in text boxes. The user is then allowed to change the text box content from a list of 30+ items and click submit to update the database.

The improvement idea is to make the text box a drop down list box the user can use to select a different text rather than "remembering" the options. The text box would continue to first display the current database content.

All the examples I have found do more complex functions like jumping to remote URLs or different pages on the same site. I only want to change the content of a text box on the same page before clicking the submit button. Any ideas on how to do this??

Frodocyber

**funkdaddu** · 03:21 PM

You mean like this:

HTML Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>

	<head>
		<meta http-equiv="content-type" content="text/html;charset=iso-8859-1">
		<title>Untitled Page</title>
		<script type="text/javascript"><!--
function changeText(obj) {
	document.FormName.yourText.value = obj.value;
}
//-->
</script>
	</head>

	<body bgcolor="#ffffff">
		<form id="FormName" method="get" name="FormName">
			<input type="text" name="yourText" size="24"><select name="selectName" size="1" onchange="changeText(this);">
				<option>Choose one..</option>
				<option value="one">first</option>
				<option value="two">second</option>
				<option value="three">third</option>
			</select>
		</form>
		<p></p>
	</body>

</html>

?

**Frodocyber** · 06-27-2006, 09:13 PM

Thanks! That worked super. However, now I want to get really cute and make this routine do some more work.

My members need to be able to change some skill information (text) and include associated search codes (numeric) which are directly related....but, the members only know the skills text and not the associate search code. The Administrator (me) has had to make those associations manually after the fact. Getting tired of that too!

I have modified the script to look more like I need the end result to be. A bit "hackky" but it almost works as needed.

Code follows:

Code:

<?
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
 <head>
  <meta http-equiv="content-type" content="text/html;charset=iso-8859-1">
  <title>Dropdown text box test Page</title>
  <script type="text/javascript"><!--
function changeText1(obj) {
 document.FormName1.skill1_code.value = obj.value;
}
//-->
</script>
  <script type="text/javascript"><!--
function changeText2(obj) {
 document.FormName2.skill2_code.value = obj.value;
}
//-->
</script>
</head>
 <body bgcolor="#ffffff">
<?
$Askill1_text="database source text-1";
$Askill1_code="database source code-1";
$Askill2_text="database source text-2";
$Askill2_code="database source code-2";
?>
 <form id="FormName1" method="get" name="FormName1">
Skill 1 Code:<input type="text" maxlength="35" size="35" name="skill1_code" value="<? echo 
"$Askill1_code"?>"><select name="selectName" size="1" onchange="changeText1(this);">
    <option>Choose one Skill..</option>
    <option value="1">Accounting</option>
    <option value="2">Sales Management</option>
    <option value="3">Human Resources</option>
   </select></br>
Skill 1 Text : <input type="text" maxlength="2" size="25" name="skill1_text" value="<? echo 
"$Askill1_text"?>"></br>
  </form>
 <form id="FormName2" method="get" name="FormName2">
Skill 2 Code:<input type="text" maxlength="35" size="35"  name="skill2_code" value="<? echo 
"$Askill2_code"?>"><select name="selectName" size="1" onchange="changeText2(this);">
    <option>Choose one Skill..</option>
    <option value="1">Accounting</option>
    <option value="2">Sales Management</option>
    <option value="3">Human Resources</option>
   </select></br>
Skill 2 Text : <input type="text" maxlength="2" size="25" name="skill2_text" value="<? echo 
"$Askill2_text"?>"></br>
  </form>
  <p></p>   
 </body>
</html>
<?

The php tags are just to make sure it works when I include it in my current php script.

This results in a numeric code where I want it but I also need the associated text to be in the "correct" text box. Can I create a "two" value drop down list...one value for the code and another for the associated text? Or, is there a way to get the dropdown text, as shown, into the associated text box?

It would really make my job easier if there is a way to acomplish this task.

Frodocyber

**funkdaddu** · 06-27-2006, 10:56 PM

Hmm if you have a database, this should be defined behind the scenes, you don't want it done in JS. Create a database table that relates the skill ID and the skill name (or just define it in the PHP script with an array) and just read the code from the form, and insert it with the PHP. If someone doesn't have JS it won't work right, or someone can alter the textfield after choosing a box and you'd have to check them manually anyway.

**Frodocyber** · 06-30-2006, 09:14 PM

Used your database idea by adding a new table for skills/codes. That cleared up several chicken/egg issues. Now the check box page of skills/codes is generated dynamically from the database....and a modified version of the check box script is used by members to update their profiles. Great ideas come from this forum!!

Frodocyber

**funkdaddu** · 06-30-2006, 10:12 PM

Awww yeah. Glad it worked out.