PHP-需要第一个表中的前3个json数据和第二个表中的所有数据

时间:2012-12-14 08:19:54

标签: php javascript jquery mysql json

我是PHP编程的初学者。我有一个代码,我需要获得第一个表中的前3个数据和下一个表中的所有数据。数据来自db作为json。

以下是我的php文件

<?php 
    $host = "localhost"; 
    $user = "root"; 
    $pass = ""; 
    $database = "TMS_Sample"; 

    $linkID = mysql_connect($host, $user, $pass) or die("Could not connect to host."); 
    mysql_select_db($database, $linkID) or die("Could not find database."); 


    $result = mysql_query("SELECT * FROM Completed_Training");
    while ($row = mysql_fetch_assoc($result)) {
        $array[] = $row;
    }
    echo json_encode($array);
?> 

我得到以下json:

[{"Date":"2012-12- 04","Topic":"Collections","Trainer":"Prabhakaran.G","Status":"Invitation Sent"},{"Date":"2012-12-12","Topic":"Collections","Trainer":"Prabhakaran.G","Status":"Invitation Sent"},{"Date":"2012-12-07","Topic":"ffb","Trainer":"vcvxcv","Status":"cvxcv"},{"Date":"2012-12-08","Topic":"xcv","Trainer":"cvxcv","Status":"vxcv"},{"Date":"2012-12-09","Topic":"cvxcv","Trainer":"cvxcv","Status":"cvxcvxc"},{"Date":"2012-12-10","Topic":"xcv","Trainer":"vxcvxc","Status":"vxcv"},{"Date":"2012-12-11","Topic":"vv","Trainer":"vv","Status":"vxcv"},{"Date":"2012-12-12","Topic":"vv","Trainer":"vcv","Status":"cvxcv"},{"Date":"2012-12-13","Topic":"vv","Trainer":"cvxcv","Status":"cvv"},{"Date":"2012-12-14","Topic":"vxcv","Trainer":"vccv","Status":"xcvcv"},{"Date":"2012-12-14","Topic":"vcxvxc","Trainer":"cvxcv","Status":"cvxcv"},{"Date":"2012-12-15","Topic":"cvxcv","Trainer":"xcvxcv","Status":"xcvxcv"},{"Date":"2012-12-16","Topic":"sdasd","Trainer":"sdasd","Status":"dscxzc"},{"Date":"2012-12-16","Topic":"scxzcxzc","Trainer":"sdfscxzc","Status":"sadffcvzxc"},{"Date":"2012-12-17","Topic":"fxzcvxzc","Trainer":"zcvxzcz","Status":"xzcxzcxzcxz"},{"Date":"2012-12-18","Topic":"xzceafsdfv","Trainer":"vxvxv","Status":"xgsdfgvsd"},{"Date":"2012-12-12","Topic":"xcdvxvxcv","Trainer":"vxzdgvgSv","Status":"gbvsgv"},{"Date":"2012-12-27","Topic":"SDgvsdv","Trainer":"sdvsdv","Status":"sdgvsdv"},{"Date":"2012-12-11","Topic":"sdvsvd","Trainer":"sdvsdv","Status":"vdv"},{"Date":"2012-12-22","Topic":"dvsdv","Trainer":"vssdv","Status":"vsdvV"}]

现在我需要的是在html表中显示这个json数据

我已在1个表格中显示所有数据。但我需要的是获取第一个表中的前3个数据和下一个表中的所有数据。

这是我的HTML代码:

<!DOCTYPE HTML>
<html>
    <head>
        <script type="text/javascript" src="jquery182.js"></script>
        <script type="text/javascript" language="javascript">
            $(document).ready(function () {
                $.getJSON('CompletedTraining.php', null, function (data) {
                    var Completed_counter = 1;
                    if (data) {
                        if (Completed_counter <= 3) {
                            var table = '<table border="1">';
                            $.each(data, function (i, element) {
                                table += '<tr>';
                                table += '<td>' + element.Date + '</td>';
                                table += '<td>' + element.Topic + '</td>';
                                table += '<td>' + element.Trainer + '</td>';
                                table += '<td>' + element.Status + '</td>';
                                table += '</tr>';
                            });
                            table += '</table>';
                            $('#getname').html(table);
                        }

                        var table1 = '<table border="1">';
                        $.each(data, function (j, element1) {
                            table1 += '<tr>';
                            table1 += '<td>' + element1.Date + '</td>';
                            table1 += '<td>' + element1.Topic + '</td>';
                            table1 += '<td>' + element1.Trainer + '</td>';
                            table1 += '<td>' + element1.Status + '</td>';
                            table1 += '</tr>';
                        });
                        table1 += '</table>';
                        $('#getname1').html(table1);
                        Completed_counter = Completed_counter + 1;
                    } else {
                        alert("error");
                    }
                });
            });
        </script>
    </head>
    <body>
        <form name="index">
            <table id="getname" ></table>
            <table id="getname1" ></table>
        </form>
    </body>
</html>

1 个答案:

答案 0 :(得分:1)

我尽可能简单...这样很容易理解..

无需循环数据两次...使用$.each()函数一次..并检查$.each函数内的条件

这是小提琴..

http://jsfiddle.net/yXB3W/4/

<强>更新

另一个小提琴..

http://jsfiddle.net/yXB3W/7/

您已有数据..所以您只需要查看来自if(data)...的小提琴代码