показать данные на таблице с ajax на той же странице

У меня проблема с ajax на той же странице. его мой код:показать данные на таблице с ajax на той же странице

 $.ajax({ 
 
      type: "POST", 
 
      url: "test.php", 
 
      dataType: 'json', 
 
      data: {}, 
 
      success: function (data) { 
 
       console.log(data); 
 
       var teks = ""; 
 
       $.each(data.detail, function (index, val) { //looping table detail bahan 
 
        var no = val.no; 
 
        var tanggal = val.tanggal; 
 
        var jml_in = val.barang_in; 
 
        var jml_out = val.barang_out; 
 
        var pihak_zenitha = val.pihak_zenitha; 
 
        var pihak_vendor = val.pihak_vendor; 
 

 
        teks += "<tr class='tr_detail'><td>" + no + 
 
          "</td><td>" + tanggal + 
 
          "</td><td>" + jml_in + 
 
          "</td><td>" + jml_out + 
 
          "</td><td>" + pihak_zenitha + 
 
          "</td><td>" + pihak_vendor + 
 
          "</td></tr>"; 
 
       }); 
 
       $(".tbody_target").append(teks); 
 
      } 
 
     });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 

 
<table class="table" style="border: 1px solid #000;"> 
 
     <thead> 
 
      <tr> 
 
       <th class="w2 text-center">No</th> 
 
       <th class="w8 text-left">Tanggal</th> 
 
       <th class="w10 text-center">IN Zenitha</th> 
 
       <th class="w10 text-center">OUT Zenitha</th> 
 
       <th class="w35 text-left">Pihak Zenitha</th> 
 
       <th class="w35 text-left">Pihak Vendor</th> 
 
      </tr> 
 
     </thead> 
 
     <tbody class="tbody_target"> 
 
     </tbody> 
 
    </table> 
 

 
<?php 
 

 
//data convert to json 
 
exit(json_encode($return)); 
 

 
?>

я, чтобы много раз пытался, но он не работает и не показывает ошибку. и в консоли, не показывать ничего. пожалуйста помогите. это меня смущает .. спасибо, ребята .......................................... ..............

источник

2016-10-22 wawan Setiyawan

Вы уверены, что этот вызов ajax выполняется? Где вы его выразили?

Попробуйте

console.log('here!');

прямо перед Ajax вызова, я думаю, что это не добраться до этой линии.

Положи куда-нибудь вы знаете, будет срабатывать, или в документе готовы обратного вызова

$(document).ready(function() { ...HERE... });

источник

2016-10-22 10:39:25 Danielle

Во-первых, вы должны обернуть свой код в ready.

Ajax

$(document).ready(function(){ 
    $.ajax({ 
      url: "test.php", 
      type: "POST", 
      data: {'isAjax': 'yes'}, 
      success: function (data) { 
       console.log(data); 
       $(".tbody_target").append(data); 
      } 
     }); 
});

PHP КОД

if(!empty($_POST)) 
{ 
    //data convert to json 
    $return = [1,2]; 
    echo json_encode($return); 
    exit; 
}

Things отметить:

Ajax должны иметь данные POST, чтобы определить, что необходимо вернуть данные.
$_POST данные должны в первой строке PHP.
Используйте echo, чтобы вернуть данные в запрос Ajax и exit(), чтобы остановить выполнение при вызове ajax.

источник

2016-10-22 10:44:33

@wawan: Вы пытались? –

Я делаю с '$ (document) .ready (function() {... ЗДЕСЬ ...});' и do 'async: false'. console.log не показывать ничего. см. полный код [jsfiddle] (https://jsfiddle.net/tubuc90v/) –

преобразование данных в json в порядке, я проверяю его в jsonlint –

  <?php 
      if(!empty($_POST)){ 
      //connect to db or do what ever to retern 
      // $return = JSON 
      header('Content-type: application/json'); 
      echo json_encode($return); 
      }else{ 
      ?> 
<!DOCTYPE html> 
<html> 
    <head> 
    <title>ajax call</title> 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
    </head> 
      <body> 
      <table class="table" style="border: 1px solid #000;"> 
        <thead> 
         <tr> 
          <th class="w2 text-center">No</th> 
          <th class="w8 text-left">Tanggal</th> 
          <th class="w10 text-center">IN Zenitha</th> 
          <th class="w10 text-center">OUT Zenitha</th> 
          <th class="w35 text-left">Pihak Zenitha</th> 
          <th class="w35 text-left">Pihak Vendor</th> 
         </tr> 
        </thead> 
        <tbody class="tbody_target"> 
        </tbody> 
       </table> 
     <script> 
        $.ajax({ 
         type: "POST", 
         url: "test.php", 
         dataType: 'json', 
         data: {}, 
         success: function (data) { 
          console.log(data); 
          var teks = ""; 
          $.each(data.detail, function (index, val) { //looping table detail bahan 
           var no = val.no; 
           var tanggal = val.tanggal; 
           var jml_in = val.barang_in; 
           var jml_out = val.barang_out; 
           var pihak_zenitha = val.pihak_zenitha; 
           var pihak_vendor = val.pihak_vendor; 

           teks += "<tr class='tr_detail'><td>" + no + 
             "</td><td>" + tanggal + 
             "</td><td>" + jml_in + 
             "</td><td>" + jml_out + 
             "</td><td>" + pihak_zenitha + 
             "</td><td>" + pihak_vendor + 
             "</td></tr>"; 
          }); 
          $(".tbody_target").append(teks); 
         } 
        }); 
     </script> 
    </body> 
    </html> 
      <?php 
      } 
      ?>

источник

2016-10-22 11:10:02

показать данные на таблице с ajax на той же странице

ответ

Смежные вопросы