0

私はいくつかの基本的なガイダンスを探しています。jQueryを理解しています。そして、私はPHPを理解しています。私は、AJAX を利用することに頭を悩ませています。

AJAX を使用して PHP および後続のデータベース コンテンツからデータを取得できますが、それを HTML で使用するにはどうすればよいですか?

私が慣れていること：

<?php
echo '<html><head></head><body>';

 $query = mysql_query("SELECT something FROM sometable WHERE field='.$field.'");
 while ($row = mysql_fetch_array($query)) {
    $id = $row['id'];
    $name = $row['name'];
    if (str_len($name >= 15)) { $name = substr($name,0,15)."..."; }
    $icon = '';
    switch($id) {
      case 1: $icon = 'A';
      case 2: $icon = 'B';
      case 3: $icon = 'C';
     }

      echo '<a href="#'.$id.'">'.$icon.$name.'</a><br />';
 }


 echo '</body></html>';
?>

同様の方法で AJAX を使用するにはどうすればよいですか?
それとも、AJAXで同様のことを試す必要がありますか?

たとえば、これを行うことができます (周囲の正しい HTML 内):

    $.ajax({                                      
      url: 'api.php',         
      data: "", 
      dataType: 'json',       
      success: function(rows)  
      {
        for (var i in rows) {
        var row = rows[i];
            var id = row[0]; 
        var vname = row[1]; 
            $('#output').html('<a href="#id'+id+'">'+vname+'</a><br />'); 
            }
    }
  });

私が苦労しているのは、スイッチやその他のデータ操作を AJAX アイテム/データ/オブジェクトとして実装する方法を理解することです。

API データ呼び出しは次のようになります。

$result = mysql_query("SELECT something FROM sometable WHERE field =$field");        
  $data = array();
  while ($row = mysql_fetch_row($result)) {
  $data[]=$row;
  }
  echo json_encode($data);

ここでデータを操作する必要がありますか? もしそうなら、最善の方法はありますか?:

PHP でデータ操作をセットアップするだけですか? もしそうなら、どのようにAJAX経由でそのデータを適切に渡すのですか?

それとも、jQuery/javascript を使用してすべてのデータ操作を実行する必要がありますか?

私が検索したところ、見つけた AJAX チュートリアルの 90% は本質的に単純であり、これらの種類のことを実際に説明していません。

編集: JSON データの一般的なコンソール出力は次のようになります。

success: function(data)  
      {
       $.each(data, function(index, item){
        var name;
        for(name in item){ console.log(name + " = " + item[name]);}
        });
     }

そしてコンソール：

{ 0 = id }
{ 1 = name }
{ 2 = 3.7 }
{ 3 = Y }
{ 4 = 0 }
4

1 に答える 1

0

OK この構造で返された JSON を検討してください

{"menu": {
    "header": "SVG Viewer",
    "items": [
        {"id": "OpenNew", "label": "Open New"}
        {"id": "ZoomIn", "label": "Zoom In"},
        {"id": "ZoomOut", "label": "Zoom Out"},
        {"id": "OriginalView", "label": "Original View"}
    ]
}}

次に、次のようにして のリストを に追加<a>します#output。

$.ajax({
    url: 'api.php',
    dataType: 'json',
    success: function (data) {
        items = data.menu.items;
        $.each(items, function (index, item) {
            $('#output').append('<a href="#id' + item.id + '">' + item.label + '</a><br />');
        });
    }
});
于 2013-08-21T09:01:25.797 に答える