Цитата:
|
Цитата:
|
Янковиц,
... вариант
<!DOCTYPE html>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
<style type="text/css">
</style>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script>
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"
}]
};
$(function() {
var sel = ['steklo','material'];
$('#buy').on('change', function() {
var form = this;
var data = sel.reduce(function(obj, variation) {
obj[variation] = form[variation].value
return obj
},{})
var findElem = DATA.variable.filter(function(elem) {
return JSON.stringify(elem.item_variation) == JSON.stringify(data)// лучше цикл по sel
})
var id = '', price = '';
if(findElem.length) {
id = findElem[0].item_id;
price = findElem[0].item_price
}
$('[name="price"]').val(price);
$('[name="product-id"]').val(id);
})
});
</script>
</head>
<body>
<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 value="100" name="price">
<input value="12" name="product-id">
<input class="buy__btn_submit" type="submit" value="В корзину" data-click="Оформить">
</div>
</form>
</body>
</html>
|
Ох, не дорос я ещё до этого.
|
Обратите внимание еще раз на то, о чем вы спрашивали - "если более ...". Я и написал код под ваш конкретно набор, которой собственно описать можно проще - есть некие наборы в объекте и элементы управления, при этом их количество равно. Код проверяет - если выбрано два элемента, то производится поиск. Вы пишите, что их возможно будет более, значит встает вопрос - поиск возможен если выбрано меньше элементов чем элементов набора (выбрать все подходящие) или только если выбраны все элементы (искать одно уникальное значение)?
|
Если выбраны все элементы сразу. Если 3 набора, значит должны быть обязательно выбраны все три. И так далее.
|
Поиск одного уникального значения
|
Предложение от рони не подходит?
Цитата:
К примеру, в базе будет храниться набор с типом SET: "один", "два", "три". Битовые значения их будут равны один - 001 два - 010 три - 100 то есть десятичные значения наборов по порядку будут равны: 1, 2, 4, 8, ... Если эти значения будут к примеру у списка со множественным выбором, то сложив значения всех выбранных опций (операция битовое ИЛИ) получим выбор пользователя. К примеру, если будет выбрана первая и последняя опция, значит это будет 101 = 5 десятичному. А при записи/выборке в базе можно оперировать как битовым так и текстовым набором. |
Прошу прощения, что поднимаю вопрос снова. Вариант Рони хорош, но там есть зависимость от последовательности.
То есть, если var sel = ['material','steklo']; Скрипт отказывается работать. Что касается битового набора, я попытался поискать, но ничего не понял. |
Что касается варианта:
$(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);
}
});
});
Не могу понять, почему id меняется, а price и img остаётся прежними. |
| Часовой пояс GMT +3, время: 10:21. |