Обновление при изменении <input>

Konpolya

Постоялец
Регистрация
23 Окт 2015
Сообщения
91
Реакции
11
Здравствуйте! В корзине интернет магазина у каждого товара есть <input type="number"> в котором отображается желаемое количество приобретаемого товара. Нужно при изменении количества моментально пересчитывать общую стоимость товаров. Сейчас работает только так: мы вписываем нужное число, жмем обновить страницу и он нам пересчитывает цену за нужное количество. А хотелось бы добиться результата без обновления страницы)
<input class="updateitem" type="number" min="0" data="30390" value="12">
 
Здравствуйте! В корзине интернет магазина у каждого товара есть <input type="number"> в котором отображается желаемое количество приобретаемого товара. Нужно при изменении количества моментально пересчитывать общую стоимость товаров. Сейчас работает только так: мы вписываем нужное число, жмем обновить страницу и он нам пересчитывает цену за нужное количество. А хотелось бы добиться результата без обновления страницы)
<input class="updateitem" type="number" min="0" data="30390" value="12">
используйте jQuery('.updateitem').change(function() { //код }) , и аяксом отправляйте измененнные данные в сессию пользователя, если они там нужны.
 
updateCartItem у вас аякс выполняет?
Код:
    function updateCartItem(item){
        $.getJSON(
            '/ajax/updateitem/',
            {product_id: item.attr('data'), count: item.val()},
            function (result) {
                if (result.success === true){
                    switch (result.data) {
                        case 1:
                            item.parent('.undercart').remove();

                    }
                }
            }
        );
    }
 
Я очень плохо понимаю в js, а темболее в аяксе, не могли бы вы по подробнее описать?
 
Я очень плохо понимаю в js, а темболее в аяксе, не могли бы вы по подробнее описать?

Но тогда Вы вряд ли сможете достичь требуемый результат. Лучше обратиться к квалифицированному и опытному специалисту.
 
Но тогда Вы вряд ли сможете достичь требуемый результат. Лучше обратиться к квалифицированному и опытному специалисту.
тут нет таковых?

Я вставил onchange с перезагрузкой страницы, но желателен выход по-лучше, может кто подскажет?)
 
Зачем каждый раз слать ajax?
Лучше писать служебные данные в data: вместе с количеством добавить цену за штуку
Чтобы более конкретно подсказать, надо видеть код этой "корзины".

Для примера, используя выше предложенный change, только на input'ax
Для просмотра ссылки Войди или Зарегистрируйся

Если правильно понял, то вот на вашем коде
Для просмотра ссылки Войди или Зарегистрируйся
Единственное что надо поправить - это data в data-price, потому что у data должно быть какое-то название чтобы к нему обращаться, в данном случае это price.
 
Последнее редактирование:
Зачем каждый раз слать ajax?
Лучше писать служебные данные в data: вместе с количеством добавить цену за штуку
Чтобы более конкретно подсказать, надо видеть код этой "корзины".

Для примера, используя выше предложенный change, только на input'ax
Для просмотра ссылки Войди или Зарегистрируйся

Если правильно понял, то вот на вашем коде
Для просмотра ссылки Войди или Зарегистрируйся
Единственное что надо поправить - это data в data-price, потому что у data должно быть какое-то название чтобы к нему обращаться, в данном случае это price.
А если товаров в корзине несколько и будет несколько цен (.price)?

Более понятный код корзины вот
Код:
<table>
<tr class="undercart">
<td class="cart_count">
      <input class="updateitem" type="number" min="0" data="1781" value="3" data-price="7990">
</td>
<td class="cart_prices">
       <div class="column-price">
                 <div class="price">7990</div>
       </div>
</td>
</tr>
<tr class="undercart">
<td class="cart_count">
      <input class="updateitem" type="number" min="0" data="1789" value="1"data-price="890">
</td>
<td class="cart_prices">
       <div class="column-price">
                 <div class="price">890</div>
       </div>
</td>
</tr>
</table>
<div class="totalprice">ОБЩАЯ ЦЕНА</div>
 
Последнее редактирование:
Назад
Сверху