Question

我有一个表的代码：

<table class="table table-hover">
                          <thead>
                          <tr>
                              <th>ID Komponen</th>
                              <th>Nama Komponen</th>
                              <th>Ekuivalen SKS</th>
                              <th>Ekuivalen Jam</th>
                              <th>Indikator</th>
                          </tr>

                          </thead>
                          <tbody id="badan_tabel" >

                          </tbody>
                      </table>

和jQuery代码：

  <script >
  
     function init()
  {
	$.get("http://paramadina.net:18011/data/psc_komponen", {id:1}, function(data) 
	{ 
		console.log(data);
		var tr="<tr><td>" + data.id + "</td>";
			tr += "<td>" + data.nama_komponen + "</td>";
			tr += "<td>" + data.ekuivalen_sks + "</td>";
			tr += "<td>" + data.ekuivalen_jam + "</td>";
			tr += "<td>" + data.indikator + "</td></tr>";

		$("#badan_tabel").append(tr);
	});
  }
  
  </script>

如您所见，我按ID {id：1}获取数据。它有大约20个数据，我想把它全部放到表中。我不知道如何一次调用所有数据ID

Answer 1

＆＃13;

  <script >
  
  function init()
  {
    for(x=1;x<=20;x++)
    {
	$.get("http://paramadina.net:18011/data/psc_komponen", {id:x}, function(data) 
	{ 
		console.log(data);
		var tr="<tr><td>" + data.id + "</td>";
			tr += "<td>" + data.nama_komponen + "</td>";
			tr += "<td>" + data.ekuivalen_sks + "</td>";
			tr += "<td>" + data.ekuivalen_jam + "</td>";
			tr += "<td>" + data.indikator + "</td></tr>";

		$("#badan_tabel").append(tr);
	 });
       }      
   }
  
  </script>

＆＃13;

Answer 2

你不能获得JSON数组响应，而不是连续20次敲击这个糟糕的网络服务器吗？

[
    {
        "id": 1,
        "nama_komponen": "Tugas Belajar",
        "ekuivalen_sks": 17,
        "ekuivalen_jam": 40,
        "indikator": "Surat Tugas|Surat Kontrak"
    },
    {
        "id": 2,
        "nama_komponen": "Penelitian",
        "ekuivalen_sks": 6,
        "ekuivalen_jam": 24,
        "indikator": "Surat Tugas"
    }, 
    {
        "id": 3,
        "nama_komponen": "Tugas Belajar",
        "ekuivalen_sks": 17,
        "ekuivalen_jam": 40,
        "indikator": "Surat Tugas|Surat Kontrak"
    }, 

    etc ...
]

Answer 3

我不确定如何获取数据，但这是有效的

<?php
//data from database usually in this format
//pass the id to your db query here, 
//e.g if you use function $a = $_GET['id'];
// $data = call_user_function('function_name',$a);
$data = array(array("id"=> 1,  "nama_komponen"=>"Tugas Belajar",    "ekuivalen_sks"=> 17,"ekuivalen_jam"=>40, "indikator"=> "Surat Tugas|Surat Kontrak"), 
        array("id"=> 2, "nama_komponen"=>"Tugas 22Belajar", "ekuivalen_sks"=> 172,  "ekuivalen_jam"=>40,  "indikator"=> "Surat Tugas|Surat Kontrak"));

//convert 
foreach($data as $dat):
    $a = $dat['id'];
    $b = $dat['nama_komponen'];
    $c = $dat['ekuivalen_sks'];
    $d = $dat['ekuivalen_jam'];
    $e = $dat['indikator'];
    $json[] = array("id"=>$a, "nama_komponen"=>$b, "ekuivalen_sks"=>$c, "ekuivalen_jam"=>$d, "indikator"=> $e);
endforeach;
header("Content-type: application/json");
echo json_encode($json);
?>

控制台中abouve的输出是

[object, object]

因此，您的脚本将提供所需的输出

<script>
$(function() {
$.get("ajax.php", {id:1}, function(data) {
        console.log(data);
        $.each(data, function (index, value) {        

             tr="<tr><td>" + value.id + "</td>";
                tr += "<td>" + value.nama_komponen + "</td>";
                tr += "<td>" + value.ekuivalen_sks + "</td>";
                tr += "<td>" + value.ekuivalen_jam + "</td>";
                tr += "<td>" + value.indikator + "</td></tr>";
                $("#badan_tabel").append(tr);
        });

});
});

使用jQuery从url获取多个数据

3 个答案: