how to get array values in ajax

Question

I am trying to show the values in Ajax I was getting array values in employee.php page but when I pass the value to getdata.js .It was not showing the result.

Check below Result for this:: >

 echo json_encode($data);   [{"0":"2","tax_id":"2","1":"GST","tax_type":"GST","2":"1","tax_comp":"1","3":"10","tax_Percent":"10"},{"0":"3","tax_id":"3","1":"CGST","tax_type":"CGST","2":"1","tax_comp":"1","3":"9","tax_Percent":"9"},{"0":"8","tax_id":"8","1":"new child","tax_type":"new child","2":"1","tax_comp":"1","3":"15","tax_Percent":"15"}]

--------------getEmployee.php------------------------------------------------

             if($_REQUEST['tax_id']) {
             $sql = "SELECT tax_id, tax_type, tax_comp, tax_Percent FROM ca_taxmaster WHERE tax_comp='".$_REQUEST['tax_id']."'";
              $resultset = mysql_query($sql) or die(mysql_error());
              $data = array();
              while( $rows = mysql_fetch_array($resultset) ) {
              $data[] = $rows;
             // $data[] = $rows['tax_id'] . " " . $rows['tax_type'] . " " . $rows['tax_comp'] . " " . $rows['tax_Percent'];
              }
              echo json_encode($data);
              } else {
              echo 0;
              }?>

------------------------------------- getData.js ------------------------------------------------------------------------ Path:- resources/js/getData.js">

    $(document).ready(function(){
   // code to get all records from table via select box
   $("#employee").change(function() {
   var tax_id = $(this).find(":selected").val();
   var dataString = 'empid='+ tax_id;
   $.ajax({
        url: 'http://localhost/capms_v2_feb/ajax/getEmployee.php',
        dataType: "json",
        data: dataString,
        cache: false,
        success: function(employeeData) {
        //alert(data);
   if(employeeData) {

       $("#heading").show();
       $("#no_records").hide();
       $("#tax_type").text(employeeData.tax_type);
       $("#tax_comp").text(employeeData.tax_comp);
       $("#tax_Percent").text(employeeData.tax_Percent);
       $("#records").show();
    } else {
       $("#heading").hide();
       $("#records").hide();
       $("#no_records").show();
        }
      }
     });
    })
   });

------------------------------------- View ------------------------------------

  <select id="employee">
    <option value="" selected="selected">Please select</option>

    <?php
    $sql = "SELECT tax_id, tax_type, tax_comp, tax_Percent FROM ca_taxmaster where tax_comp = '0'";
    $resultset = mysql_query($sql) or die( mysqli_error());
    while( $rows = mysql_fetch_array($resultset)) {
    ?>
    <option value="<?php echo $rows["tax_id"]; ?>"><?php echo $rows["tax_type"]; ?></option>
    <?php } ?>
   </select>


  <div id="display">
  <div class="row" id="heading" style="display:none;"><h3><div class="col-sm-4"><strong>Employee Name</strong></div><div class="col-sm-4"><strong>Age</strong></div><div class="col-sm-4"><strong>Salary</strong></div></h3></div><br>      
  <div class="row" id="records">
    <div class="col-sm-4" id="tax_type"></div>
    <div class="col-sm-4" id="tax_comp"></div>
    <div class="col-sm-4" id="tax_Percent"></div>

  </div>     
  <div class="row" id="no_records"><div class="col-sm-4">Plese select employee name to view details</div></div>

If anyone knows help me thanks in advance

Please click below link:

database screenshot

I need ouput like this screenshot

You should try adding header("Content-type:application/json"); on your php file. — cjatstackoverflow
– cjatstackoverflow, Commented Feb 16, 2018 at 5:41
You're open to a sql injection attack btw: localhost/capms_v2_feb/ajax/… — 000
– 000, Commented Feb 16, 2018 at 5:48

Gur Janjua · Accepted Answer · 2018-02-16 05:08:13Z

1

You can do as in this way:

var employeeData = [{"0":"2","tax_id":"2","1":"GST","tax_type":"GST","2":"1","tax_comp":"1","3":"10","tax_Percent":"10"},{"0":"3","tax_id":"3","1":"CGST","tax_type":"CGST","2":"1","tax_comp":"1","3":"9","tax_Percent":"9"},{"0":"8","tax_id":"8","1":"new child","tax_type":"new child","2":"1","tax_comp":"1","3":"15","tax_Percent":"15"}];

employeeData.forEach(function(item) {
  var data = '<tr>';
  data+= '<td>'+item.tax_type+'</td>';
  data+= '<td>'+item.tax_comp+'</td>';  
  data+= '<td>'+item.tax_Percent+'</td>';
  data+='</tr>';
  $('.appendData').append(data);
});

<table>
  <thead>
    <th>Type</th>
    <th>Camp</th>
    <th>Percentage</th>
  </thead>
  <tbody class="appendData">
    
  </tbody>
</table>

answered Feb 16, 2018 at 5:08

Gur Janjua

2532 silver badges11 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

cjatstackoverflow · Accepted Answer · 2018-02-16 06:21:57Z

0

You should try adding header("Content-type:application/json"); before you echo json_encode on your php file.

And please try changing the following lines:

 if($_REQUEST['tax_id']) to $_REQUEST['empid']
    $sql = "SELECT tax_id, tax_type, tax_comp, tax_Percent FROM ca_taxmaster WHERE tax_comp='".$_REQUEST['tax_id']."'"; 
to 
$sql = "SELECT tax_id, tax_type, tax_comp, tax_Percent FROM ca_taxmaster WHERE tax_comp='".$_REQUEST['empid']."'";

OR try this



 Change var dataString = 'empid='+ tax_id; to  var dataString = 'tax_id ='+ tax_id;

edited Feb 16, 2018 at 6:21

answered Feb 16, 2018 at 5:42

cjatstackoverflow

11711 bronze badges

4 Comments

cjatstackoverflow Over a year ago

@Jennifer Could you run "console.log(employeeData);" on your success ajax and see what it shows?

cjatstackoverflow Over a year ago

@Jennifer I found out that your condition is checking for $_REQUEST['tax_id'] which is incorrect. Change it to $_REQUEST['empid']

Jennifer Over a year ago

thank you cjatstackoverflow it's working now $_REQUEST['empid'] is corrected but i asked for array of value in this way var employee = [employeeData]; employeeData.forEach(function(item) { var data = '<tr>'; data+= '<td>'+item.tax_type+'</td>'; data+= '<td>'+item.tax_comp+'</td>'; data+= '<td>'+item.tax_Percent+'</td>'; data+='</tr>'; $('.appendData').append(data); }); now it's working fine thanks for you valuable time

cjatstackoverflow Over a year ago

@Jennifer Please set this as an answer if that solves your problem. :)

Collectives™ on Stack Overflow

how to get array values in ajax

2 Answers 2

Comments

4 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

4 Comments

Your Answer

Sign up or log in

Post as a guest

Related