Javascript-форум (https://javascript.ru/forum/)
-   Events/DOM/Window (https://javascript.ru/forum/events/)
-   -   При добавлении элемента стираются значения в инпуте (https://javascript.ru/forum/events/68642-pri-dobavlenii-ehlementa-stirayutsya-znacheniya-v-inpute.html)

Crenom 28.04.2017 17:32

Допустим я хочу прикинуть стоимость своей корзины в процессе того как я в нём набираю товары, потому что у меня ограниченное кол-во денег.

Но мне надо просто сделать чтобы сохранялись значения в инсертах после нажатия на "добавить шаблон товара"

laimas 28.04.2017 17:45

Какой шаблон?

Вы в настоящем магазине были, действие покупателя в котором описывали, или это вам родители рассказывали? :)

Товары в магазине вы где выбираете: а) на прилавке; б) вас допускают на склад?

У нормальных магазинов это а), а вот то о чем вы речь ведете, это уже не нормально, из области фантастики - б).

В интернет магазине товары также сразу на прилавке (странице), а вот склад, это база товаров на сервере.

В реальном магазине вы кладете товар в тележку и просчитывается стоимость их в уме. В интернет магазине это корзина, в которую помещается идентификатор товара и его количество которое вводится в поле формы. Стоимость набранного сразу же просчитывается и выводится в кратком представлении - всего товаров и их общая сумма.

Если же надо перед покупкой что-то изменить в корзине, вот тогда выводится полная информация о ней, где можно изменить количество товаров, удалить товар, вообще очистить корзину.

Сама корзина может быть на сервере (сессия или в базе) или на клиенте (куки или локальное хранилище).

Покупка набранного товара в интернет магазине, это оправка формы серверу, либо как есть, либо асинхронным запросом.

Сервер получает не "инсерты", а данные формы - идентификаторы товаров и их количество, другую информацию о выбранных товарах сервер знает и без клиента.

А теперь поясните что вы делаете.

Crenom 28.04.2017 17:49

Я про реальный магазин.
>В реальном магазине вы кладете товар в тележку и просчитывается стоимость их в уме.
Я делаю калькулятор, который поможет мне не считать стоимость в уме.

laimas 28.04.2017 17:49

У вас не магазин, а не понять что, все в куче поля ввода которые добавляют, не понять какие товары откуда-то берутся по кнопке, шаблоны.... в общем все в куче, а что к чему не понять.

laimas 28.04.2017 17:51

Цитата:

Сообщение от Crenom
Я делаю калькулятор, который поможет мне не считать стоимость в уме.

Так нахрена для просчета набранного нужно совать поля ввода формы во что-то? Для расчета набранного нужно отслеживать изменения полей формы, в которых пользователь указывает количество товара. По этому событию автоматически и производится расчет.

Crenom 28.04.2017 17:55

Подскажите, пожалуйста, на примере как это сделать? И как сделать чтобы у меня всё не обнулилось, если я нажму на кнопку "добавить шаблон товара".

Я добавил на тот бесплатный хостинг кнопку рассчитать. Я могу добавить событие онблюр, которое будет рассчитывать, но всё равно если я нажму на кнопку "добавить шаблон товара" всё обнулится. Меня интересует именно как сделать чтобы не обнулялись инпуты
Я подозреваю, что вот так делать нельзя "productListObj.innerHTML = productListObj.innerHTML + NewProduct;", но как правильно я не знаю

laimas 28.04.2017 18:10

Я не знаю чем вам помочь, потому как не понимаю, что такое "добавить шаблон товара" в рамках интернет магазина. Это что-то за гранью понимания.

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script> 
$(function() {
    $('form').on('input', function() {
        var c = t = 0;
        $.each(this.elements, function() {
            if($.trim(this.value)) {
                c += +this.value;
                t += this.value * $(this).data('price')
            }
        });
        $('#count').text(c);
        $('#total').text(t); 
    })
});
</script> 
</head>
<body>
<form>
<div>
<h5>Корзина</h5>
<p>Товаров: <span id="count">0</span> шт.</p>
<p>Сумма: <span id="total">0</span> руб.</p>
</div>
<div><h4>Бублики</h4>
<p>Цена 50 руб.</p>
<input name="product[12]" data-price="50" />
</div>
<div><h4>Коржики</h4>
<p>Цена 100 руб.</p>
<input name="product[45]" data-price="100" />
</div>
</form>
</body>
</html>


Вот так в упрощенном представлении торгуют магазины.

Crenom 28.04.2017 18:16

Пожалуйста абстрагируйтесь от интернет магазина. Нету никакого интернет магазина. Есть пятёрочка. Я туда пришел с телефоном. На нём открыт сайт, который калькулятор. Я знаю что куплю 2 товара там точно "бублики и коржики". Но я не знаю что захочу купить ещё. В вашем примере я жёстко завязан на бубликах и коржиках. Но я вдруг захотел ещё и сушки, например.

Кнопка "шаблон товара" это я так для понимания назвал. Просто она добавляет пустой шаблон, который надо заполнить.

За ваше терпение вам спасибо ОГРОМНОЕ!

laimas 28.04.2017 18:30

То есть вы хотите сказать, что я как покупатель должен знать весь перечь товаров и их цену у Пятерочки, чтобы купить что-то?

Dilettante_Pro 28.04.2017 18:47

Crenom,
Чтобы добавленные элементы HTML корректно работали, их нужно правильно создавать
Добавление и удаление узлов


Часовой пояс GMT +3, время: 21:14.