1

我有以下 ejs 文件，我想捕获 NAME 字段值，以便从数据库中获取相应的详细信息并显示到另一个页面上。我知道如何使用表单标签来做到这一点，但我不确定在这种情况下如何捕获。任何帮助，将不胜感激。谢谢。

search.ejs 文件：

<a href="/menu/<%= tablelist[i].NAME %>">
                <img alt="<%= tablelist[i].NAME %>" class="restaurant-card-cover" src="<%= tablelist[i].IMAGELINK %>" style="height: 115px;">
                    <div class="restaurant-card-content-text">
                        <div id="catererName" class="restaurant-card-name heading-color" variable="<%= tablelist[i].NAME %>"><%= tablelist[i].NAME %></div>
                            <div class="card-description"><%= tablelist[i].DESC2 %></div></a>

在 app.js 文件中，我添加了以下内容：

app.get('/menu/:name', routes.menu(ibmdb,connString));

而且，我还有另一个文件夹“routes”，我在 index.js 文件中提到了我的所有 SQL 查询。这里是：

    exports.menu = function(ibmdb,connString) {
return function(req, res) {

var name = req.param.name;

 ibmdb.open(connString, function(err, conn) {
        if (err ) {
         res.send("error occurred " + err.message);
        }
        else {

            conn.query("SELECT ITEM_NAME, PRICE FROM HOMEBASEDAPP.MENU WHERE CATERER_NAME='"+name+"';", function(err, tables, moreResultSets) {


            if ( !err ) { 
                res.render('menu', {"tablelist" : tables, name: name});

            } else {
               res.send("error occurred " + err.message);
            }

            /*
                Close the connection to the database
                param 1: The callback function to execute on completion of close function.
            */
            conn.close(function(){
                console.log("Connection Closed");
                    });
            });
        }
    } );

}
}

我试图在 menu.ejs 文件中打印“名称”，但它没有得到值。

4

1 回答 1

0

这是在前端完成的。

一种方法是添加一个数据标签，比如在您要捕获点击的同一个 div 上。我会从你那里拿走这个 div，但你可以适应：

<div class="restaurant-card-name heading-color"><%= table[i].NAME %></div>

现在，添加一个数据标签，我们可以将数据放入：

<div class="restaurant-card-name heading-color" data-restaurant="<%= table[i].NAME %>">
    <%= table[i].NAME %>
</div>

现在，您的 div 会将名称呈现为数据属性。

然后你有一些点击处理程序。假设这里有 jQuery，您可以点击此类 div。当 dom 准备好时加载的这个位 javascript 应该这样做：

$('.restaurant-card-name').click(function(evt) {

    evt.preventDefault();
    var name = this.data('restaurant');
    $.ajax({
      url: '/where/you/want/to/fetch/stuff/from',
      method: 'POST',
      // other stuff here, like displaying the data or image in a modal or similar.
    })
 });

或者，如果您只想导航到另一个页面，如您所说，有几个步骤。

第一个是准备 url 而不是 data 属性：

<a href="/my-restaurant-handler-route/<%= table[i].NAME %>">
    <div class="restaurant-card-name heading-color">
        <%= table[i].NAME %>
    </div>
</a>

现在，您的href值将是，例如，/my-restaurant-handler-route/mcdonalds

第二步是在服务器上准备路由。由于您使用的是 ejs 并且已经标记了 Node，因此我假设您使用的是express.

您需要准备一个这样的路由处理程序：

app.get('/my-restaurant-handler-route/:name', function(req, res) {

    // param is on the request, whatever you named it after the `:` in app.get.
    var name = req.param.name;
    // now do the db dance
    database.getData({restaurantName: name}).then(function(data) {

       // you have the data, put it on the response or render it:
       res.render('restaurant-handler.ejs', {data: data});
    });
});

这是一种方法。还有其他一些，但您必须更详细地说明您的情况以获取更多详细信息。

于 2014-11-26T19:51:57.737 回答