2

ajax-jQueryを使用して小さな検索エンジンを処理し、PHPで関数を実行した後、配列JSONを作成しました。これを処理して、テーブルに行を追加する必要がありますが、混乱します。

クエリmysqlのJSON形式は問題ありませんが、データを処理してテーブルを生成したり、既存のテーブルに追加したりする方法がわかりません。

JSONの各要素を取得するためにそれぞれ適用されると思いますが、私はそうは思いません。

注：私のJSONコードはこの方法で生成されました

       ...........
       $jsonSearchResults = array();
                while ($row = mysql_fetch_assoc($result)) {
                    $jsonSearchResults[] =  array(
                        'clavemat' => $row['cve_mat'],
                        'tipomat' => $row['tipo_mat'],
                        'titulomat' => $row['titulo_mat'],
                        'autormat' => $row['autor_mat'],
                        'editmat' => $row['edit_mat'],
                        'success' => 'success'  
                    );
                }
         echo json_encode ($jsonSearchResults);

テーブルHTML

.........
<table class="busqueda">
<tr>
<th scope="col">Clave</th>
<th scope="col">Tipo</th>
<th scope="col">Título</th>
<th scope="col">Autor</th>
<th scope="col">Editorial</th>
</tr>
</table>
........

JSONコード

[
{
"clavemat":"LICOELMCUS",
"tipomat":"Libro",
"titulomat":"Contabilidad",
"autormat":"Elias Flores",
"editmat":"McGraw Hill",
"success":"success"
},
{
"clavemat":"LICUDEMCNU",
"tipomat":"Libro",
"titulomat":"Curso java",
"autormat":"Deitel",
"editmat":"McGraw Hill",
"success":"success"
},
{
"clavemat":"REECMUMUNU",
"tipomat":"Revista",
"titulomat":"Eclipses",
"autormat":"Muy Interesante",
"editmat":"Muy interesante",
"success":"success"
},
{
"clavemat":"TEPLPLTENU",
"tipomat":"Tesis",
"titulomat":"Platanito Show",
"autormat":"Platanito",
"editmat":"Telehit",
"success":"success"
}
]

AJAX.JQUERYファイル

$.ajax({
            type: "POST",
            url: action,
            data: dataSearch,
            success: function (response) {

                if (response[0].success == "success") {
                    alert("Si hay datos");
                } else {
                    alert("No hay datos");
                }

            }
        });
        return false;
    });
4

2 に答える 2

2

これはうまくいくはずです

$.each(response, function (index, record) {
    var row = $("<tr />");
    $("<td />").text(record.clavemat).appendTo(row);
    $("<td />").text(record.tipomat).appendTo(row);
    $("<td />").text(record.titulomat).appendTo(row);
    $("<td />").text(record.autormat).appendTo(row);
    $("<td />").text(record.editmat).appendTo(row);

    row.appendTo("table.busqueda");
});

上記のコードは、クラス「busqueda」を持つ既存のテーブルに行を追加します。

于 2012-05-30T04:59:55.787 に答える
2

<tbody>テーブルに、動的行のコンテナーとして要素を追加できます。

<table class="busqueda">
  <thead>
    <tr>
      <th scope="col">Clave</th>
      <th scope="col">Tipo</th>
      <th scope="col">Título</th>
      <th scope="col">Autor</th>
      <th scope="col">Editorial</th>
    </tr>
  </thead>
  <tbody id="dynamic_rows">
    <!-- Ajax results go here -->
  </tbody>
</table>

そして、ajax 成功のコールバックで行をレンダリングします。

if (response[0].success == "success") {
  // Render dynamic rows here
  var $dynamic_rows = $('#dynamic_rows');

  // clear out old rows
  dynamic_rows.html('');

  ///////
  // You can use the row building code from Rafael's answer here
  // except append to $dynamic_rows

} else {
  alert("No hay datos");
}
于 2012-05-30T05:02:07.663 に答える