Adding minus button, quantity field and plus button via Javascript to table

HTML & CSS
1

I am working on the shopping cart of a webshop.

The shopping cart consists of a dynamically generated table. For each item in the shopping cart, I would like to add one cell to the table which has (in order left to right):

  • A minus button, to reduce the quantity of the item
  • A display of the quantity of the item
  • A plus button to increase the quantity of the item

How to best do this? All three elements should be generated dynamically through a function, as the webshop will offer many different items

Kind regards and many thanks

2

See this recent post for how to add a row to a table using an HTML template (there are other ways):

https://www.sitepoint.com/community/t/adding-rows-to-table-with-button-to-remove/434396/6

The quantity cells could have this HTML:

<td><button>-</button><input type="text"><button>+</button></td>

1 Like