AJax在单个单元格中返回的MySQL行

时间:2017-05-31 23:53:10

标签: javascript php html ajax

有史以来第一篇文章:

我正在使用HTML,PHP和Javascript构建我的第一个Web应用程序。

我使用Ajax运行PHP脚本来查询数据库。我想基本上在HTML表格中显示数据库的值。目前,从AJAX返回的整行显示在HTML中的单个行中。

PHP:

 $scope.asesor = $stateParams.asesor;

的Javascript / HTML:

header("Content-type: application/json");

//Include database connect script
include 'connect.php';

$query = "SELECT * FROM Table";

$results = mysql_query($query) or die ('Could not query database');

if(mysql_num_rows($results)){

    echo '{"testData":[';

    $first = true;
    $row=mysql_fetch_assoc($results);
    while($row=mysql_fetch_row($results)){
        //Cast Results to JSON Data type

        if($first){
            $first = false;
        }
        else{
            echo ',';
        }
        echo json_encode($row);
    }
    echo ']}';
}
else {
    echo '[]';
}

HTML:

/* AJAX Call to Get Values from PHP that Quiers Database */ $(document).ready(function(){ $.ajax({ async: true, dataType: 'json', url: 'php/get_wgw_errors.php', error: function(jqXHR, textStatus, errorThrown) { alert('An error occurred... Look at the console'); }, success: function(data,status) { createTableByJqueryEach(data); color_table(); } }); }); /* Build App Data Table */ function createTableByJqueryEach(data) { var eTable="<section class='mdl-grid' id='my-error-table'><div class='mdl-layout-spacer'></div><div class='mdl-cell mdl-cell--6-col- tablet mdl-cell--10-col-desktop mdl-cell--stretch'><span class='mdl-layout- title'> {{App}} Test Table Dynamic </span><table class='mdl-data-table mdl-js- data- table mdl-shadow--2dp mdl-data-table--selectable'><div class='mdl-layout- spacer'><thead>" $.each(data,function(index, row){ // eTable += "<tr>"; // eTable += "<td>"+value['name']+"</td>"; // eTable += "</tr>"; eTable += "<tr>"; $.each(row,function(key,value){ eTable += "<th>"+value+"</th>"; }); eTable += "</tr>"; }); eTable +="</tbody></table><div class='mdl-layout-spacer'></div> </section>"; $('#eachTable').html(eTable); }

结果:Result of code

0 个答案:

没有答案