Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 14.05.2019, 14:57
Профессор
Отправить личное сообщение для Янковиц Посмотреть профиль Найти все сообщения от Янковиц
 
Регистрация: 17.11.2014
Сообщений: 319

Поиск по json
Добрый день. У меня есть 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>


И есть форма:
<form id="buy" action="" method="post">
	<div class="variations">
		<input type="radio" id="material-1" value="металл" name="material">
		<label class="variations__item" for="material-1">металл</label>
		
		<input type="radio" id="material-2" value="пластик" name="material">
		<label class="variations__item" for="material-2">пластик</label>
		
		<input type="radio" id="material-3" value="дерево" name="material">
		<label class="variations__item" for="material-3">дерево</label>
		<div class="error">Пожалуйста, выберите "Материал"</div>
	</div>

	<div class="variations">
		<input type="radio" id="steklo-1" value="ударопрочное" name="steklo">
		<label class="variations__item" for="steklo-1">ударопрочное</label>
		
		<input type="radio" id="steklo-2" value="обычное" name="steklo">
		<label class="variations__item" for="steklo-2">обычное</label>
	</div>	

	<div class="buy__btn">
		<input type="hidden" value="100" name="price">
		<input type="hidden" value="12" name="product-id">
		<input class="buy__btn_submit" type="submit" value="В корзину" data-click="Оформить">
	</div>
</form>

Подскажите как реализовать. Пользователь кликает по inputы, в зависимости от комбинации инпутов получить item_id, item_image, item_price. Буду благодарен за любую помощь.

Важный момент: заранее неизвестно количество блоков радиокнопок.
Ответить с цитированием
  #2 (permalink)  
Старый 14.05.2019, 15:42
Профессор
Отправить личное сообщение для Янковиц Посмотреть профиль Найти все сообщения от Янковиц
 
Регистрация: 17.11.2014
Сообщений: 319

Я написал пока следующее:
jQuery('#buy input[type="radio"]').click(function() {
		var data = {};
		$('#buy').find ('input, select').each(function() {
			data[this.name] = $(this).val();
		});
		// здесь бы надо проверку
		$.each(DATA.variable,function(i,variation) {
			console.log(variation.item_variation);
		});
	});

console.log(data) выводит:
{material: "дерево", steklo: "обычное"}
Ответить с цитированием
  #3 (permalink)  
Старый 14.05.2019, 16:15
Профессор
Отправить личное сообщение для laimas Посмотреть профиль Найти все сообщения от laimas
 
Регистрация: 14.01.2015
Сообщений: 10,535

$(function() {
    var btn = $('#buy :radio').change(function() {
        var a = this, b = btn.not(this).filter(':checked')[0], f = {}
        if(b) {
            $.each(DATA.variable, function() {
                if(this.item_variation[a.name]==a.value && this.item_variation[b.name]==b.value)
                f.id = this.item_id;
                f.img = this.item_image;
                f.price = this.item_price;
            });
            console.log(f);
        }
    });
});
Ответить с цитированием
  #4 (permalink)  
Старый 14.05.2019, 16:19
Профессор
Отправить личное сообщение для Янковиц Посмотреть профиль Найти все сообщения от Янковиц
 
Регистрация: 17.11.2014
Сообщений: 319

Здорово. Вы меня уже не первый раз выручаете. А возможно ли одновременно событие на выбор select?
Ответить с цитированием
  #5 (permalink)  
Старый 14.05.2019, 16:21
Профессор
Отправить личное сообщение для Янковиц Посмотреть профиль Найти все сообщения от Янковиц
 
Регистрация: 17.11.2014
Сообщений: 319

Не совсем понимаю код. Сработает ли он, если в наборе будет 1 блок радиокнопок или скажем 3 или 4?
Ответить с цитированием
  #6 (permalink)  
Старый 14.05.2019, 16:24
Профессор
Отправить личное сообщение для laimas Посмотреть профиль Найти все сообщения от laimas
 
Регистрация: 14.01.2015
Сообщений: 10,535

Сообщение от Янковиц
Здорово
Здорово будет только при условии, что каждый набор, это уникальное значение, в противном случае получите данные последнего набора. Это я к тому, что как понимать "заранее неизвестно количество блоков радиокнопок"?

Сообщение от Янковиц
возможно ли одновременно событие на выбор select?
Каком select и что значит одновременно?
Ответить с цитированием
  #7 (permalink)  
Старый 14.05.2019, 16:26
Профессор
Отправить личное сообщение для laimas Посмотреть профиль Найти все сообщения от laimas
 
Регистрация: 14.01.2015
Сообщений: 10,535

Сообщение от Янковиц
Сработает ли он, если в наборе будет 1 блок радиокнопок или скажем 3 или 4?
Дело не в количестве, а в связях кнопок с объектом и их значениями.
Ответить с цитированием
  #8 (permalink)  
Старый 14.05.2019, 16:28
Профессор
Отправить личное сообщение для Янковиц Посмотреть профиль Найти все сообщения от Янковиц
 
Регистрация: 17.11.2014
Сообщений: 319

Сообщение от laimas Посмотреть сообщение
Здорово будет только при условии, что каждый набор, это уникальное значение, в противном случае получите данные последнего набора. Это я к тому, что как понимать "заранее неизвестно количество блоков радиокнопок"?



Каком select и что значит одновременно?
Да, у меня все наборы радиокнопок c уникальным name.
Что касается select. Вопрос в том, будет ли скрипт работать, если нужно проверить 1-2 блока радиокнопок, а 3-ий блок опция - select?
Ответить с цитированием
  #9 (permalink)  
Старый 14.05.2019, 16:34
Профессор
Отправить личное сообщение для laimas Посмотреть профиль Найти все сообщения от laimas
 
Регистрация: 14.01.2015
Сообщений: 10,535

Сообщение от Янковиц
Не совсем понимаю код.
var btn = $('#buy :radio').change(function() { //коллекция всех кнопок и обработчик их изменения
        var a = this, //текущая кнопка
        b = btn.not(this).filter(':checked')[0], //вторая кнопка из набора или если их больше, 
//то будет коллекция в этом случае нужно обходить эту коллекцию в цикле, сравнивая имя и значения каждой соответственно с объектом  
        f = {}
        if(b) { //есть ли выбор кроме одной кнопки? тогда ...


То есть, если будет и уйма наборов кнопок, то не беда, весь этот набор (параметры его элементов имя/значения) в цикле сравнивать с набором в объекте. Но у вас то в объекте их два, значит и объект будут содержать более?
Ответить с цитированием
  #10 (permalink)  
Старый 14.05.2019, 16:35
Профессор
Отправить личное сообщение для Янковиц Посмотреть профиль Найти все сообщения от Янковиц
 
Регистрация: 17.11.2014
Сообщений: 319

В перспективе будет от 0 до 10-15 наборов радиокнопок и селектов вперемешку.
Ответить с цитированием
Ответ



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

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


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Ошибка при чтении json полученного через ajax ishurgaya Общие вопросы Javascript 7 10.12.2018 08:20
Не могу распарсить JSON. gorenie jQuery 3 29.11.2013 20:26
поиск подструктуры в массиве json данных amt779 Общие вопросы Javascript 4 07.06.2013 17:53
JSON или JSONP для запросов на другой сервер? Метод GET, для длинных сообщений? Kotakota jQuery 5 23.08.2011 22:12
jQuery. Обработка ошибок и JSON. mma_mma jQuery 3 19.07.2010 11:10