How to retrieve dynamic drop down values in one table using Ajax and Php?

PHP
1

How to retrieve dynamic drop down values in one table using Ajax and Php?

2 
<?php
 // some PHP
?>
<html>
	<head>
		<script>
			function dropdownvalue(){
				index = document.getElementsByTagName('select')[0].selectedIndex;
				value = document.getElementsByTagName('select')[0].options[index].value;
				alert(value);
			}
		</script>
		<script>
			// some ajax
		</script>
	</head>
	<body>
		<select>
			<option>1</option>
			<option>2</option>
			<option>3</option>
		</select>
		<table>
			<tr>
				<td onclick="dropdownvalue();">dropdownvalue</td>
			</tr>
		</table>
	</body>
</html>
3

Thanks but i need ajax code

4

Can you show us what you have attempted so far, @selvameena62 ?

6

This is my ajax code

<script type="text/javascript">
$(document).ready(function()
{  
	$('#pro_type').on('change',function()
	{
var countryID =$(this).val();
if(countryID)

{
$.ajax
({
type:'POST',
url:'ajax.php',
data:'pro_type='+countryID,
success:function(html)
{

$('#location').html(html);
$('#sq_feet').html('<option value="">Select Location First</option>');
}
});
}else
{
$('#location').html('<option value="">Select Property Type First</option>');
$('#sq_feet').html('<option value="">Select Location First</option>');
}
})



$('#location').on('change',function()
	{
var stateID =$(this).val();
if(stateID)

{
$.ajax
({
type:'POST',
url:'ajax.php',
data:'location='+stateID,
success:function(html)
{
	
$('#price').html(html);
}


});
}else
{
$('#price').html('<option value="">Select Location First</option>');
}
})	

});
7

this is ajax.php page i am passing id in ajax,displaying total price query is not retrieving the any data please guide me

<?php 
include_once 'dbconfig.php'; 
$location = $_POST['location'];
$pro_type = $_POST['pro_type'];
//Ajax call for state where values are going to be fetch by country_id
if(isset($_POST['pro_type'])&&!empty($_POST['pro_type'])){
//echo $_POST['country_id'];exit;
 //$pro_type = $_POST['pro_type'];
$query = $conn->query("SELECT * FROM properties_details WHERE pro_type = '$pro_type' ");
$rowCount= $query->num_rows;

if($rowCount>0){
echo '<option value="">Select Location</option>';
while($row=$query->fetch_assoc()){

echo '<option value="'.$row['location'].'">'.$row['location'].'</option>';


}

}
else{

echo '<option value"">Location Not Available</option>';

}
}


//Ajax call for city where values are going to be fetch by state_id
if(isset($_POST['location'])&&!empty($_POST['location'])){

$query=$conn->query("SELECT * FROM properties_details WHERE location='$location' and pro_type='$pro_type' ");
$rowCount=$query->num_rows;

if($rowCount>0){
echo '<option value="">Select Price</option>';
while($row=$query->fetch_assoc()){

echo '<option value="'.$row['total_price'].'">'.$row['total_price'].'</option>';


}

}
else{

echo '<option value"">Price Not Available</option>';

}
}
?>
8

@selvameena62: when you post code on the forums, you need to format it so it will display correctly.

You can highlight your code, then use the </> button in the editor window, or you can place three backticks ``` (top left key on US/UK keyboards) on a line above your code, and three on a line below your code. I find this approach easier, but unfortunately some European and other keyboards don’t have that character.

1 Like
9

Can this work?

$query=$conn->query("SELECT * FROM properties_details WHERE location='$location' and pro_type='$pro_type' ");

When you pass in a value for location, you don’t pass in pro_type, so this query has a problem, surely?

10

Yes, i can’t pass the pro_type in this query

$query=$conn->query("SELECT * FROM properties_details WHERE location=‘$location’ and pro_type=‘$pro_type’ ");

11

If you’re not passing the data into the query, then you should alter the query to not require it. If the problem is that you want to know how to pass the data into the query:

  • add a line to retrieve the value in your second Ajax call, just after you retrieve the state ID.
  • add that variable to the ‘data’ specification in your Ajax call

then you should be able to run the query.

12

I did not try your code but, on the first glance, you need your data to be an object - jquery ajax doc
In your case data:{ location: stateID }

13

I don’t think that’s the case:

So as it’s already a string, there doesn’t seem any point changing it to an object just so it can be re-converted to a string.

ETA - I’m no expert in these things, but I’ve seen it done in several different ways, and have no idea whether any could be described as “better”.

14

It’s true that this is not the point of this topic.
It was just a recommendation that can cause issues.

  1. If you want to send raw string you will need to encode the value yourself. That’s why the default is to send an object, jQuery will encode the URL for you.
    In your case, if stateID="a&b=c"; you will send a request like location=a and also b=c.
  2. the query is more visible, you can see what’s missing
var data = { location: stateId, pro_type: countryID };

Looks way better.

15

Thank You So much.its working:slight_smile:

16

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.