How to onchange list items update calculation total?

from the cart image , i would like to ask some advice,

  1. for each list view’s item what is the best way that i can make a
    call to update the total of the item by multiply the selling price
    with the quantity ordered when user click on the stepper and
    update the line total on the fly ,is it using onchange ?

    my plan is to do the following,
    1.1. to define each list item with id ,
    1.2. to define a function which will be called during onchange of the stepper,
    1.3. in the function, will accept the id of the list item , then it will
    use the element id to find out the qty which is the value of the stepper
    and the selling price of the list item and then multiply them and
    update the DOM value of the list view item line total.
    1.4. update the shopping cart total
    1.5. save to F7 form data
    thanks ahead, stay safe,

Hi, i solved my own by searching and found one useful and can apply into my use case easily, share here and hope it can be useful for some others.


did you used sf7 tore?