What is the best way to pass the value of a selected option to an express server

Question

What is the best way to pass the value of a selected option to an express server

<label for="exampleFormControlSelect1">
  <strong>Please Select the Number of PDFs to Merge:</strong>
</label>
<select class="form-control" id="exampleFormControlSelect1">
  <option name="number">1</option>
  <option name="number">2</option>
  <option name="number">3</option>
  <option name="number">4</option>
  <option name="number">5</option>
</select>

app.post("/merge", upload.array("pdfs", 2), async (req, res, next) => {
  console.log(req.files);
  let d = await mergePdfs(
    path.join(__dirname, req.files[0].path),
    path.join(__dirname, req.files[1].path)
  );
});

I have hard-coded the option for merging 2 PDFs but the user can select any number.

javascript express multer

Answer 1

Answer №1

Modify the Multer middleware to allow for unlimited file uploads.
```
upload.array("pdfs")
```
Ensure that your <select> element has a designated name attribute to be included in the request payload.
```
<select
  required
  name="limit"
  class="form-control"
  id="exampleFormControlSelect1"
>
```

Verify the length of req.files against req.body.limit and handle any discrepancies by extracting the file paths and passing them to mergePdfs()

app.post("/merge", upload.array("pdfs"), async (req, res, next) => {
  const { limit } = req.body;
  if (req.files.length !== limit) {
    return res.status(400).send(
      `Expected ${limit} file(s), received ${req.files.length}`
    );
  }

  try {
    const result = await mergePdfs(
      ...req.files.map(({ path: filePath }) => filePath)
    );

    // Handle the merged PDF document here
  } catch (err) {
    next(err);
  }

Answer 2

Modify the Multer middleware to allow for unlimited file uploads.
```
upload.array("pdfs")
```
Ensure that your <select> element has a designated name attribute to be included in the request payload.
```
<select
  required
  name="limit"
  class="form-control"
  id="exampleFormControlSelect1"
>
```

Verify the length of req.files against req.body.limit and handle any discrepancies by extracting the file paths and passing them to mergePdfs()

app.post("/merge", upload.array("pdfs"), async (req, res, next) => {
  const { limit } = req.body;
  if (req.files.length !== limit) {
    return res.status(400).send(
      `Expected ${limit} file(s), received ${req.files.length}`
    );
  }

  try {
    const result = await mergePdfs(
      ...req.files.map(({ path: filePath }) => filePath)
    );

    // Handle the merged PDF document here
  } catch (err) {
    next(err);
  }

What is the best way to pass the value of a selected option to an express server

Answer №1

Similar questions

Unraveling Vue Async Components - Harnessing the power of emitted events to resolve

What is the best way to extract data from a textarea HTML tag and store it in an array before iterating through it?

What is the solution for incorporating multiple elements in knockout's applyBindingsToNode function?

Use Javascript to display or conceal events on a fullcalendar interface

The Angular Material date picker unpredictably updates when a date is manually changed and the tab key is pressed

Vue: Issue with Firebase Authentication REST API triggers 400 Bad Request Error

Utilizing the i18next instance for multiple purposes within an express application

What are the steps to restrict the scope of a <style> declaration in HTML?

Expand the initial expansion panel within an Angular Material accordion by opening the first attachment

Using TypeScript: creating functions without defining an interface

Learn how to retrieve specific user information from a JSON file by implementing a button click feature within a custom directory using Angular.js

Using words instead of symbols to represent logical operators

Authentication Redirect Failure when using Passport to an absolute URL

What is the reason the 'Add' type does not meet the 'number' constraint?

Sharejs has not been loaded on the client's side

Creating raw JavaScript from npm package:How to convert npm modules into plain

Steps for incorporating the getElementByClassName() method

Utilizing the $(this).text method in combination with the content class

Avoiding layout shift when a button is clicked in React JS

Using ajax to send an array to PHP