简体   繁体   中英

Pass parameter to Express controller from button click

Preface: I am writing a Web App using Node.js, Express, and MongoDB.

When a button is clicked I am trying to pass a parameter via URL from my index.ejs to the Express controller ItemController.js in order to dynamically create a filtered set of data.

The button is defined within index.ejs as follows:

<button type="button" class="btn btn-primary" value="/items/items" onclick="loadItems(value, 'Scripting Languages')">
      Scripting Languages
</button>

In my external Javascripts file which houses miscellaneous functions, loadItems executes the following:

function loadItems(page, subcategory) {
    window.history.replaceState({}, '', "?subcat=" + subcategory); //set URL Param
    $('#mainContent').load(page); //load item listing page into grid within HTML GridLayout
}

After this, the router/controller handles the data filtering and page rendering:

Router (item.js)

...
// Get all items
router.get('/items', item.items);
...

Controller (ItemController.js)

...
  // loads item listings
  itemController.items = function(req, res) {
    Item.find({}).exec(function (err, items) {
      if (err) {
        console.log("Error:", err);
      }
      else {
        var URLSubcat = "Scripting Languages"; //this variable needs to change
        var filtered = items.filter(function(el) {
          return el.subcategory === URLSubcat;
        });
        res.render("../views/items/items", {items: filtered});
      }
    });
  };
...

I have tried using req.query.subcat in order to try and grab the parameter from the URL, however it comes back as undefined. I have also tried the techniques in the links below to no avail. What should I be doing to accomplish this? Is there a better way to go about this?

Previously Tried

How to get GET (query string) variables in Express.js on Node.js?

How to access the GET parameters after "?" in Express?

 $('#mainContent').load(page); 

The URL you are requesting is stored in the page variable.

 loadItems(page, subcategory) 

… which is defined as an argument

 onclick="loadItems(value, 'Scripting Languages')" 

… which is passed from the onclick event handler

 value="/items/items" 

… which gets it value from that attribute.


The query string doesn't show up because the URL you are requesting does not include a query string!

The only query string you have is from here:

  window.history.replaceState({}, '', "?subcat=" + subcategory); 

… which modifies the URL in the browser addressbar and history without actually requesting it.

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM