在 MVC 模型中使用 Express 和 Node 的搜索栏答案

【问题标题】：Search bar using Express and Node in MVC model在 MVC 模型中使用 Express 和 Node 的搜索栏
【发布时间】：2021-12-30 03:38:43
【问题描述】：

我在我的网站的客户页面上创建了一个搜索栏，管理员在搜索栏中输入的任何字符串都将作为获取请求发送，并根据输入我试图在 MySQL db 中查找所有数据其中包含全名字段内的输入字符串。

我的网站构建为 MVC 模型，使用 Express 显示数据和 Node.js

这是我的表格

<form class="d-flex"  method="GET">
     <input class="form-control me-2 py-1" type="text" id="search" name="search" placeholder="Search customer name" aria-label="Search" value="<%= %>" />
     <button class="btn btn-sm btn-secondary" type="submit">Search</button>
</form>

这是 web.js 文件中的路由

router.get('/customer?search',authentication.handleAuthentication, authadmin.authAdmin,adminController.searchCustomer);

adminServices.js 中的getCustomerByName()

let getCustomerByName = (name) => {

return new Promise(async (resolve, reject) => {
  try {
    let user = await db.User.find({ fullname: name });

    if (user) {
      console.log(user);
      resolve(user);
    } else {
      resolve(user);
    }
  } catch (e) {
    reject(e);
  }
});

};

adminController.js 中的searchCustomer()

let searchCustomer = async (req,res,next) =>{
    let name = req.params.search;
    
    let customer = await adminServices.getCustomerByName(name);
    
    return res.render('admin/customer.ejs', {
        customer: customer,
    });
}

我尝试过 req.body.search / req.params.search / req.query 但似乎无法获得输入。网址如下：http://localhost:8080/customer?search=mai。我找不到问题出在哪里，因为控制台中没有显示任何内容。有什么方法可以试试吗？

【问题讨论】：

您的获取路线不正确。你不需要？搜索。 stackoverflow.com/questions/17007997/…
@Erenn 我把它改成了 router.get('/customer',authentication.handleAuthentication, authadmin.authAdmin,adminController.searchCustomer);但它仍然无法正常工作
是否产生了任何请求？您的“/客户”路线是否被触发？
@Erenn 是的，我有另一条路线 get /customer 来获取客户列表。我应该怎么做才能触发 /customer 但使用搜索值
检查我的答案。你需要改变 3 件事。

标签： javascript node.js express model-view-controller

【解决方案1】：

您需要在表单元素中添加action 标签。将路由名称更改为 customer 并在控制器中使用 req.query.search。

router.get('/customer', authentication.handleAuthentication, authadmin.authAdmin, adminController.searchCustomer);



let searchCustomer = async(req, res, next) => {
  let name = req.query.search; // change params to query

  let customer = await adminServices.getCustomerByName(name);

  return res.render('admin/customer.ejs', {
    customer: customer,
  });
}

<form class="d-flex" action="/customer" method="GET">
  <input class="form-control me-2 py-1" type="text" id="search" name="search" placeholder="Search customer name" aria-label="Search" value="<%= %>" />
  <button class="btn btn-sm btn-secondary" type="submit">Search</button>
</form>

【讨论】：