Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 17.05.2017, 23:05
Новичок на форуме
Отправить личное сообщение для AVAV84 Посмотреть профиль Найти все сообщения от AVAV84
 
Регистрация: 17.05.2017
Сообщений: 7

Ajax ответ разбить и разместить в нескольких местах сайта.
Привет товарищи! Помоги пожалуйста!

Стоит задача, второй день не могу решить. Посмотрел тонну информации, но ничего рабочего не нашел.

Задача: Сделать корзину на сайте, при нажатие + и - количества = менять цену за каждый товар и общую цену заказа.

Отправку делаю по нажатию на div c + и -:

<div id="price">2990</div>
<div id="price_zakaz">13200</div>
<div id="quantity">1</div>
<div onclick="SendPlus();">+</div>
<div onclick="SendMinus();">-</div>

Дальше сам ajax, где передаю в переменную quantity текущее количество товара, ну и цену товара:

function SendPlus(){
var quantity = document.getElementById("quantity").innerHTML;
var price= document.getElementById("price").innerHTML;
var price_zakaz= document.getElementById("price_zakaz").innerHTML;
$.ajax({
type: "POST",
url: "cartaction.php?quantity-plus",
data: ({quantity : quantity, price: price, price_zakaz: price_zakaz}),
success: function(response){
$('#quantity').html(response);
}
});
};
...
function SendMinus(){
...
в cartaction.php:

if (isset($_GET["quantity-plus"])) {

$summ = $_POST["quantity-plus"]+1;
if ($summ < 1) {$summ = 1;};
echo $summ;
}

В таком виде меняется количество все отлично. Но мне нужно сделать чтоб так же менялась сумма за несколько товаров и конечная стоимость заказа.

Как мне разбить ответ от ajax на несколько полей на сайте? К сожалению в javascript совсем не силен.

Мои предположения как можно сделать:

1.
- Передать строку такого вида echo "$summ,$price,$price_zakaz"; С целью разбить ее потом ","
- В ответе ajax сделать что-то подобное:
...
success: function(data){
data = data.split(',');
$('#quantity').html(data[0]);
$('#price').html(data[1]);
$('#price_zakaz').html(data[1]);
}
Но этот вариант почему-то не работает. Что можно сделать? Как правильно разбить строку и передать по ID div правильно?

Пробовал еще как-то так:
var myString = "coming,apart,at,the,commas";
var substringArray = myString.split(","); // ["coming", "apart", "at", "the", "commas"]

Но тоже не получалось.
Читал много про JSON, но тоже не получилось найти толкового примера как это должно работать в моем случае. Да и вариант выше мне кажется почти правильным.

Помогите, пожалуйста. Уже сил нет.
Ответить с цитированием
  #2 (permalink)  
Старый 17.05.2017, 23:45
Профессор
Отправить личное сообщение для Nexus Посмотреть профиль Найти все сообщения от Nexus
 
Регистрация: 04.12.2012
Сообщений: 3,807

Что возвращает сервер?
Если это все, что сервер возвращает, то о разбиении каких данных идет речь?
if (isset($_GET["quantity-plus"])) {

	$summ = $_POST["quantity-plus"]+1;
	if ($summ < 1) {$summ = 1;};
	echo $summ;
}


С JSON работать не сложно.
К примеру:
callback.php
$response=array();
if(isset($_GET['return_json'])){
	$response=array('result'=>'success','message'=>'All right');//Массив, который будет отдан клиенту
	echo json_encode($response);
	exit;
};


index.js
$(function(){
	//Отправляю запрос на callback.php
	$.post('/callback.php?return_json=1',{},function(res){
		try{
			if(typeof res=='string') res=JSON.parse(res);
			//В этой строке res - тот самый массив, который отдал сервер
			if(res.result=='success')
				alert(res.message);
			else
				throw new Error('Unexpected response');
		} catch(e){
			console.error(e);
		}
	});
});
Ответить с цитированием
  #3 (permalink)  
Старый 18.05.2017, 00:31
Новичок на форуме
Отправить личное сообщение для AVAV84 Посмотреть профиль Найти все сообщения от AVAV84
 
Регистрация: 17.05.2017
Сообщений: 7

Сообщение от Nexus Посмотреть сообщение
Что возвращает сервер?
Если это все, что сервер возвращает, то о разбиении каких данных идет речь?
if (isset($_GET["quantity-plus"])) {

	$summ = $_POST["quantity-plus"]+1;
	if ($summ < 1) {$summ = 1;};
	echo $summ;
}
Возвращает он "количество,цену,цену заказа" (quantity,price,price_zakaz )

$price= $_POST["price"];
$price_zakaz = $_POST["price_zakaz "];
$quantity = $_POST["quantity "];

... // действия с переменными

echo "$quantity,$price,$price_zakaz"; // К примеру так

То есть на сервере сделаю необходимое с переменными и дальше должен передать обратно клиенту 3 значения в переменных, которые потом необходимо вставить в div блоки по id блока. Но как это сделать, пока ума не приложу. Простая задача на плохо знакомом языке ставит в тупик)

Сейчас мне кажется что все же проще разбить строку от сервера на части с помощью split(",") и распихать по div'ам.
Но допустим я сейчас разберусь как передать переменные с JSON клиенту. Как я понимаю JSON это своего рода массив данных.
Можете мне подсказать как будет выглядеть success: в ajax. Как вытащить переменные и распихать по div блокам.

Последний раз редактировалось AVAV84, 18.05.2017 в 00:34.
Ответить с цитированием
  #4 (permalink)  
Старый 18.05.2017, 02:12
Профессор
Отправить личное сообщение для laimas Посмотреть профиль Найти все сообщения от laimas
 
Регистрация: 14.01.2015
Сообщений: 12,989

Сообщение от AVAV84
Дальше сам ajax, где передаю в переменную quantity текущее количество товара, ну и цену товара
А с каких пор цену товара задает клиент?
Ответить с цитированием
  #5 (permalink)  
Старый 18.05.2017, 02:51
Новичок на форуме
Отправить личное сообщение для AVAV84 Посмотреть профиль Найти все сообщения от AVAV84
 
Регистрация: 17.05.2017
Сообщений: 7

Сообщение от laimas Посмотреть сообщение
А с каких пор цену товара задает клиент?
Немного не суть, но при клике покупателя (к примеру на +) меняется количество товара - Соответственно меняются некоторые показатели на странице - "Стоимость только одного товара" по количеству, "Стоимость всего заказа" и тд. Например:

Часы цена 1000р. - 3 + 3000 р.
Плойка цена 300р. - 2 + 600 р.

Общая сумма заказа 3 600 р.

Вот. Получается что покупатель нажимает + и мне нужно подставить новые значения в блоки. Я понимаю, что это возможно покажется немного раком, но хочу именно такое решение. Товары будут разные и было бы круто написать один раз обработку на стороне сервера.
Чтоб можно было управлять скидкой, подстраиваться под разные акции (например каждый второй товар со скидкой и тд.), записывать в базу некоторые значения ну и другие ништяки.
Так что в идеале понять как через ajax загонять любые значения со страницы и принимать их обратно в неограниченном количестве ) За этим к вам и пришел, как у гуру своего дела)
Ответить с цитированием
  #6 (permalink)  
Старый 18.05.2017, 02:56
Профессор
Отправить личное сообщение для laimas Посмотреть профиль Найти все сообщения от laimas
 
Регистрация: 14.01.2015
Сообщений: 12,989

Сообщение от AVAV84
Немного не суть
Ну нифига себе не суть. А можете ответить такие вопросы:

1) если корзину хранит сервер, что следует из кода, то каким образом сервер может догадаться каким именно товаром нужно оперировать, если передается количество, нечто plus, и цена?

2) если цену товара определяет клиент, можете ли вы по аналогии с этим совершить покупку в реальном магазине, сообщив на кассе о покупке коллекционного коньяка, определив самостоятельно цену его в 3 рубля?
Ответить с цитированием
  #7 (permalink)  
Старый 18.05.2017, 03:30
Новичок на форуме
Отправить личное сообщение для AVAV84 Посмотреть профиль Найти все сообщения от AVAV84
 
Регистрация: 17.05.2017
Сообщений: 7

Сообщение от laimas Посмотреть сообщение
Ну нифига себе не суть. А можете ответить такие вопросы:

1) если корзину хранит сервер, что следует из кода, то каким образом сервер может догадаться каким именно товаром нужно оперировать, если передается количество, нечто plus, и цена?

2) если цену товара определяет клиент, можете ли вы по аналогии с этим совершить покупку в реальном магазине, сообщив на кассе о покупке коллекционного коньяка, определив самостоятельно цену его в 3 рубля?
Каким именно товаром оперировать, какая у него цена, скидка и тд сервер узнает по id товара, которое тоже передается на сервер по нажатию кнопки. Это уже все отлично работает. Количество переключается по +/-. На сервере все уже считается как надо.
Застопорился только как вывести остальные переменные и повставлять их в разные части сайта. Вы в этом может помочь? )
Ответить с цитированием
  #8 (permalink)  
Старый 18.05.2017, 03:40
Профессор
Отправить личное сообщение для laimas Посмотреть профиль Найти все сообщения от laimas
 
Регистрация: 14.01.2015
Сообщений: 12,989

Сообщение от AVAV84
Каким именно товаром оперировать, какая у него цена, скидка и тд сервер узнает по id товара, которое тоже передается на сервер
Вот именно - id товара и его количество, это единственно что необходимо передавать серверу, цена же это полный абсурд. Но тогда почему вы в коде это передаете?

Но у вас копки определяют режим операции - добавление/удаление, то есть по одному. Следовательно серверу передается не количество товара, а знак определяющий операцию. Исходя из этого на клиенте не должно быть две функции SendPlus() и SendMinus(), должен быть единый обработчик для этих кнопок, который отправляет серверу идентификатор товара и либо 1, либо -1. Это все что требуется.

Возвращать же сервер должен JSON, если расширенная корзина, это выгоднее для клиента. Если же возврат, это общее количество товара и общая цена, можно и строковое значение.
Ответить с цитированием
  #9 (permalink)  
Старый 18.05.2017, 04:30
Профессор
Отправить личное сообщение для laimas Посмотреть профиль Найти все сообщения от laimas
 
Регистрация: 14.01.2015
Сообщений: 12,989

AVAV84, если на сервере единый обработчик состояния корзины (краткого и расширенного представления), то выгоднее всегда возвращать JSON.

Пусть сервер хранит корзину таким образом:

$basket = [
    10 => ['quantity' => 2, 'price' => 200],
    20 => ['quantity' => 5, 'price' => 150],
    30 => ['quantity' => 3, 'price' => 300]
];

if(array_key_exists($_POST['id'], $basket)) {
    $basket[$_POST['id']]['quantity'] += (int)$_POST['mode'];
    exit(json_encode(['quantity' => array_sum(array_column($basket, 'quantity')), 
                      'total' => array_sum(array_map('array_product', $basket))]
        )
    ); 
}


На клиенте элементы с идентификаторами quantity и total отображают количество товара в корзине и их сумму соответственно.

Все кнопки добавления/уменьшения товара имеют имя класса mode, режим операции в атрибутах data-mode: 1 и -1 соответственно, и единый обработчик. Тогда:

$('div.mode').click(function() {
    $.ajax({
        ....,
        dataType: 'json',
        data: {id: получить в чем-то хранящийся id товара, mode: $(this).data('mode')},
        success: function(response) {
             $.each(response, function(k, v) {
                  $('#'+k).text(v)
             })
        }
    })   
})


То есть, таким образом клиент может одним обработчиком управлять отображением как краткого так и полного представления корзины.

PS. Пример РНР для версии не ниже 5.5.
Ответить с цитированием
  #10 (permalink)  
Старый 18.05.2017, 11:29
Новичок на форуме
Отправить личное сообщение для AVAV84 Посмотреть профиль Найти все сообщения от AVAV84
 
Регистрация: 17.05.2017
Сообщений: 7

Сообщение от laimas Посмотреть сообщение
Вот именно - id товара и его количество, это единственно что необходимо передавать серверу, цена же это полный абсурд. Но тогда почему вы в коде это передаете?
Справедливое замечание! Учту, сегодня постараюсь переделать.

С success до конца не понял, ну попробую сегодня что-то сделать. Отпишусь о результатах.

Низейший поклон, друзья.
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
ajax ссылки для сайта l-liava-l Оффтопик 19 23.02.2013 17:20
Добавление сайта на ajax в закладки NeoMurderer AJAX и COMET 9 30.08.2011 19:25
AJAX и контент с др. сайта DarkScorpion AJAX и COMET 7 22.05.2009 12:41
seo индексация ajax сайта apache Общие вопросы Javascript 7 19.05.2009 16:22
Интеграция сайта с форумом phpbb3 на AJAX sim Работа 0 09.02.2009 06:21