1,105,328 Community Members

populate form based on drop down selection

Member Avatar
jpknoob
Junior Poster in Training
71 posts since May 2007
Reputation Points: 0 [?]
Q&As Helped to Solve: 0 [?]
Skill Endorsements: 0 [?]
 
0
 

Hello all, I have a drop down that is populated using php and mysql. when the user makes a selection, I run the function showUser(), however, nothing happens when i make a selection, can anyone help with what I'm doing wrong?

The JS

<script type="text/javascript">
	function showUser(str)
	{
	if (str=="")
	  {
	  document.getElementById("txtHint").innerHTML="";
	  return;
	  }
	if (window.XMLHttpRequest)
	  {// code for IE7+, Firefox, Chrome, Opera, Safari
	  xmlhttp=new XMLHttpRequest();
	  }
	else
	  {// code for IE6, IE5
	  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
	  }
	xmlhttp.onreadystatechange=function()
	  {
	  if (xmlhttp.readyState==4 && xmlhttp.status==200)
		{
		document.getElementById("txtHint").innerHTML=xmlhttp.responseText;
		}
	  }
	xmlhttp.open("GET","getuser.php?q="+str,true);
	xmlhttp.send();
	}
</script>

The PHP script

<?php
//Include connection to database
require_once 'connect.php';

$q=$_GET["q"];

$sql="SELECT * FROM table WHERE id = '".$q."'";

$resultab = mysql_query($sql);

echo "<table border='1'>
<tr>
<th>id</th>
<th>Kinase</th>
<th>Kinase Sku</th>
<th>Antibody</th>
<th>Antibody2</th>
<th>Tracer</th>
<th>Tracer Conc</th>
</tr>";

while($row = mysql_fetch_array($resultab))
  {
  echo "<tr>";
  echo "<td>" . $row['id'] . "</td>";
  echo "<td>" . $row['kinase'] . "</td>";
  echo "<td>" . $row['kinase_sku'] . "</td>";
  echo "<td>" . $row['antibody'] . "</td>";
  echo "<td>" . $row['antibody2'] . "</td>";
  echo "<td>" . $row['tracer'] . "</td>";
  echo "<td>" . $row['tracer_conc'] . "</td>";
  echo "</tr>";
  }
echo "</table>";
?>

The HTML

<form action="" method="post">
	<fieldset>
	
		<!-- RUN QUERY TO POPULATE DROP DOWN -->
		<?php
		$query = "SELECT * FROM kbaCalc
					ORDER by kinase";
		
		$result = mysql_query($query) or die(mysql_error());
		$num = mysql_num_rows($result); //number of messages
		
		while($row = mysql_fetch_array($result))	{
		
			$kinase = $row['kinase'];
			$tracer_conc = $row['tracer_conc'];
			
			$options.= "<option value='$id'>".$kinase;
			
		}
		
		echo "</select>";
		
		?>
                
                <select name="users" onchange="showUser(this.value)">
	            <option value="">Select a Kinase:</option>
	            <?=$options?>
                </select>

                <div id="txtHint">Stuff here!</div>

         </fieldset>
</form>

If I make a normal html select dropdown, the script works, however, when I populate it using php, I get nothing.

Any help/advice would be awesome.

Member Avatar
pritaeas
mod_pritaeas
11,285 posts since Jul 2006
Reputation Points: 1,420 [?]
Q&As Helped to Solve: 1,830 [?]
Skill Endorsements: 154 [?]
Moderator
Featured
Sponsor
 
0
 

Your option tag is not closed, not sure if that will cause problems.

Your PHP script uses a table named 'table', while the other one uses 'kbaCalc'.

Member Avatar
jpknoob
Junior Poster in Training
71 posts since May 2007
Reputation Points: 0 [?]
Q&As Helped to Solve: 0 [?]
Skill Endorsements: 0 [?]
 
0
 

Hi, thanks for the response.

The table name in the php script was a typo.

I have update the $options to;

$options.= "<option value='$id'>$kinase</option>";

but still get nothing showing

Member Avatar
pritaeas
mod_pritaeas
11,285 posts since Jul 2006
Reputation Points: 1,420 [?]
Q&As Helped to Solve: 1,830 [?]
Skill Endorsements: 154 [?]
Moderator
Featured
Sponsor
 
0
 

If you get nothing your query fails, try:

$resultab = mysql_query($sql) or die(mysql_error());
Member Avatar
jpknoob
Junior Poster in Training
71 posts since May 2007
Reputation Points: 0 [?]
Q&As Helped to Solve: 0 [?]
Skill Endorsements: 0 [?]
 
0
 

i have error_reporting(E_ALL & ~E_NOTICE); at the start of my code, but don't get anything back

Member Avatar
pritaeas
mod_pritaeas
11,285 posts since Jul 2006
Reputation Points: 1,420 [?]
Q&As Helped to Solve: 1,830 [?]
Skill Endorsements: 154 [?]
Moderator
Featured
Sponsor
 
0
 

Run the php file by itself.

Member Avatar
jpknoob
Junior Poster in Training
71 posts since May 2007
Reputation Points: 0 [?]
Q&As Helped to Solve: 0 [?]
Skill Endorsements: 0 [?]
 
0
 

If I run the file by itself, the script runs and outputs the table with no content. When I add a value to $q, I get the results I expect.

Any other suggestions?

Member Avatar
pritaeas
mod_pritaeas
11,285 posts since Jul 2006
Reputation Points: 1,420 [?]
Q&As Helped to Solve: 1,830 [?]
Skill Endorsements: 154 [?]
Moderator
Featured
Sponsor
 
0
 

If the script is fine, then it must be the javascript. Debug that (compare similar thread).

Member Avatar
jpknoob
Junior Poster in Training
71 posts since May 2007
Reputation Points: 0 [?]
Q&As Helped to Solve: 0 [?]
Skill Endorsements: 0 [?]
 
0
 

The Javascript works fine if I take out the php that populates the drop down. If i use;

<select name="users" onchange="showUser(this.value)">
   <option value="">Select a Kinase:</option>
   <options value="1">1</option>
   <options value="2">2</option>
   <options value="3">3</option>
   <options value="4">4</option>
</select>

the whole thing works as it should, very frustrating!

Member Avatar
fobos
Posting Whiz
351 posts since Feb 2009
Reputation Points: 19 [?]
Q&As Helped to Solve: 68 [?]
Skill Endorsements: 3 [?]
 
-1
 

If your not getting anythinng in the drop down box, try this.

You: //Changes are in RED

while($row = mysql_fetch_array($result)) { 			
    $kinase = $row['kinase'];			
    $tracer_conc = $row['tracer_conc']; 			
    $options.= "<option value='$id'>".$kinase; 
    // You do not have ID defined in $row..		
} 		
echo "</select>"; <-- Why is this here? 		
?>                 
<select name="users" onchange="showUser(this.value)">	            
<option value="">Select a Kinase:</option>	            
<?=$options?> // Never write in shorthand. Confuses with XML
</select>

New:

$row = mysql_fetch_array($result);			
$kinase = $row['kinase'];			
$tracer_conc = $row['tracer_conc']; 			
$options = "<option value='".$row['id']."'>$kinase</option>"; 					
?>                 
<select name="users" onchange="showUser(this.value)">	            
<option value="">Select a Kinase:</option>	            
<?php echo $options ?>
</select>

I changed while($row = mysql_fetch_array($result)) { to $row = mysql_fetch_array($result); because when you had it your way, that only queries in the curly brackets. The other way, you can pass variables thru out the page. If im wrong, sorry. This is what i always do. I hope this helps

Member Avatar
pritaeas
mod_pritaeas
11,285 posts since Jul 2006
Reputation Points: 1,420 [?]
Q&As Helped to Solve: 1,830 [?]
Skill Endorsements: 154 [?]
Moderator
Featured
Sponsor
 
0
 

@fobos: If you remove the while loop, he'll get only one option. There are supposed to be more. The while loop should be left as-is.

Member Avatar
fobos
Posting Whiz
351 posts since Feb 2009
Reputation Points: 19 [?]
Q&As Helped to Solve: 68 [?]
Skill Endorsements: 3 [?]
 
0
 

lol thanks for catching that.. my mistake

<form action="" method="post">	
    <fieldset> 		
    <select name="users" onchange="showUser(this.value)">	            
        <option value="">Select a Kinase:</option>
        <!-- RUN QUERY TO POPULATE DROP DOWN -->		
        <?php		
        $query = "SELECT * FROM kbaCalc ORDER by kinase"; 		
        $result = mysql_query($query) or die(mysql_error());		
        /*$num = mysql_num_rows($result);*/ 		
        while($row = mysql_fetch_array($result))	{ 			
            echo "<option value='".$row['id']."'>".$row['kinase']."</option>"; 
        } 
        ?> 	                           
    </select>                 
    <div id="txtHint">Stuff here!</div>          
    </fieldset>
</form>

I knew something was up..lol. Now, this will populate the option.

Member Avatar
fobos
Posting Whiz
351 posts since Feb 2009
Reputation Points: 19 [?]
Q&As Helped to Solve: 68 [?]
Skill Endorsements: 3 [?]
 
0
 

Awwww no rep points

Member Avatar
jpknoob
Junior Poster in Training
71 posts since May 2007
Reputation Points: 0 [?]
Q&As Helped to Solve: 0 [?]
Skill Endorsements: 0 [?]
 
0
 

The drop down populates just fine, my problems are when I select from the drop down, the returned table from the php script only shows the headers and not the contents.

If I remove the php code that populates the drop down and replace it with html, the script runs fine and I get the populated table.

Member Avatar
fobos
Posting Whiz
351 posts since Feb 2009
Reputation Points: 19 [?]
Q&As Helped to Solve: 68 [?]
Skill Endorsements: 3 [?]
 
0
 

Ok, well 2 things that you need to try for me. We are going to do some error checking.
On your php page that gets called, instead of

$q  = $_GET['q'];

Try puutting a number in its place and run the page by its self.

$q = "1";

If that works, then we will move on to the javascript. If not, then redo your query statement and re run the statement with the same code from above.

/* Old */
$sql="SELECT * FROM table WHERE id = '".$q."'";
/* New */
$sql="SELECT * FROM table WHERE id = '$q'";

Now the javascript.

//try putting in an alert in the beginning.
<script type="text/javascript">
function showUser(str) {
    if (str=="") {
        document.getElementById("txtHint").innerHTML="";
        return;
    }
    // Alert
    alert(str);
    if (window.XMLHttpRequest) {
        // code for IE7+, Firefox, Chrome, Opera, Safari
        xmlhttp=new XMLHttpRequest();
    } else {
        // code for IE6, IE5
        xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
    }
    xmlhttp.onreadystatechange=function() {
        if (xmlhttp.readyState==4 && xmlhttp.status==200) (
            document.getElementById("txtHint").innerHTML=xmlhttp.responseText;
        }
    }
    xmlhttp.open("GET","getuser.php?q="+str,true);
    xmlhttp.send();
}
</script>

if the string doesnt get passed, try this.

//try putting in an alert in the beginning.
<script type="text/javascript">
function showUser() {
    var xmlhttp; // You forgot to add this.
    var1 = document.getElementById("users").value;
    alert(var1);
    if(var1==""){
        document.getElementById("txtHint").innerHTML = "";
        return false;
    }
    if (window.XMLHttpRequest) {
        // code for IE7+, Firefox, Chrome, Opera, Safari
        xmlhttp=new XMLHttpRequest();
    } else {
        // code for IE6, IE5
        xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
    }
    xmlhttp.onreadystatechange=function() {
        if (xmlhttp.readyState==4 && xmlhttp.status==200) (
            document.getElementById("txtHint").innerHTML=xmlhttp.responseText;
        }
    }
    xmlhttp.open("GET","getuser.php?q="+str,true);
    xmlhttp.send();
}
</script>

Make sure you add the id="users" to your select.

<select name="users" id="users" onchange="showUser()">

I know this is alot, but i want you to try this and let me know. Its just kinda funny that you dont get anything when you use php for your options, you get nothing, but html shows results.

Member Avatar
jpknoob
Junior Poster in Training
71 posts since May 2007
Reputation Points: 0 [?]
Q&As Helped to Solve: 0 [?]
Skill Endorsements: 0 [?]
 
0
 

Have ran your edits.

The php file runs no probs when I insert a value into $q.

Both alerts show a box with a single number in it.

Thank you for the asistance btw, it is greatly appreciated.

Member Avatar
fobos
Posting Whiz
351 posts since Feb 2009
Reputation Points: 19 [?]
Q&As Helped to Solve: 68 [?]
Skill Endorsements: 3 [?]
 
0
 

No problem man. there was an update on my thread with a couple of things. 1) you needed to add the var xmlttp, so i did that in the second to last code block. Also, added the select code block. So does it work now?

Member Avatar
jpknoob
Junior Poster in Training
71 posts since May 2007
Reputation Points: 0 [?]
Q&As Helped to Solve: 0 [?]
Skill Endorsements: 0 [?]
 
0
 

Unfortunately not. I am using this;

<script type="text/javascript">
function showUser(str)	{
var xmlhttp; // You forgot to add this.
var1 = document.getElementById("users").value;
alert(var1);
if (var1=="")	{
	document.getElementById("txtHint").innerHTML="";
	return;
}

// Alert
alert(str);

if (window.XMLHttpRequest)	{
// code for IE7+, Firefox, Chrome, Opera, Safari
	xmlhttp=new XMLHttpRequest();
}

else	{// code for IE6, IE5
	xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}

xmlhttp.onreadystatechange=function()	{
	if (xmlhttp.readyState==4 && xmlhttp.status==200)	{
		document.getElementById("txtHint").innerHTML=xmlhttp.responseText;
	}
}

xmlhttp.open("GET","getuser.php?q="+str,true);
xmlhttp.send();
}
</script>

When i select from the drop down, i get an error window with the number 1, then a second window with the same number and finally the table is returned without the contents.

Member Avatar
fobos
Posting Whiz
351 posts since Feb 2009
Reputation Points: 19 [?]
Q&As Helped to Solve: 68 [?]
Skill Endorsements: 3 [?]
 
0
 

lol thats because you have the 2 alerts in there.

function showUser(str) {
    var xmlhttp; // You forgot to add this.
    // Take out
    var1 = document.getElementById("users").value;
    alert(var1);  
    if (str=="")	{	
        document.getElementById("txtHint").innerHTML="";	
        return;
    } 
// Alert
alert(str);// Take this out also.

Now it should be fine.

Member Avatar
jpknoob
Junior Poster in Training
71 posts since May 2007
Reputation Points: 0 [?]
Q&As Helped to Solve: 0 [?]
Skill Endorsements: 0 [?]
 
0
 

lol, didn't even notice that!

Unfortunately, the end result is still the same, see attached image.

Attachments 4.png 13.43KB
You
This question has already been solved: Start a new discussion instead
Post:
Start New Discussion
View similar articles that have also been tagged: