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;

}

?>

 

 

 

Link to comment
Share on other sites

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 :(

 

 

Link to comment
Share on other sites

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>

Link to comment
Share on other sites

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.

Link to comment
Share on other sites

This thread is more than a year old. Please don't revive it unless you have something important to add.

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
×
  • 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.