Im trying to get houses to be filled on the second dropdown from their respective estates selected in the first drop down. Im getting no results in the second dropdown.
This is the HTML:
<div class="col-sm-4 col-xs-12">
<div class="form-group drop-custum">
<select id="estate" name="estate" data-live-search="true" class="form-control show-tick"
onchange="get_houses(this.value)">
<option value="">-- Estate --</option>
<?php
$sql = $this->db->query("select * from estates ORDER BY estate_name asc");
$result = $sql->result();
foreach ($result as $estates):
?>
<option class="text-uppercase"
value="<?= $estates->estate_name?>"> <?= $estates->estate_name?></option>
<?php endforeach; ?>
</select>
</div>
</div>
<div class="col-sm-4 col-xs-12">
<div class="form-group drop-custum">
<select name="house" data-live-search="true" id="house"
class="form-control show-tick">
<option value="">-- House --</option>
</select>
</div>
</div>
This is the AJAX:
function get_houses()
{
$.ajax({
url:"fill_houses/",
type:"POST",
data:'estate_name='+val,
success:function(data)
{
$("#house").html(data);
alert('success');
}
});
}
This is the PHP:
public function fill_houses()
{
$query = "select * from houses where estate_name='" . $_POST["estate_name"] . "' order by house_number asc ";
$result = $query->result();
foreach ($result as $estates):
'<option class="text-uppercase" value="'.$estates->house_id.'"> '.$estates->house_number.'</option>';
endforeach;
}
You must return the value back in php function fill_houses().
public function fill_houses()
{
$query = $this->db->query("select * from houses where estate_name='" . $_POST["estate_name"] . "' order by house_number asc ");
$result = $query->result();
foreach ($result as $estates):
return '<option class="text-uppercase" value="'.$estates->house_id.'"> '.$estates->house_number.'</option>';
endforeach;
}
also in javascript ajax function get_houses() you need to get the variable. and a couple of edit.
function get_houses(val)
{
$.ajax({
url:"fill_houses/",
type:"POST",
data: { 'estate_name': val} ,
success:function(data)
{
$("#house").html(data);
alert('success');
}
});
}
Related
I am having significant issues trying to get the AJAX to fire on this PHP code.
I can get the first field populated without issue, however the AJAX call does not seem to populate the first dependency (and therefore the second). I am an AJAX newbie (and have googled extensively) but cannot seem to crack this one.
Note that the ladb.php file runs fine.
<?php
// Include the database config file
include_once 'ladb.php';
?>
<!DOCTYPE html>
<html lang="en">
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js"></script>
</head>
<body style="background: #D5DDE0">
<div class="container">
<form action="" method="post">
<div class="form-group col-md-6">
<!-- Country dropdown -->
<label for="country">Country</label>
<select class="form-control" id="country">
<option value="">Select Country</option>
<?php
$query = "SELECT * FROM City_Index GROUP BY country ORDER BY country ASC";
$result = $ladb->query($query);
if ($result->num_rows > 0) {
while ($row = $result->fetch_assoc()) {
echo "<option value='{$row["countryid"]}'>{$row['country']}</option>";
}
}else{
echo "<option value=''>Country not available</option>";
}
?>
</select><br>
<!-- State dropdown -->
<label for="admin">Administrative Area</label>
<select class="form-control" id="admin">
<option value="">Select Administrative Area</option>
</select><br>
<!-- City dropdown -->
<label for="city">city_ascii</label>
<select class="form-control" id="city">
<option value="">Select City</option>
</select>
</div>
</form>
</div>
</body>
</html>
<script type="text/javascript">
$(document).ready(function(){
// Country dependent ajax
$("#country").on("change",function(){
var country = $(this).val();
if (countryid) {
$.ajax({
url :"action.php",
type:"POST",
cache:false,
data:{countryid:countryid},
success:function(data){
$("#admin").html(data);
$('#city').html('<option value="">Select Administrative Area</option>');
}
});
}else{
$('#admin').html('<option value="">Select Country</option>');
$('#city').html('<option value="">Select Administrative Area</option>');
}
});
// state dependent ajax
$("#admin").on("change", function(){
var admin = $(this).val();
if (admin) {
$.ajax({
url :"action.php",
type:"POST",
cache:false,
data:{admin:admin},
success:function(data){
$("#city").html(data);
}
});
}else{
$('#city').html('<option value="">Select Administrative Area</option>');
}
});
});
</script>
The action.php file below
<?php
// Include the database config file
include_once 'ladb.php';
// Get country id through state name
$country = $_POST['country'];
if (!empty($country)) {
// Fetch state name base on country id
$query = "SELECT * FROM CityList WHERE country = {$country} GROUP BY admin_name_ascii";
$result = $ladb->query($query);
if ($result->num_rows > 0) {
while ($row = $result->fetch_assoc()) {
echo '<option value="'.$row['admin_id'].'">'.$row['admin_name_ascii'].'</option>';
}
}else{
echo '<option value="">State not available</option>';
}
}elseif (!empty($_POST['admin'])) {
$admin = $_POST['admin'];
// Fetch city name base on state id
$query = "SELECT * FROM CityList WHERE admin_id = {$admin}";
$result = $ladb->query($query);
if ($result->num_rows > 0) {
while ($row = $result->fetch_assoc()) {
echo '<option value="'.$row['cityid'].'">'.$row['city_ascii'].'</option>';
}
}else{
echo '<option value="">City not available</option>';
}
}
?>
Any help greatly appreciated!
Thanks to #zergski I note that one of references were defined (countryid in Line 53). DevTools is my new best friend.
Can someone help me on how to link up 2 dropdown list which data came from the same table in the database, is it possible to do this way because I can only find a solution which there must be 2 table in the database to link up those two. this is how should it work, 1st, the user choose the department and the 2nd dropdown will show only the people that assigned from that particular department.
database table has id,name,department.
the department works already but the 2nd dropdown didnt work to filter from the department. Can someone help me to know what is wrong with this?
index.php
<?php
$query ="SELECT DISTINCT company from hrar";
$results = $db_handle->runQuery($query);
?>
<script>
function getName(val) {
$.ajax({
type: "POST",
url: "getName.php",
data:'department='+val,
success: function(data){
$("#nameList").html(data);
}
});
}
function selectDepartment(val) {
$("#search-box").val(val);
$("#suggesstion-box").hide();
}
</script>
<label>Department:</label><br/>
<select name="country" id="country-list" class="demoInputBox" onChange="getName(this.value);">
<option value="">Select Department</option>
<?php
foreach($results as $country) {
?>
<option value="<?php echo $country["id"]; ?>"><?php echo $country["company"]; ?></option>
<?php
}
?>
</select>
</div>
<div class="row">
<label>Name:</label><br/>
<select name="state" id="nameList" class="demoInputBox">
<option value="">Select Name</option>
</select>
//below is the getName.php
if(!empty($_POST["company"])) {
$query ="SELECT DISTINCT name from hrar = '" . $_POST["company"] . "'";
$results = $db_handle->runQuery($query);
?>
<option value="">Select Name</option>
<?php
foreach($results as $name) {
?>
<option value="<?php echo $name["id"]; ?>"><?php echo $name["name"]; ?></option>
<?php
}
}
?>
Try this.
<select name="filter" id="filter" onchange="this.form.submit();">
<option value="name">Select Name</option>
<?php
$sql = "SELECT DISTINCT name FROM hr";
$result = mysqli_query($conn,$sql);
while ($row = mysqli_fetch_array($result))
{
echo "<option value='". $row['name'] ."'>" .$row['name'] ."</option>";
}
?>
</select>
I want to taking id from index using ajax that supply to controller and controller will output category id using json and supply to index file.
Controller
public function index() {
$this->load->model('sales/Sales_model');
$this->load->model('product/Product_model');
$user_info['p_info'] = $this->Product_model->fetch_data();
$this->load->view('sales/index',$user_info);
}
function get_pcatagory(){
$this->load->model('sales/Sales_model');
$pid = $this->input->post('pro_id');
$cat_info = $this->Sales_model->fetch_data_pid($pid);
if(count($cat_info) > 0){
$select_box = '';
$select_box .= 'Select Catagory ID';
foreach ($cat_info as $value) {
// $value->id data will go to option of the select menu
}
echo json_encode($select_box);
}
}
Model
`function fetch_data_pid($pid){
$query = $this->db->get_where('product',array('id'=>$pid));
return $query->result();
}`
Ajax
`
$(document).ready(function(){
$('#pid').on('change',function(){
var pro_id_data = $('#pid').val();
alert(pro_id_data);
$.ajax({
url:'sales/get_pcatagory',
type:'POST',
data:{'pro_id' : pro_id_data},
dataType: 'json',
success:
function(result){
$('#cate').html(result);
},
error:
function(){
alert('error')
}
});
});
});
`
view
<div class="form-group">
<label>Product ID</label>
<select name="p_id" id="pid" class="form-control" placeholder="Enter Product" required>
<option value="0">Select Product ID</option>
<?php
foreach ($p_info as $value) {
?>
<option value="<?php echo $value->id ;?>"><?php echo $value->p_name ;?></option>
<?php }?>
</select>
</div>
<div id="" class="form-group">
<label>Category</label>
<select name="catagory" id="cate" class="form-control" placeholder="Enter Product" required >
</select>
</div>
But it alerts error . How can I solve it ?
I have created a dropdown that populates another dropdown.
I have created a modal for update in my application and I want the selected value of the dropdown to be the name taken from the database. It shows the name, but the problem is it doesnt show the other names which should be included.
(Note that the names show up depending on the first dropdown)
Here is my Model
function get_agents($campaign_id)
{
$campaign_id1 = mysqli_real_escape_string($this->db->conn_id,trim($campaign_id));
$query = $this->db->query("SELECT tbl_employee.emp_id, CONCAT(tbl_applicant.fname, ' ', tbl_applicant.lname) AS fullname FROM tbl_applicant INNER JOIN tbl_employee ON tbl_employee.apid=tbl_applicant.apid INNER JOIN tbl_account ON tbl_employee.acc_id=tbl_account.acc_id WHERE tbl_account.acc_id='".$campaign_id1."' ORDER BY tbl_applicant.fname ASC");
return $query->result();
}
Here is my Controller
public function getAgents()
{
$campaign_id = $this->input->post('campaign_id');
$data = $this->KudosModel->get_agents($campaign_id);
echo "<option value=''>-- Select Ambassador Name --</option>";
foreach($data as $a)
{
echo "<option value='".$a->emp_id."'>".$a->fullname."</option>";
}
}
Here is my View
<div class="form-group" style="height: auto; overflow: auto;">
<label class="col-sm-3 control-label float-left">Ambassador Name</label>
<div class="col-sm-9">
<select class="form-control" id="agentNames<?php echo $val->kudos_id; ?>" required="true" data-trigger="change" value="<?php echo $val->ambassador; ?>">
<option selected="" value="">-- Select Ambassador Name --</option>
<option selected="selected" value=""><?php echo $val->ambassador;?></option>
<?php
foreach($name2 as $row)
{
if($val->campaign==$row->acc_name)
echo '<'; if($val->ambassador==$row->fullname){
echo 'selected=selected';
}echo'option value="'.$row->emp_id.'">'.$row->fullname.'</option>';
}
?>
</select>
</div>
Here is my JQuery
$('#addCampaign<?php echo $val->kudos_id; ?>').on('change', function(){
$.ajax({
type : 'POST',
data : 'campaign_id='+ $('#addCampaign<?php echo $val->kudos_id; ?>').val(),
url : "<?php echo base_url(); ?>index.php/Kudos/getAgents/",
success : function(data){
//data returns your name, iterate through it and add the name to another select
$('#agentNames<?php echo $val->kudos_id; ?>').html(data);
}
});
});
Few days I try to solve problem but no luck.
Problem is next:
Web form with dependent dropdown select box where user can select his
city, zip and street and that work but.
When I submit form in my database no city_name (text) - only city_id (number/value).
So, question is - How to post city_name in database? User is from Rome and I Rome (text) is submited not city_id (number).
Select input:
<div class="form-group">
<label class="col-md-4 control-label" for="grad">City:*</label>
<div class="col-md-4">
<select type="text" name="city_name" id="city_name" class="form-control input-sm">
<option value=""></option>
<option value="999">---Enter city yourself---</option>
<?php $sql_query="SELECT * FROM city_table order by city_id asc";
$result=mysqli_query($dbconfig,$sql_query);
while($row=mysqli_fetch_array($result,MYSQLI_ASSOC)){
?>
<option value="<?php echo $row['city_id'].'_'.$row['city_name'];?>"><?php echo $row['city_name'];?></option>
<?php }?>
</select>
</div>
</div>
<!-- Select Basic -->
<div class="form-group">
<label class="col-md-4 control-label" for="post_no">ZIP code:*</label>
<div class="col-md-4">
<select name="zip_name" id="zip_name" class="form-control input-sm" onchange="recalculate_price();">
</select>
</div>
</div>
<!-- Select Basic -->
<div class="form-group">
<label class="col-md-4 control-label" for="address">Street:*</label>
<div class="col-md-4">
<select name="street_name" id="street_name" class="form-control input-sm" onchange="recalculate_price();">
</select>
</div>
</div>
get_zip_php
<?php
include('db_config.php');
if($_POST['id'])
{
$id=$_POST['id'];
$sql_query="SELECT * FROM zip_table where city_id='$id' order by zip_name asc";
$result=mysqli_query($dbconfig,$sql_query);
?>
<option selected="selected">Select ZIP code :</option><?php
while($row=mysqli_fetch_array($result,MYSQLI_ASSOC))
{
?>
<option value="<?php echo $row['zip_id']; ?>-<?php echo $row['limousine']; ?>-<?php echo $row['kombi']; ?>-<?php echo $row['mini_van']; ?>"><?php echo $row['zip_name']; ?></option>
<?php
}
}
?>
get_street_php
<?php
include('db_config.php');
if($_POST['id'])
{
$id=$_POST['id'];
$sql_query="SELECT * FROM street_table where zip_id='$id' order by street_name asc";
$result=mysqli_query($dbconfig,$sql_query);
?>
<option selected="selected">Select street please :</option><?php
while($row=mysqli_fetch_array($result,MYSQLI_ASSOC))
{
?>
<option value="<?php echo $row['street_id']; ?>"><?php echo $row['street_name']; ?></option>
<?php
}
}
?>
Ajax:
<script>
$(document).ready(function()
{
$("#city_name").change(function()
{
var id=$(this).val();
var data = 'id='+ id;
$.ajax
({
type: "POST",
url: "get_zip.php",
data: data,
cache: false,
success: function(html)
{
$("#zip_name").html(html);
recalculate_price();
}
});
});
$("#zip_name").change(function()
{
var id=$(this).val();
var data = 'id='+ id;
$.ajax
({
type: "POST",
url: "get_street.php",
data: data,
cache: false,
success: function(html)
{
$("#street_name").html(html);
recalculate_price();
}
});
});
});
</script>
If I make some changes on "select city part" (Im beginner and really Im lost in all this) I can`t pass zip.
So, please tell me where to make all changes to pass all that things and post city_name, zip (name...I make it as "xxxx - city") and street name. Please help me, I googled and read here about problems few days and can`t continue work on my project until I fix this. Thanks in advance.
Use bellow select tag. It may useful for you
<select type="text" name="city_name" id="city_name" class="form-control input-sm">
<option value=""></option>
<option value="999">---Enter city yourself---</option>
<?php
$sql_query="SELECT * FROM city_table order by city_id asc";
$result=mysqli_query($dbconfig,$sql_query);
while($row=mysqli_fetch_array($result,MYSQLI_ASSOC)){
echo "<option value='".$row['city_id']."'>".$row['city_name']."</option>";
}
?>
</select>
Concatenate the id with value like this using delimiter like this
<option value="<?php echo $row['city_id'].'_'.$row['city_name'];?>"><?php echo $row['city_name'];?></option>
In php use explode()
The explode() function breaks a string into an array.
$ss = explode('_','6_Rome');
print_r($ss);
echo $ss[0]; //6 pass the value into query
In jquery use split()
Split a string into an array of substrings:
use split()
$vv = variable_name.split("_");
fetch city name from database on the basis of city id in your POST array before INSERT Query.
SELECT `city_name` FROM `city_table` WHERE `city_id`='".$_POST['city_name']."'
then use that city name in your insert query.