6 Replies - 8344 Views - Last Post: 13 April 2012 - 04:07 AM

#1 barbie_girl  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 4
  • Joined: 13-April 12

on selection of 2 dropdown list values show the values in textbox

Posted 13 April 2012 - 02:58 AM

hi,
i wanted to create a two drop down list , second drop down list will filter the data on the selection of first drop down list ,the data fetched is from database. when the two drop downlist values are selected the selected data should be shown in textbox. how this would be possible...help will be appreciated
thanx in advance
Is This A Good Question/Topic? 0
  • +

Replies To: on selection of 2 dropdown list values show the values in textbox

#2 Atli  Icon User is offline

  • D.I.C Lover
  • member icon

Reputation: 3730
  • View blog
  • Posts: 6,017
  • Joined: 08-June 10

Re: on selection of 2 dropdown list values show the values in textbox

Posted 13 April 2012 - 03:08 AM

Hey.

This is done using Javascript; by having Javascript monitor the "change" event of the select and update the second select either by refreshing the page and having PHP update it, or by updating it using data already provided in the script or from an AJAX request.

You may want to start by reading these tutorials:
- Dynamic Dropdown Menus
- Populating A Dropdown/Combo Box From MySQL.
Was This Post Helpful? 0
  • +
  • -

#3 barbie_girl  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 4
  • Joined: 13-April 12

Re: on selection of 2 dropdown list values show the values in textbox

Posted 13 April 2012 - 03:45 AM

View PostAtli, on 13 April 2012 - 03:08 AM, said:

Hey.

This is done using Javascript; by having Javascript monitor the "change" event of the select and update the second select either by refreshing the page and having PHP update it, or by updating it using data already provided in the script or from an AJAX request.

You may want to start by reading these tutorials:
- Dynamic Dropdown Menus
- Populating A Dropdown/Combo Box From MySQL.

hi,
thanks for reply.. i have got the answer my code run. i know using javascript or ajax it is possible..i have done using ajax,php and mysql. but the problem is that i dont know how to get the selected values of drop down list into the textbox. if possible any example.
Was This Post Helpful? 0
  • +
  • -

#4 RudiVisser  Icon User is offline

  • .. does not guess solutions
  • member icon

Reputation: 1004
  • View blog
  • Posts: 3,562
  • Joined: 05-June 09

Re: on selection of 2 dropdown list values show the values in textbox

Posted 13 April 2012 - 03:47 AM

View Postbarbie_girl, on 13 April 2012 - 10:45 AM, said:

hi,
thanks for reply.. i have got the answer my code run. i know using javascript or ajax it is possible..i have done using ajax,php and mysql. but the problem is that i dont know how to get the selected values of drop down list into the textbox. if possible any example.

Just to reiterate, this is not a PHP issue, it's a Javascript one.

You could simply do this:
var selBox = document.getElementById('selectbox');
var selValue = selBox.options[selBox.selectedIndex].value;
document.getElementById('thetextbox').value = selValue;


This could also work (not sure about IE support but it should be fine):
document.getElementById('thetextbox').value = document.getElementById('selectbox').value;


Just stick that in the change handler for your select box.

This post has been edited by RudiVisser: 13 April 2012 - 03:50 AM

Was This Post Helpful? 0
  • +
  • -

#5 Duckington  Icon User is offline

  • D.I.C Addict

Reputation: 170
  • View blog
  • Posts: 608
  • Joined: 12-October 09

Re: on selection of 2 dropdown list values show the values in textbox

Posted 13 April 2012 - 03:48 AM

If you were doing it dynamically with AJAX, you would so something like:

// Code here where you loaded up the select elements on change

document.getElementById('myTxt').innerHTML = someVariable; // Where someVariable is the values you want to put in the text box




<div id="myTxt"></div>



That will find the html element with the "id" of "myTxt" and put the contents of "someVariable" into it.
Was This Post Helpful? 0
  • +
  • -

#6 Atli  Icon User is offline

  • D.I.C Lover
  • member icon

Reputation: 3730
  • View blog
  • Posts: 6,017
  • Joined: 08-June 10

Re: on selection of 2 dropdown list values show the values in textbox

Posted 13 April 2012 - 03:53 AM

I'm moving this thread over to the Javascript forum. Like RudiVisser says, this is not a PHP issue.
Was This Post Helpful? 0
  • +
  • -

#7 barbie_girl  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 4
  • Joined: 13-April 12

Re: on selection of 2 dropdown list values show the values in textbox

Posted 13 April 2012 - 04:07 AM

hi, this is my ajax page where should i edit
function GetXmlHttpObject(handler) 
{ 
   var objXMLHttp=null 
   if (window.XMLHttpRequest) 
   { 
       objXMLHttp=new XMLHttpRequest() 
   } 
   else if (window.ActiveXObject) 
   { 
       objXMLHttp=new ActiveXObject("Microsoft.XMLHTTP") 
   } 
   return objXMLHttp 
} 

function stateChanged() 
{ 
   if (xmlHttp.readyState==4 || xmlHttp.readyState=="complete") 
   { 
           document.getElementById("txtResult").innerHTML= xmlHttp.responseText; 
   } 
   else { 
           //alert(xmlHttp.status); 
   } 
} 

// Will populate data based on input 
function htmlData(url, qStr,tag) 
{ 
     
    if (url.length==0){ 
      document.getElementById(tag).innerHTML="C:\wamp\www\office\LearningFusionCharts\MyFirstChart\dropdown\mine.php"; 
      return; 
    } 
    xmlHttp=GetXmlHttpObject() 
    if (xmlHttp==null){ 
       alert ("Browser does not support HTTP Request"); 
       return; 
    } 
     
    url=url+"?"+qStr; 
    url=url+"&sid="+Math.random(); 
    //xmlHttp.onreadystatechange=stateChanged; 
    xmlHttp.onreadystatechange=function(){ 
        if(xmlHttp.readyState==4 || xmlHttp.readyState=="complete"){ 
            document.getElementById(tag).innerHTML=xmlHttp.responseText; 
        } 
    } 
	//xmlhttp.open("GET","?qstr="+str2,true);
    xmlHttp.open("GET",url,true) ; 
    xmlHttp.send(); 
	
} 


and php page
<?php
  $con = mysql_connect("localhost","","");
if (!$con)
  {
  die('Could not connect: ' . mysql_error());
  }

mysql_select_db("info", $con);
  /***********************website****************************/
  $query = "SELECT DISTINCT website FROM urls1";
  $result = mysql_query($query);
  
  $str1 ="<select element=\"website\" onchange=\"htmlData('user.php', 'website='+this.value, 'elementresult')\">";
  		echo "<BR>";

  while($rs = mysql_fetch_assoc($result)){
    $str1 .= '<option value="'.$rs['website'].'">'.$rs['website'].'</option>';
  }
  $str1 .= '</select>';
  
  /***********************element****************************/
  $query = "SELECT element FROM urls1";
  $result = mysql_query($query);
  $str2 ="<select element=\"element\" onchange=\"htmlData('user.php', 'element='+this.value, 'websiteresult')\">";		echo "<BR>";
           
		   while($rs = mysql_fetch_assoc($result)){
    $str2 .= '<option value="'.$rs['element'].'"></option>';		

  }
  echo "<BR>";
?>

<html>

<head>
<title>websites</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
   <script src="ajax_req.js" type="text/javascript"></script>
</head>
<body>
<table>
<tr><td>
<form method="post" >
<div id="websiteresult"><?php echo $str1;?></div><br/><br/>
</td></tr>
<tr><td>
<div id="elementresult"><?php echo $str2;?></div><br/><br/>
 <br/>
</td></tr>
<tr><td>
<input type="submit" />
</td></tr>
</form>
</table>
</body>
</html>



Was This Post Helpful? 0
  • +
  • -

Page 1 of 1