如何在不重新加載頁面的情況下將值從 controller 發送到 ejs：Nodejs

Question

當我在 ejs 中輸入最高值時，我想將 controller 的值發送到 ejs 文件而不重新加載頁面。 這是 ejs 文件中的代碼。

<html>
    <p class="topicCard3">History Of PM2.5 Values In <%= country %></p>
        <form method="POST" action="/historyPM2.5">
            <input class="inputCountry" name='country' placeholder="enter country name">
            <button class="submitButton">SUBMIT</button>
        </form>
    <p>
<html>

這是 controller.js 中的代碼

exports.historyPm = function(req,res) {
    country = req.body.country
    res.render('home',{
        'country': country
    })
}

我需要在 controller 中處理一些東西，然后將結果發送到 ejs 進行顯示。 現在，我將從 ejs 輸入的值發送到 controller ，然后單擊峰會按鈕，頁面將重新加載。 感謝您的幫助。

Answer 1

您只需要在單擊提交按鈕時防止表單重新加載頁面。 我們可以通過多種技術實現這一點，下面是 jQuery

例子：

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js">
    $('form').submit(function(e){
        e.preventDefault(); // prevents page reloading
       // api request
       return false;
    });
</script>

Answer 2

  <script>
    $(document)
    .on('click', 'form button[type=submit]', function(e) {

        //write your ajax code here

        e.preventDefault(); //stop submitting the form to avoid reload
    });
  <script>

如何在不重新加載頁面的情況下將值從 controller 發送到 ejs：Nodejs

問題描述

2 個解決方案

解決方案1
1 2020-05-20 15:06:57

解決方案2
0 2020-05-20 14:59:09

如何在不重新加載頁面的情況下將值從 controller 發送到 ejs：Nodejs

問題描述

2 個解決方案

解決方案1 1 2020-05-20 15:06:57

解決方案2 0 2020-05-20 14:59:09

解決方案1
1 2020-05-20 15:06:57

解決方案2
0 2020-05-20 14:59:09