Добрый день. У меня есть массив с вариациями товаров:
Array
(
[0] => {"item_id":19,"item_image":"","item_variation":{"steklo":"ударопрочное","material":"металл"},"item_price":"110"}
[1] => {"item_id":20,"item_image":"","item_variation":{"steklo":"обычное","material":"металл"},"item_price":"130"}
[2] => {"item_id":21,"item_image":"","item_variation":{"steklo":"ударопрочное","material":"пластик"},"item_price":"150"}
[3] => {"item_id":22,"item_image":"","item_variation":{"steklo":"ударопрочное","material":"дерево"},"item_price":"160"}
[4] => {"item_id":23,"item_image":"","item_variation":{"steklo":"обычное","material":"пластик"},"item_price":"175"}
[5] => {"item_id":24,"item_image":"","item_variation":{"steklo":"обычное","material":"дерево"},"item_price":"199"}
)
Я вывожу два блока вариантов:
по стеклу: обычное, ударопрочное
по материалу: дерево, пластик, металл
В данном случае получаем 6 вариантов.
(в перспективе, блоков вариантов, а значит вариаций товаров может быть гораздо больше)
Подайте идею, как на фронте реализовать следующее:
Покупатель сначала выбирает стекло, затем материал. В зависимости от того, какая комбинация выбрана, получаем item_id, item_image, item_price.
Я предполагаю, что данные можно выводить инлайновыми скриптами. Однако, не совсем понимаю в каком виде хранить данные. Если выводить через json, то выглядит не очень компактно:
<script type='text/javascript'>
/* <![CDATA[ */
var DATA = {"variable":["{\"item_id\":19,\"item_image\":\"\",\"item_variation\":{\"steklo\":\"\u0443\u0434\u0430\u0440\u043e\u043f\u0440\u043e\u0447\u043d\u043e\u0435\",\"material\":\"\u043c\u0435\u0442\u0430\u043b\u043b\"},\"item_price\":\"110\"}","{\"item_id\":20,\"item_image\":\"\",\"item_variation\":{\"steklo\":\"\u043e\u0431\u044b\u0447\u043d\u043e\u0435\",\"material\":\"\u043c\u0435\u0442\u0430\u043b\u043b\"},\"item_price\":\"130\"}","{\"item_id\":21,\"item_image\":\"\",\"item_variation\":{\"steklo\":\"\u0443\u0434\u0430\u0440\u043e\u043f\u0440\u043e\u0447\u043d\u043e\u0435\",\"material\":\"\u043f\u043b\u0430\u0441\u0442\u0438\u043a\"},\"item_price\":\"150\"}","{\"item_id\":22,\"item_image\":\"\",\"item_variation\":{\"steklo\":\"\u0443\u0434\u0430\u0440\u043e\u043f\u0440\u043e\u0447\u043d\u043e\u0435\",\"material\":\"\u0434\u0435\u0440\u0435\u0432\u043e\"},\"item_price\":\"160\"}","{\"item_id\":23,\"item_image\":\"\",\"item_variation\":{\"steklo\":\"\u043e\u0431\u044b\u0447\u043d\u043e\u0435\",\"material\":\"\u043f\u043b\u0430\u0441\u0442\u0438\u043a\"},\"item_price\":\"175\"}","{\"item_id\":24,\"item_image\":\"\",\"item_variation\":{\"steklo\":\"\u043e\u0431\u044b\u0447\u043d\u043e\u0435\",\"material\":\"\u0434\u0435\u0440\u0435\u0432\u043e\"},\"item_price\":\"199\"}"]};
/* ]]> */
</script>
Мне посоветовали использовать Set. Но я не совсем понимаю как это работает.