Home > Mobile >  How can I implement increase or decrease quantity till countInStock of my my e-commerce project with
How can I implement increase or decrease quantity till countInStock of my my e-commerce project with

Time:06-23

I have made same thing using form Form.control . Here is the code and screenshot


    {product.countInStock > 0 && (
                    <ListGroupItem>
                      <Row>
                        <Col>Qty</Col>
                        <Form.Control
                          as="select"
                          value={qty}
                          onChange={(e) => setQty(e.target.value)}
                        >
                          {[...Array(product.countInStock).keys()].map((x) => (
                            <option key={x   1} value={x   1}>
                              {x   1}
                            </option>
                          ))}
                        </Form.Control>
                      </Row>
                    </ListGroupItem>
                  )}

but I want the same thing in input tag format like this

CodePudding user response:

                    <input
                      type="number"
                      value={qty}
                      onChange={(e) => setQty(e.target.valueAsNumber)}
                      min="0"
                      max={product.countInStock}
                    />
  • Related