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

Search bar using Express and Node in MVC model

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

我的网站构建为 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);

getCustomerByName() 里面 adminServices.js

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);
  }
});

};

searchCustomer() 里面 adminController.js

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 但似乎无法获得输入。 URL 像这样:http://localhost:8080/customer?search=mai。我找不到问题出在哪里,因为控制台中没有显示任何内容。有什么方法可以试试吗?

您需要为表单元素添加 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>