Question

我的迷你项目是使用bootstrap在数据表上的mysql表数据视图。此代码在节点服务器上执行。服务器使用ajax获取数据。

处理HTML的数据表。但是使用mysql的javascript无法正常工作可以帮助我！

index.html

<!DOCTYPE html>
<html>
<head>
<title>Ajax-Json-Node Project</title>
<meta charset="UTF-8">
<link href="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css" rel="stylesheet">   
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<link rel="stylesheet" href="http://cdn.datatables.net/1.10.2/css/jquery.dataTables.min.css">
<script type="text/javascript" src="http://cdn.datatables.net/1.10.2/js/jquery.dataTables.min.js"></script>
<script type="text/javascript"  src="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>
<script>
    $(document).ready(function(){
        $('#myTable').dataTable();
    });
</script>

<div id="out1"></div>   
    <script>
    var xmlhttp = new XMLHttpRequest();
    xmlhttp.onreadystatechange = function() {
        if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
            var showme = xmlhttp.responseText;
            convert(showme);
        };
    };

    xmlhttp.open("GET", "http://127.0.0.1:8081/mysql", true);
    xmlhttp.send();

    function convert(show){
        var result = JSON.parse(show);
        var text_2 = "<table id='myTable'  >";
        text_2 +=   "<tr>" + 
                        "<th>product</th>" + 
                        "<th>Description</th>" + 
                        "</tr>";
        var j;
        for(j = 0; j < result.length; j++)
    {   text_2 += '<tr>' +
    '<td>' + result[j].productLine + '</td>'
     +  '<td>' + result[j].textDescription +
      '</td>' +  '</tr>';
        }
        text_2 += "</table>";
        document.getElementById("out1").innerHTML = text_2; 
    }   
    </script>
    </body>
  </html>

服务器代码 \

 var util = require('util'),
  fs = require('fs'),
  http = require('http'),
  url = require('url'),
  mysql = require('mysql');

http.createServer(function (req, res) {
 var url_parts = url.parse(req.url);
 switch(url_parts.pathname) {
    case '/':
    display_root(url_parts.pathname, req, res);
    break;
    case '/mysql':
    display_mysql(url_parts.pathname, req, res);
    break;
    default:
    display_404(url_parts.pathname, req, res);
}
return;

function display_root(url, req, res) {
    res.writeHead(200, {'Content-Type': 'text/html'});
    fs.readFile('index.html', function (err, data) {
        if (err) return console.error(err); 
        res.end(data);
    });
}

function display_mysql(url, req, res) {
    getmysql(function (results){
        res.writeHead(200, {'Content-Type': 'application/json'});
        console.log("Fine");
        res.end(results);   
    });
}
function display_404(url, req, res) {
    res.writeHead(404, {'Content-Type': 'text/html'});
    res.write("<h1>404 Not Found</h1>");
    res.end("The page you were looking for: "+url+" can not be found");
 }
  }).listen(8081);
  console.log('Server running at http://127.0.0.1:8081/');
  function getmysql(callbackfn) {
  var query="select * from classicmodels.productlines";
  console.log("SQL Query: " + query);
  var connection = mysql.createConnection({
   host     : 'localhost',
   user     : 'root',
   password : '',
   database : 'classicmodels',
   multipleStatements: true
    });
connection.query(query, null, function(err, rows, fields) {
    if(err){
        console.log(err);
    }
    var resultjson = JSON.stringify(rows);
    callbackfn(resultjson);
});
connection.end();
}

数据表不能在javascript中工作但是适用于HTML

0 个答案: