display Specific data using Ajax and jquery and html select button

Question

hello community i need help on this what i really want to do is to select from database using onchange() function through Ajax.then return the result to the client.i used Ajax to send the information to the server side and but i am having problem return it with the where condition

//this is the html page

 <body   style="font-family:arial bold; ">

<div style="text-align:left; padding:1%;  font-family:Arial bold; color:#cccccc;font-size:40px;"> Select</div>
      <select class="form-control"  id="color" name="color" >
<option >Please select an option</option> 
  <option> Red</option>
  <option  >Yellow</option>
  <option  >white</option>
  <option  >Black</option>
  <option  >Violet</option>
</select>
<br/>


//this is where the output will be displayed with parameter (res);
<div id="dis"></div>

</body>

//this is the script.js

$(function(){
    $('#color').on('change', function()
    {
    var selt= this.value ;
    d = $('#color').val();
    alert(d);
    $.ajax({
            url: "ajax-cart.php",
      method: "POST",
      data: { 
                request:"select",
            selt:selt
      }

        }).done(function(res) {

      $('#dis').val(res) ; 

console.log(res);
        });




  });

//this is ajax cart.php

  <?php// START THE SESSION
session_start();// CONFIGURATION
require("db.php");
// PROCESS REQUESTS
switch ($_POST['request']) {

  // THIS PART is for the select button
case "select":
require("db.php");

 $conn = new mysqli($dbServername, $dbUsername, $dbPassword, $dbName );

$val = $_POST['selt'];


$data =  $conn->query("SELECT * FROM `goods` where color = '.$val.' LiMIT 4");


echo Json_encode($data);
break;

this is the console result {"current_field":null,"field_count":null,"lengths":null,"num_rows":null,"type":null}

I think `.$val.` should be `$val` without those dots – Ali Sheikhpour Sep 29 '18 at 15:22 — Ali Sheikhpour, Sep 29 '18 at 15:22

Ali Sheikhpour · Answer 1 · 2018-09-29T15:43:23.900

0

When sending query to database you don't need to concatenate variables into the query. Just use variables as defined:

Wrong:

$data =  $conn->query("SELECT * FROM `goods` where color = '.$val.' LiMIT 4");

Correct:

$data =  $conn->query("SELECT * FROM `goods` where color = '$val' LiMIT 4");

After that you will need to produce data from query result. Please check this Q/A for more details.

edited Sep 29 '18 at 15:43

answered Sep 29 '18 at 15:25

Ali Sheikhpour

10,475
5
41
82

adaptable.services · Accepted Answer · 2018-09-29T15:54:43.150

0

@Blessed Media you just missed fetching mysql result, you are just returning query not result.

change your query to

$data = $conn->query("SELECT * FROM goods where color = '".$val."' LiMIT 4");

Add

$result = $data->fetch_array(MYSQLI_ASSOC);

after

$data = $conn->query("SELECT * FROM goods where color = '.$val.' LiMIT 4");

and then

echo json_encode($result);

edited Sep 29 '18 at 15:54

answered Sep 29 '18 at 15:29

adaptable.services

174
1
6

thanks but i echoed Json_encode($result); and changed $('#dis').val(res); to $('#dis').html(res); this the result i am getting from the database which is true but please how do i display it in html format cos this is not presentable to client-> {"product_id":"27","name":"Lion","itemtype":"GROCERIES","itemprice":"70000","color":"white","country":"France","city":"France","brand":"Gucci","image":"309918jack-merlin-55706-unsplash (1).jpg"} – Blessed Media Sep 29 '18 at 15:56
@BlessedMedia I'm happy that it solved your problem. – adaptable.services Sep 29 '18 at 16:34

display Specific data using Ajax and jquery and html select button

2 Answers2