Business
Jobs
  • About Us
  • Solutions
    • Job Postings
      Post your job and receive qualified candidates in 48h.
    • Candidate Assessments
      500+ technical and psychological tests, plus anti-fraud.
    • Headhunting
      Tailor-made executive search from start to finish.
    • Payroll + EOR
      Payroll dispersal and EOR across 15+ LATAM countries.
  • Pricing
  • Jobs

0

288
Views
Update an attribute value on change

i have this:

<p>Qté : ${quantity}</p> <input type="number" class="itemQuantity" name="itemQuantity" min="1" max="100" value="${quantity}">being added dynamically in html for each product of a cart.

I want that input to update inside "p"tag and inside the cart when there a change inside this input. But lets say for now that i want to update inside "p"tag and value when i change the number with arrow or type it. value="${quantity}" --> that code is saying take the quantity for this product (in cart/localstorage) and set it to default.

i want the changed value to be the new default, if you know what i mean. And i also need this to work for all the products, for now it only works with the first item fo the cart.

for now i'm stuck with

const quantityBox = document.querySelector(".itemQuantity");   
      quantityBox.addEventListener("change", function () {
    //update value function   });
about 4 years ago · Juan Pablo Isaza
1 answers
Answer question

0

If I understood your problem correctly, I think what you want is:

  1. There are many products and each product has 'p' for display quantity and 'input' for change quantity.
  2. When 'input' tag value is changed, matching 'p' tag text should be changed, too.

I think you can use Element.previousElementSibling like this:

const quantityBox = document.querySelector(".itemQuantity");   
quantityBox.addEventListener("change", function (e) {
    const prevP = e.target.previousElementSibling;
    prevP.innerText = "Qté : " + e.target.value;
});
about 4 years ago · Juan Pablo Isaza Report
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post vacancy Pricing Sales
Legal
Terms and conditions Privacy policy
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Show me some job opportunities
There's an error!