ejsテンプレートからサーバー側ノードにドロップダウンメニューで選択された値を取得する方法

私がしたいのは、ドロップダウンメニューからfeb2017のような何か月を選択させてから、ここで私は選択をデータベースの検索に使用します。month_year = feb2017、month_yearはデータベーステーブルの列です。ejsテンプレートからサーバー側ノードにドロップダウンメニューで選択された値を取得する方法

しかし、今のところ私はちょうどサーバー側に選択されたオプションを取得したいです。私はノードjs、エクスプレスだけでなくボディパーサーを使用しています。

だから、どうすればいいですか？

は、ここに私のEJSが

<!DOCTYPE HTML> 
<html> 
<head> 
    <title>Add/Edit DA</title> 

    <link rel="stylesheet" href="style.css"> 
</head> 
<body> 
    <% var rows %> 
    <% var rowsLength = rows.length %> 


<div> 
    <form id="tableForm" action="/salary-sheet" method="post"> 
    <select class="selectpicker" data-style="btn-info" name="selectpicker"> 
     <optgroup label="Select Table"> 
      <option name="" value="0">Select Month Year</option> 
      <% for(var i=0;i<rowsLength;i++){ %> 
      <% if(i>0){ %> 
      <% if(rows[i].month_year !== rows[i-1].month_year){ %> 
      <option name="table<%=i %>" value="month1"><%= rows[i].month_year %></option> 
      <% } %> 

      <% }else{ %> 
      <option name="table<%=i %>" value="month2"> <%= rows[i].month_year %></option> 
      <% } %> 
      <% } %> 
     </optgroup> 
    </select> 
    <input type="submit" /> 
</form> 
    Go back to home page - <a href="/">click here</a> 
</div> 


</body> 


</html>

ファイルだし、ここに関連するサーバ側です。

app.get('/select-month',function(req,res){ 
    connection.query('SELECT month_year FROM attendance_details',function(err,rows){ 
     if(err){ 
      throw err; 
     }else{ 

      var rowsLength = rows.length; 
      console.log('rows is ',rows); 

      res.render('select-month.ejs',{rows:rows}); 
     } 
    }); 


}); 

app.post('/salary-sheet',function(req,res){ 
    var month = req.body.table8; 
    console.log('month is ',month); 
    res.send(month); 
});

あなたはrows（CMIIW）、私は変更することができことをお勧めしたいに明確なmonth_year値を持つようにしたいと仮定すると、サーバ側にEJSから

出典

2017-03-02 faraz

最初に選択したオプションを取得する方法を知っているのが大好きですビューの複雑さを軽減するために、SQLクエリ：

SELECT DISTINCT month_year FROM attendance_details ORDER BY month_year ASC

次に、あなたのフォームを生成するためにこれを使用することができます。

<form id="tableForm" action="/salary-sheet" method="post"> 
    <select class="selectpicker" data-style="btn-info" name="selectpicker"> 
     <optgroup label="Select Table"> 
      <option value="">Select Month Year</option> 
      <% rows.forEach(function(row){ %> 
      <option value="<%= row %>"><%= row %></option> 
      <% }) %> 
     </optgroup> 
    </select> 
    <input type="submit" value="Submit" /> 
</form>

と、サーバ側での処理、それを：

var express = require('express'), 
    bodyParser = require('body-parser'), 
    app = express() 

app.set('view engine', 'ejs') 
app.use(bodyParser.urlencoded({ 
    extended: true 
})) 

app.post('/salary-sheet',function(req,res){ 
    var month = req.body.selectpicker 
    console.log('month is', month) 
    res.send(month) 
}) 

app.listen(5000)

出典

2017-03-02 08:38:34

感謝。それは多くの助けとなりました。ところで、SQLクエリについて。私はDISTINCTの部分が好きです。だから、私がmonth_yearと名前を取得したい場合はと言ってください。 SELECT DISTINCT month_year、name FROM attendance_details – faraz

@farazはい、複数の列を使用することができます。 month_yearとnameの一意のペアを返します –

ejsテンプレートからサーバー側ノードにドロップダウンメニューで選択された値を取得する方法

答えて

関連する問題