Jump to content

updating textbox based off dynamic drop down list from DB


VFDinc

Recommended Posts

Hello,, I have looked for numerous examples, and have only got part of the answer.

I have successfully populated a drop down list by reading the database.

It populates with a list of quest titles. Once the user selects the quest.

I want a textbox to populate with the Quest Description.

 

I found an example that uses AJAX/PHP to do this, but it doesn't access a db to read/populate.

The main code is in index.html

The original example you select a country, and it populates a text field with the currency code.

It passes a variable called $country to another file called find_ccode.php.

I changed the first case in find_ccode.php to access my database, and populate the text box with quest description.

Ideally I will like to make this case dynamic based off QuestID, would populate textbox with corresponding Quest Description (QDescrip).

I then tried the other way in index.php

I dynamically populated the dropdown list, and gave the option values the QuestIDs to be passed to $country, but something isn't working.

I have a write files command to let me know what the $country variable is passing, and it never writes. It works in index.html though.

I apologize in advance for my amateurish coding. I still have a lot to learn. I have included the code below, but if you know a more elegant way of doing it. I am creating a role-playing game, as you probably have figured out by now. I hope to one day put it on the web, but right now using it as a way of learning html, and PHP.

 

I really want to know how to catch the value of the dropdown box. I would like to know what it is before sending over.

also what is this.value. I assume this is what the value of the dropdown box is when you have selected something.

 

I have been beating my head for days trying to figure this out. Any help is very much appreciated!

 

Index.html

<html>

<head>

<title>Changing textbox value based on dropdown list using Ajax and PHP</title>

<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">

<script>

//  Developed by Roshan Bhattarai

//  Visit http://roshanbh.com.np for this script and more.

//  This notice MUST stay intact for legal use

 

//fuction to return the xml http object

function getXMLHTTP() {

var xmlhttp=false;

try{

xmlhttp=new XMLHttpRequest();

}

catch(e) {

try{

xmlhttp= new ActiveXObject("Microsoft.XMLHTTP");

}

catch(e){

try{

xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");

}

catch(e1){

xmlhttp=false;

}

}

}

 

return xmlhttp;

}

 

 

 

function getCurrencyCode(strURL)

{

var req = getXMLHTTP();

if (req)

{

//function to be called when state is changed

req.onreadystatechange = function()

{

//when state is completed i.e 4

if (req.readyState == 4)

{

// only if http status is "OK"

if (req.status == 200)

{

document.getElementById('cur_code').value=req.responseText;

}

else

{

alert("There was a problem while using XMLHTTP:\n" + req.statusText);

}

}

}

req.open("GET", strURL, true);

req.send(null);

}

}

</script>

 

 

 

 

</head>

 

<body style="font: 12px Verdana, Arial, Helvetica, sans-serif;">

 

<form style="text-align:center" method="post" action="" name="form1">

<p style="color:#000099 ">When you change the dropdown list, the respective currency code of the country will be displayed in the textbox which is fetched from PHP using Ajax. </p>

<p>Country : <select name="country" onChange="getCurrencyCode('find_ccode.php?country='+this.value)"

 

<?php

 

mysql_connect('localhost', '$user', '$password');

 

mysql_select_db('sok');

 

$result = mysql_query('select QuestID,QTitle, QDescrip from QuestList');

 

$options="";

 

while ($row=mysql_fetch_array($result)) {

 

    $QuestID=$row["QuestID"];

    $QTitle=$row["QTitle"];

    $options.="<OPTION VALUE=\"$QuestID\">".$QTitle;

}

?>

<option value="">Select Country</option>

<option value="1">USA</option>

<option value="2">UK</option>

<option value="3">Nepal</option>

        </select><br/><br/>

Currency :  <input type="text" name="cur_code" id="cur_code" ></p>

</form>

</body>

</html>

 

Index.php

<html>

<head>

<title>Changing textbox value based on dropdown list using Ajax and PHP</title>

<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">

<script>

//  Developed by Roshan Bhattarai

//  Visit http://roshanbh.com.np for this script and more.

//  This notice MUST stay intact for legal use

 

//fuction to return the xml http object

function getXMLHTTP() {

var xmlhttp=false;

try{

xmlhttp=new XMLHttpRequest();

}

catch(e) {

try{

xmlhttp= new ActiveXObject("Microsoft.XMLHTTP");

}

catch(e){

try{

xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");

}

catch(e1){

xmlhttp=false;

}

}

}

 

return xmlhttp;

}

 

 

 

function getCurrencyCode(strURL)

{

var req = getXMLHTTP();

if (req)

{

//function to be called when state is changed

req.onreadystatechange = function()

{

//when state is completed i.e 4

if (req.readyState == 4)

{

// only if http status is "OK"

if (req.status == 200)

{

document.getElementById('cur_code').value=req.responseText;

}

else

{

alert("There was a problem while using XMLHTTP:\n" + req.statusText);

}

}

}

req.open("GET", strURL, true);

req.send(null);

}

}

</script>

 

</head>

 

<body style="font: 12px Verdana, Arial, Helvetica, sans-serif;">

 

<form style="text-align:center" method="post" action="" name="form1">

<p style="color:#000099 ">When you change the dropdown list, the respective currency code of the country will be displayed in the textbox which is fetched from PHP using Ajax. </p>

<p>Quest : <select name="country" getCurrencyCode('find_ccode.php?country='+this.value)">'

 

<?php

 

mysql_connect('localhost', '$user', '$password');

 

mysql_select_db('sok');

 

$result = mysql_query('select QuestID,QTitle, QDescrip from QuestList');

 

$options="";

 

while ($row=mysql_fetch_array($result)) {

 

    $QuestID=$row["QuestID"];

    $QTitle=$row["QTitle"];

    $options.="<OPTION VALUE=\"$QuestID\">".$QTitle;

 

}

 

$myFile = "test_catchoption.txt";

$fh = fopen($myFile, 'w') or die("can't open file");

fwrite($fh, $options);

fclose($fh);

?>

 

Choose your Quest

<?=$options?>

</SELECT>

<br/><br/>

Quest Description :  <input type="text" name="cur_code" id="cur_code" ></p>

</form>

</body>

</html>

 

 

find_ccode.php

<?php

// Developed by Roshan Bhattarai

// Visit http://roshanbh.com.np for this script and more.

// This notice MUST stay intact for legal use

$country=$_REQUEST['country'];

$myFile = "testFilefindcc.txt";

$fh = fopen($myFile, 'w') or die("can't open file");

fwrite($fh, $country);

fclose($fh);

switch($country)

{

case "1" :

mysql_connect('localhost', '$user', '$password');

    mysql_select_db('sok');

 

$result = mysql_query("select * from QuestList where QuestID = '1'");

$row = mysql_fetch_assoc($result);

        echo $row['QDescrip'];

break;

case "2" :

echo "GBP";

break;

case "3" :

echo "NPR";

break;

}

?>

 

 

 

to much reading to do  :o

will this help you? i use this to creat the dynamic dropdowns then the user selects what they want and populate the text box.. they can add from the list or type-- you can also tweak it to only add from the list

i use this code with the droplists--

http://code.google.com/p/dropdown-check-list/

 

and then here is an example without the code above:

//php
// here you dynamically create your droplist.
		$query = "SELECT example FROM #__exampletable WHERE xxx
		$examplelist=doSelectSql($query);
	    $somelist ="<select name="whatever" onchange=\"setexampleTextbox(this.options)\">";	
		foreach ($examplelist as $something)
			{
				output/echo somelist


//html
use this function at the top of your html page where you output/echo your droplist

function setexampleTextbox(o){
var t ='';
for(var i=0;i<o.length;i++)
t+=(o[i].selected==true)?' '+o[i].value:'';
document.yourFormname.example.value=t;
}

//this is an example of the select box where you impliment the droplist to populate the text box
			<input class="inputbox" type="text" size="20" name="example" value="xxx" /><br>{somelist}

 

past this i cant help im afraid :(

 

 

Thanks for the help. The Jquery example didn't quite fit my need.

Simple put I want a dropdown list populated by the database (I have this), based off the selection

I want it to read the database again, and populate it with the corresponding Quest description.

 

I tried your code, and forgive me if I over look something trivial, but its not working.

 

<!DOCTYPE HTML>

<html>

<head>

<meta charset="utf-8">

<title>Untitled Document</title>

</head>

<body>

 

<?php

// here you dynamically create your droplist.

 

mysql_connect('localhost', 'user', 'pass');

    mysql_select_db('sok');

$query = "SELECT * FROM #__QuestList;

 

$examplelist=doSelectSql($query)

 

    $somelist ="<select name="QList" onchange=\"setexampleTextbox(this.options)\">"; --Problem

foreach ($examplelist as $something)

 

{

?>

output/echo somelist  -- Problem (Probably trivial)

//html

use this function at the top of your html page where you output/echo your droplist

 

function setexampleTextbox(o){

var t ='';

</body>

</html>

bump...still not solved.

Simple put.

I know how to dynamically create a dropdown list from a database.

I need to also based off the selection of the dropdown list populate a textbox with another read of the database into the text box.

Archived

This topic is now archived and is closed to further replies.

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.