Fatal编程技术网
  • mysql/
  • Mysql nodejshtml选择列表

Mysql nodejshtml选择列表

mysql node.js

Mysql nodejshtml选择列表,mysql,node.js,Mysql,Node.js,我不熟悉nodejs和mysql。我在使用MySQL中存储的数据生成列表时遇到问题。其他一切都很好，我希望从MYSQL测试表中生成国家的选择下拉列表。就我所知，在未来，我希望添加更多的选择列表，以及从MYSQL生成的更多数据。我不确定要编写什么代码来生成从中读取数据的循环，甚至不确定这是如何进行的。任何帮助都将不胜感激！多谢各位 routes.js module.exports = function(app, passport) { app.get('/', function(req, re

我不熟悉nodejs和mysql。我在使用MySQL中存储的数据生成列表时遇到问题。其他一切都很好，我希望从MYSQL测试表中生成国家的选择下拉列表。就我所知，在未来，我希望添加更多的选择列表，以及从MYSQL生成的更多数据。我不确定要编写什么代码来生成从中读取数据的循环，甚至不确定这是如何进行的。任何帮助都将不胜感激！多谢各位

routes.js

module.exports = function(app, passport) {
 app.get('/', function(req, res){
  res.render('index.ejs');
 });

 app.get('/login', function(req, res){
  res.render('login.ejs', {message:req.flash('loginMessage')});
 });

 app.post('/login', passport.authenticate('local-login', {
  successRedirect: '/profile',
  failureRedirect: '/login',
  failureFlash: true
 }),
  function(req, res){
   if(req.body.remember){
    req.session.cookie.maxAge = 1000 * 60 * 3;
   }else{
    req.session.cookie.expires = false;
   }
   res.redirect('/');
  });

 app.get('/signup', function(req, res){
  res.render('signup.ejs', {message: req.flash('signupMessage')});
 });

 app.post('/signup', passport.authenticate('local-signup', {
  successRedirect: '/profile',
  failureRedirect: '/signup',
  failureFlash: true
 }));

 app.get('/profile', isLoggedIn, function(req, res){
  res.render('profile.ejs', {
   user:req.user
  });
 });

 app.get('/logout', function(req,res){
  req.logout();
  res.redirect('/');
 })

 //-SQL QUERY
 var express = require('express')
  , http = require('http')
  , mysql = require('mysql'); // <---- HERE

 var app = express();

 var connection = mysql.createConnection({
    host: 'localhost',
    user: 'root',
    password: "password",
    database: 'test'
 });

 connection.connect(); // <---- AND HERE

 // all environments
 app.set('port', process.env.PORT || 7002);


 app.get('/getJson',function(req,res){
 connection.query('SELECT * FROM Country', function(err, rows, fields){
    if(err) {
        console.log(err); 
        res.json({"error":true});
    }
    else { 
        console.log(result); 
        res.json(result); 
    }
        console.log('Connection result error '+err);
            res.writeHead(200, { 'Content-Type': 'application/json'});
        res.end(JSON.stringify(rows));

    });

 } );

 http.createServer(app).listen(app.get('port'), function(){
  console.log('Express server listening on port ' + app.get('port'));
 });
 };

 //-SQL QUERY END



function isLoggedIn(req, res, next){
 if(req.isAuthenticated())
  return next();

 res.redirect('/');
}
passport.js

var LocalStrategy = require("passport-local").Strategy;

var mysql = require('mysql');
var bcrypt = require('bcrypt-nodejs');
var dbconfig = require('./database');
var connection = mysql.createConnection(dbconfig.connection);

connection.query('USE ' + dbconfig.database);

module.exports = function(passport) {
 passport.serializeUser(function(user, done){
  done(null, user.id);
 });

 passport.deserializeUser(function(id, done){
  connection.query("SELECT * FROM users WHERE id = ? ", [id],
   function(err, rows){
    done(err, rows[0]);
   });
 });

 passport.use(
  'local-signup',
  new LocalStrategy({
   usernameField : 'username',
   passwordField: 'password',
   passReqToCallback: true
  },
  function(req, username, password, done){
    var fruit= req.body.fruit;
    var PhoneNumber= req.body.PhoneNumber;
    var Country= req.body.Country;
    var newUserMysql = {
          username: username,
          password: password,
          fruit: fruit,
          PhoneNumber: PhoneNumber,
          Country: Country,
         };

         var insertQuery = "INSERT INTO users (username, password, fruit, PhoneNumber, Country) values (?, ?, ?, ?, ?)";

         connection.query(insertQuery, [newUserMysql.username,newUserMysql.password, newUserMysql.closureplan,newUserMysql.UIR,newUserMysql.CSJ],
          function(err, rows){
           newUserMysql.id = rows.insertId;

           return done(null, newUserMysql);
          });

  })
 );

 passport.use(
  'local-login',
  new LocalStrategy({
   usernameField : 'username',
   passwordField: 'password',
   passReqToCallback: true
  },
  function(req, username, password, done){
   connection.query("SELECT * FROM users WHERE username = ? ", [username],
   function(err, rows){
    if(err)
     return done(err);
    if(!rows.length){
     return done(null, false, req.flash('loginMessage', 'No User Found'));
    }
    if(!bcrypt.compareSync(password, rows[0].password))
     return done(null, false, req.flash('loginMessage', 'Wrong Password'));

    return done(null, rows[0]);
   });
  })
 );
};
signup.js

<!DOCTYPE html>
<html lang="en">
<head>
 <meta charset="UTF-8">
 <meta name="viewport" content="width=device-width, initial-scale=1.0">
 <meta http-equiv="X-UA-Compatible" content="ie=edge">
 <title>Login Register</title>
 <link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.0.2/css/bootstrap.min.css">
 <link rel="stylesheet" 
 href="//netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.min.css">
 <style>
  html{
   padding:50px;
  }
 </style>
</head>
<body>
 <div class="container">
  <div class="col-sm-6 col-sm-offset-3">
   <h2>Register</h2>

   <% if(message.length > 0) { %>
    <div class="alert alert-danger"><%= message %></div> 
   <% } %>

   <form action="/signup" method="post">
    <div class="form-group">
     <label>Username</label>
     <input type="text" class="form-control" name="username">
    </div>

    <div class="form-group">
     <label>Password</label>
     <input type="text" class="form-control" name="password">
    </div>

    <div class="form-group">
        <label>Select Fruit:</label>
            <select name="fruit" type="form" class="form-control">
              <option value="Apple">Apple</option>
              <option value="Orange">Orange</option>
              <option value="Banana">Banana</option>
            </select><br />


    </div>

    <div class="form-group">
        <label>Phone Number#</label>
        <input name="PhoneNumber" type="textbox" class="form-control" >
    </div>

    <div class="form-group">
        <label>Country</label>
        <select name="Country" type="form" class="custom-select">

       </select><br>
    </div>





    <button type="submit" class="btn btn-succcess btn-lg">Register</button>
   </form>

   <hr>

   <p>Need an account <a href="/signup">Register</a></p>
   <p>Go Back <a href="/">Home</a>.</p>
  </div>
 </div>
</body>
</html>
在前端代码中，您得到/getJSON，它返回一个JSON对象。然后，您需要将元素作为s附加到标记中

取回https://jsonplaceholder.typicode.com/todos' .thenresponse=>response.json .thenjson=>{ console.logjson； 让select=document.getElementByIdtest； json.forEache=>{ var opt1=document.createElementoption； opt1.text=e.title； opt1.value=e.id； 选择.addopt1； }; }
通常，人们在/public/scripts/文件夹中提供javascript，然后在html中使用/type的deal进行测试。您也可以将它放在标记中的ejs/html中。当我尝试转到I get[ERR_HTTP_HEADERS_SENT]：发送到客户端后无法设置头。对吗？是让select=document.getElementByIdtest；那是表名吗？和opt1.text=e.title；opt1.value=e.id；列是否存在？发送到客户端后无法设置标题这可能是/getJson路由中的错误删除行控制台。记录“连接结果错误”+错误；res.writeHead200，{'Content-Type'：'application/json'}；res.endJSON.stringifyrows；从您的/getJson 
<!DOCTYPE html>
<html lang="en">
<head>
 <meta charset="UTF-8">
 <meta name="viewport" content="width=device-width, initial-scale=1.0">
 <meta http-equiv="X-UA-Compatible" content="ie=edge">
 <title>Login Register</title>
 <link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.0.2/css/bootstrap.min.css">
 <link rel="stylesheet" 
 href="//netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.min.css">
 <style>
  html{
   padding:50px;
  }
 </style>
</head>
<body>
 <div class="container">
  <div class="col-sm-6 col-sm-offset-3">
   <h2>Register</h2>

   <% if(message.length > 0) { %>
    <div class="alert alert-danger"><%= message %></div> 
   <% } %>

   <form action="/signup" method="post">
    <div class="form-group">
     <label>Username</label>
     <input type="text" class="form-control" name="username">
    </div>

    <div class="form-group">
     <label>Password</label>
     <input type="text" class="form-control" name="password">
    </div>

    <div class="form-group">
        <label>Select Fruit:</label>
            <select name="fruit" type="form" class="form-control">
              <option value="Apple">Apple</option>
              <option value="Orange">Orange</option>
              <option value="Banana">Banana</option>
            </select><br />


    </div>

    <div class="form-group">
        <label>Phone Number#</label>
        <input name="PhoneNumber" type="textbox" class="form-control" >
    </div>

    <div class="form-group">
        <label>Country</label>
        <select name="Country" type="form" class="custom-select">

       </select><br>
    </div>





    <button type="submit" class="btn btn-succcess btn-lg">Register</button>
   </form>

   <hr>

   <p>Need an account <a href="/signup">Register</a></p>
   <p>Go Back <a href="/">Home</a>.</p>
  </div>
 </div>
</body>
</html>

module.exports = {
 'connection':{
  'host':'localhost',
  'user':'root',
  'password':'password'
 },
 'database':'signup',
 'user_table':'information',

}