Php Ajax Update MySQL Query Onchange from Dropdown (Filtering)

PHP AJAX update MySql query onChange from dropdown (filtering)

I think you are going wrong here.

A small mistake of '' in GenderID. And you are not passing url though.

$(document).ready(function(){
    $("#Gender").change(function () {
        var gender = $("#Gender").val();
        jQuery.ajax({
            url: "www.some_url.com"    // Send the data with your url.
            type: "POST",
            data:  {'GenderID': gender},     // Here you have written as {GenderID: gender} , not {'GenderID': gender}
            success: function(data){ 
                if(data.success == true){ 
                   alert('success'); 
                }
            }               
        });
    });
});

Also you have change in for . not as , as below.

echo' <div class="col-lg-4">
          <div class="card">
                 <div class="view overlay">
                    <a href="#">
                      <img src="products/'.$row["pimg"].'" class="img-fluid">
                    </a>
                 </div>
                 <div class="card-body">
                 <h4 class="card-title">'.$row["bname"].'</h4>
                 <p class="card-text">'.$row["pname"].'</p>
                 <a href="#" class="btn btn-outline-success my-2 my-sm-0">Button</a>
           </div>
       </div>
  </div>';

Need to show dropdown on the basis of another dropdown using php and ajax

Simplified Answer:

I've omitted some database checking etc to keep it short.

Billing.php

 <?php
 $con = mysqli_connect("MyWebsite.localdomain","root","shekhar123","test_youtube");
 $sql = "select DISTINCT CompanyName from mobile_data";
 $retval = mysqli_query($con,$sql);
 ?>

<form method="POST">
   <select name="companyname" onchange="companysortlist(this.value)">
      <option value=''>Select a Mobile:</option>
      <?php 
        while($row = mysqli_fetch_array($retval)){
         echo "<option value='".$row['CompanyName']."'>".$row['CompanyName']."</option>";
         }
      ?>
   </select>

   <select name="modelname" class="companymodelname">
       <!-- note the select is completely empty, it will be fill by ajax -->
   </select>
</form>

<script>
function companysortlist(data){
  $.ajax({
      type: 'POST',
      url: 'ajax.php',
      data: "ajaxcompanyname=" + data,
     success: function (data) {
          $('.companymodelname').html(data);
      }
  });
}
</script>

ajax.php

<?php
 $con = mysqli_connect("MyWebsite.localdomain","root","shekhar123","test_youtube");
 $sql = "select DISTINCT  ModelName from mobile_data where CompanyName='".$_POST['ajaxcompanyname']."'";
 $retval = mysqli_query($con,$sql);


 while($row = mysqli_fetch_array($retval)){
      echo "<option value='".$row['ModelName']."'>".$row['ModelName']."</option>";
  }
 ?>

Please note

I still have not fixed any of the sql injection vulnerabilities in your code

How do I make filters work together using AJAX, PHP and MySQL

You need to send both filters every time each of them changes:

JS:

$(document).ready(function(){
    $('.filter').change(function(){ 
        $.ajax({
            type: "GET", 
            url: "processes/filters.php", 
            data: {
                category: $('#category').val(),
                datePeriod: $('#datePeriod').val(),
            },
            success: function(result){ 
                $("#output").html(result);
            }
        });
    });            
    $("#datePeriod").trigger("change");
});

PHP:

<?php
if($_GET['category'] == "All"){
    $category = "";
} else if($_GET['category'] == "Abraham"){
    $category = "AND VISIT_REASON='Abraham'";
} else if( $_GET['category'] == "Kevin"){
    $category = "AND VISIT_REASON='Kevin'";
} else if($_GET['category'] == "Eric"){
    $category = "AND VISIT_REASON='Eric'";
} else {
    $category = '';
}

if($_GET['datePeriod'] == "Today"){
    $datePeriod = 'AND DATE(VISIT_DATE) = CURDATE()';
} else if($_GET['datePeriod'] == "Yesterday"){
    $datePeriod = 'AND VISIT_DATE >= DATE(NOW()) - INTERVAL 1 DAY';     
} else if($_GET['datePeriod'] == "Last 7 days"){
    $datePeriod = 'AND VISIT_DATE >= DATE(NOW()) - INTERVAL 7 DAY';
} else if($_GET['datePeriod'] == "Last month"){
    $datePeriod = 'AND VISIT_DATE >= DATE(NOW()) - INTERVAL 1 MONTH';
} else if($_GET['datePeriod'] == "Last year"){
    $datePeriod = 'AND VISIT_DATE >= DATE(NOW()) - INTERVAL 1 YEAR';
} else {
    $datePeriod = '';
}
// the rest of the file

Dynamically update dropdown based on previous selection with PHP PDO

The onchange call should be on the select element not on the label

<label class="col-sm-2 form-control-label">Codigo Productor (*)</label>
<select name="vendedor_codigo onchange="productorInfo(this.value)">

But also it occurs to me you may not quite understand the process. Your ajax call won't be fired when the page loads so this bit:

<select id="ajax-vendedor" name="vendedor_nombre">
            <?php foreach ($ajax_productor_result as $dd_productor_display) : ?>
            <option placeholder="Seleccione codigo" value="<?= $dd_productor_display['vendedor_nombre']; ?>">
                <?= $dd_productor_display['vendedor_nombre']; ?>
            </option>

i would think is giving you undefined variable warnings (unless you are setting $ajax_productor_result initially in some way)

Responses from ajax are usually drawn in .js via success: function

(result) {
            $("#ajax-vendedor").html(result);
        }

from the looks of this though - unless there is more code that what has been posted, you are passing the .html() function an array or database rows so it's never going to display anything.

so you need to
1)draw a select with no options in it on pageload (or default options if you have them)
2)return a response that the success function can make use e.g. a json string which jquery can the parse
3)format the data in jquery into the <options> and then user the .html() function to update the select
4)if you want this to happen when the page initially loads then add in a document ready call to the productorInfo(id) function - this would be relevant if you are setting the initial select value in some way (so it may not be relevant to you)

Update a span when a select dropdown is made using ajax

Try this,

   var options = [];
   for (var x = 0; x < data.length; x++) {
          options = data[x]['priceeach'];
   }
   $('#priceeach1').text(options.join(','));

Dynamic Dependant Dropdown menu with ajax php mysql

in second ajax function you have assigned the school drop down box value to state variable but you pass the variable school to ajax post. So there is no school variable that is why you get error.

$("#school").change(function(){
 var *state* = $("#school").val();
 //above variable should be school.
 $.ajax({
  type:"post", 
  url:"dropdown2.php", 
  data:"school="+*school*, 
  success: function(data) {
   $("#classname").html(data);
  }
 });
});

Filtering datalist by onchange from php

You should try ajax to do that

<select class="form-control" name="class" id="class" onchange="ajax_change(this.value)" >
<option value="">--</option>
<option value="X NET 1">X NET 1</option>
<option value="X NET 2">X NET 2</option>
<option value="XI NET 1">XI NET 1</option>
<option value="XI NET 2">XI NET 2</option>
</select>

In your script

function ajax_change(str){
 $.ajax({
        type: 'POST',
        url: 'ajax.php',
        data: {class: str},
        success: function (data) {            
           $("#checkName").html(data);
        },
        error: function (xhr) {
           //Do Something to handle error
           alert("some error found");
        }
    });
 }

In your ajax.php

//include connection
if(isset($_POST["class"])){
$sql_siswa = "SELECT name from student where class like '".$_POST["class"]."' order by name;";
$result = $conn->query($sql_siswa);
if ($result->num_rows > 0){
    while($row = $result->fetch_assoc()){
        echo "<option value=\"".$row["name"]."\">";
    }
 }
}

---

Related Topics