如何将数据从ejs文件/ ejs文件的脚本标签发送到nodejs

时间:2019-04-02 15:31:02

标签: javascript node.js server ejs

我正在尝试找到一种使用google map API显示google map位置并同时将搜索到的位置存储在mysql数据库中的方法。但是在这里我无法做到这两者,因为单击时不会将值传递到route中的nodejs文件中,也不会一起显示在地图上的位置。我正在尝试找到一种方法来解决这两个问题。请同时指导我。

我的代码是-

server.js

const ejs = require('ejs')

app.set('views',path.join(__dirname+'/views'));

app.set('view engine', 'ejs');

app.use('/', require('./display.js'));


  app.get('/', (req, res,next) => {
      const loc = req.body.message;
      console.log(loc , "location")
    res.render('location', {
      data: req.body, // { location }

      errors: {
        message: {
          msg: 'A message is required'
        },
        email: {
          msg: 'That email doesn‘t look right'
        }
      }

    })
next();
  })

  app.get('/saveInDatabase',function(req,res){
    // var post  = {from:'me', to:'you', msg:'hi'};
    var post =req.body;
    db.query('INSERT INTO locations values '+ post +";", function(err, result) {
      if (err) throw err
      else{
        console.log("saveInDatabase Result = ", result);
        res.render ('location');            
      }
    });
});



  app.post('/database', function(req,res,next){
      console.log(req.body, "req.solve" )

      connection.query('SELECT * FROM locations', function(err, result) {

        if(err){
            throw err;
        } else {
            obj = {print: result};
            res.render('viewDatabase', obj);                
        }
    });

  })



app.listen(8080,(req,res)=>{
    console.log('server running on port 8080')
})

location.ejs

<html>

<head>
  <title>Geolocation</title>

//code

</head>

<body>


  <!-- <div id="database" (click) = "Check Database"></div> -->

  <form method="post" action="/database" novalidate>
    <div class="form-field">
      <label for="location">Check Values in Database : </label>
      <!-- <input type="text" id="location" name="message" placeholder= "Location" rows="4" autofocus></input> -->
    </div>

    <div class="form-actions">
      <button class="btn" type="submit">Check Database</button>
    </div>
  </form>
  <br>
  <br>
  <form method = "post" action = "/saveInDatabase" novalidate>


  <div id="floating-panel" class = "form-field">
          <input id="address" type="textbox" value="Sydney, NSW">
        </div>
          <div class= "form-actions">
          <button id="submit" type="submit" value="Insert and View Location">Insert and View Location</button>
        </div>

      </form>
  <div id="map"></div>

  <script>


    // NEW CODE 
    function initMap() {
      var map = new google.maps.Map(document.getElementById('map'), {
        zoom: 8,
        center: { lat: -34.397, lng: 150.644 }
      });
      var geocoder = new google.maps.Geocoder();

      document.getElementById('submit').addEventListener('click', function () {
        geocodeAddress(geocoder, map);
      });
    }

    function geocodeAddress(geocoder, resultsMap) {

       var address = document.getElementById('address').value;
      // var address = document.getElementById('events').innerHTML;

      //code
    }

  </script>
</body>

</html>




0 个答案:

没有答案