テーブルにデータベース要素の配列を取得したい

Question

私のデータベースの配列をjsonオブジェクトでテーブルに取得しようとしていますが、データベースの最初の行がテーブルの要素として、最後のデータベース行として残ります。出力には表示されません。

$('#output').html("<some code>"); 

がの内容を上書き：ここ

Answer 1

まず正しいマナーでその出力を準備すべきか

<script id="source" language="javascript" type="text/javascript"> 

$(function() 
{ 
    $.ajax({          
    url: 'example.php',    
    data: "",      
            //for example "id=5&parent=6" 
    dataType: 'json',    //data format  
    success: function(data)   //on recieve of reply 

     { 
    for(var i = 0; i < data.length; i++){ 
var uid = data[i];    
var firstname = data[i];  
var lastname = data[i]; 
var email = data[i]; 
var username = data[i]; 
var password = data[i]; 
    } 
     $('#output').html("<b>uid: </b>"+uid+"<b> firstname: </b>"+firstname+"<b> lastname: </b>"+lastname+"<b> email: </b>"+email+"<b> username: </b>"+username+"<b> password: </b>"+password); 


    } 
    }); 
    }); 
    </script> 

example.php私のコード

<?php 

// server info 
$server = 'localhost'; 
$user = 'root'; 
$pass = ''; 
$db = 'ocean'; 

$connection = mysql_connect($server, $user, $pass) or die(mysql_error()); 
$database = mysql_select_db($db) or die(mysql_error()); 


    $result = mysql_query("select * from oops");  //query 

    $array = array(); 

while ($row = mysql_fetch_row($result)) { 
$array[] = $row; 
} 

echo json_encode($array); 



    ?> 

です毎回。だから、あなたは最後の結果しか見ることができません。私はあなたが使うべきだと思うどちらかappend()：

$('#output').append("<some code>"); 

または変数にすべての行を収集し、一度html()を使用します。

var html = ""; 
for(var i = 0; i < data.length; i++){ 
    var uid = data[i];    
    var firstname = data[i];  
    var lastname = data[i]; 
    var email = data[i]; 
    var username = data[i]; 
    var password = data[i]; 

    html += "<b>uid: </b>"+uid+"<b> firstname: </b>"+firstname+"<b> lastname: </b>"+lastname+"<b> email: </b>"+email+"<b> username: </b>"+username+"<b> password: </b>"+password; 
} 
$("#output").html(html); 

第二：

var uid = data[i];    
var firstname = data[i];  
var lastname = data[i]; 

このすべての変数ポイント1つの値にdata[i]。 おそらく：

var uid = data[i].uid;    
var firstname = data[i].firstname;  
var lastname = data[i].lastname; 

？

更新：

あなたがテーブルの行としてデータを表示したい場合は、のような何かを行うことができます。

html += "<tr>\ 
    <td><b>uid: </b>"+uid+"<b></td>\ 
    <td><b>firstname: </b>"+firstname+"</td>\ 
    <td><b> lastname: </b>"+lastname+"</td>\ 
    <td><b> email: </b>"+email+"</td>\ 
    <td><b> username: </b>"+username+"</td>\ 
    <td><b> password: </b>"+password+"</td>\ 
</tr>"; 

を、その後：

$("#output").html("<table>" + html + "</table>"); 

Answer 2

あなたは、AJAXを置き換えることができます電話： $ .ajax（{ データタイプ： "json"、 url：url、 データ：データ、 成功：成功 }）;この使用jQueryを使って

：

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
$.getJSON("ajax/test.json", function(data) { 
    var items = []; 
    $.each(data, function(key, val) { 
    items.push("<li id='" + key + "'>" + 
    "<b>uid: </b>" + value.uid + 
    "<b> firstname: </b>" + value.firstname + 
    "<b> lastname: </b>" + value.lastname + 
    "<b> email: </b>" + value.email + 
    "<b> username: </b>" + value.username + 
    "<b> password: </b>" + value.password + "</li>"); 
    }); 

    $("<ul/>", { 
    "class": "my-new-list", 
    html: items.join("") 
    }).appendTo("body"); 
}); 

あなたのJavaScriptでは、あなたがこれを使用する：

var uid = data[i];    
var firstname = data[i]; 
... 
var username = data[i]; 
var password = data[i]; 

あなたは同じ値data[i]を持つすべてのこれらの変数を設定しています。あなたはJavaScriptが代わりにこれを試して、あなたを使用するようにして試してみたい場合：

var uid = data[i].uid;    
var firstname = data[i].firstname;  
... 
var username = data[i].username; 
var password = data[i].password; 

したがって、あなたのコードは次のようになります？この#output」とは何である

$(function() { 
    $.ajax({ 
     url: 'example.php', 
     data: "", 
     //for example "id=5&parent=6" 
     dataType: 'json', //data format  
     success: function(data) { 
     data.forEach(function(entry) { 
      var uid = entry.uid; 
      var firstname = entry.firstname; 
      var lastname = entry.lastname; 
      var email = entry.email; 
      var username = entry.username; 
      var password = entry.password; 
      } 
      $('#output').append("<b>uid: </b>" + uid + 
      "<b> firstname: </b>" + firstname + 
      "<b> lastname: </b>" + lastname + 
      "<b> email: </b>" + email + 
      "<b> username: </b>" + username + 
      "<b> password: </b>" + password); 
     }); 
    } 
    }); 
});