Javascript.RU

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

Как получить данные из селекта
Доброго времени суток всем! Делаю сайт на подобии этого(не реклама) и столкнулся с тем, что надо вывести стоимость, изображение товара, который мы выбрали в селекте. Если значение в селекте "Выбрать", то стоимость и изображение не показывается.
У меня селектов 6-8 штук(ну как на сайте практически) и код, который ниже уж очееень большой как для 1 селекта. Я скрываю изначально поля, а потом при выборе товара - показываю..
Ранее был такой код js(огромный, не правда ли?)
http://jsfiddle.net/f2Lsxh73/3/
А код php сейчас такой

<table>
<thead style='background: #F1F2F7'>
<tr>
<th>Тип</th>
<th>Наименование</th>
<th>Цена, грн.</th>
</tr>
</thead>			
<tr>
<td>Процессор</td>
<td> 
<?php												
echo "<div class='newselect'>";
echo "<select class='chosen' id='chosenmak' name='maker' onchange='updatePrice(this)'>"; 
echo '<option value="0">-- Выбрать --</option>';
foreach ($arr_get as $value) {
	$ID                  = $value['ID'];
	$Price         	 	 = $value['Price'];											
	$Model         		 = $value['Model'];	
	$photo 				 = $value['photo'];
echo '<option data-price="'.$Price.'" data-image="'.$photo.'" value="'.$Model.'">'."$Model".'</option>';									
}
echo "</select>";				          
echo "</div>";
echo "<span id='model'><img src='$photo' class='t' id='preview'/></span>";
echo "<td><input class='label' id='price_cpu' name='price_cpu' readonly/></td>";				
?>
</td>
</tr>


Другие селекты также сделаны, но только немного другие значения вывожу. http://prntscr.com/791bzt вот так.
JS код изменил на такое для одного селекта.
Изначально всё скрыто и задача опять остается: картинка/стоимость(должны соответствовать товару) скрыты все и должны выводится тогда, когда выбран товар в селекте. Если не выбрано, то скрывать опять.
sel = document.getElementById("myTab").getElementsByClassName("t")
	for(var i=0; i<sel.length; i++) sel[i].style.display = "none";	
 	selLabel = document.getElementById("myTab").getElementsByClassName("label")
	for(var i=0; i<selLabel.length; i++) selLabel[i].style.display = "none";	
 
	function updatePrice(select){
				var image=select.options[select.selectedIndex].getAttribute("data-image");	
                var price=select.options[select.selectedIndex].getAttribute("data-price");
                  document.getElementById('price_cpu').innerHTML = price;
 
          }


Подскажите/помогите:
Как вывести стоимость и картинку товара, который выбран в селекте? Я говорил, что их 6-8
Если ничего не выбрано в селекте, то скрывать/не показывать стоимость и картинку
Я совсем новичок и не знаю как сделать.
Ответить с цитированием
  #2 (permalink)  
Старый 25.05.2015, 08:22
Аватар для ksa
ksa ksa на форуме
CacheVar
Отправить личное сообщение для ksa Посмотреть профиль Найти все сообщения от ksa
 
Регистрация: 19.08.2010
Сообщений: 14,123

Сообщение от makalet
Я совсем новичок и не знаю как сделать.
Для начала нужно сделать простеньких хтмл-пример, на котором можно будет что-то делать...
Ответить с цитированием
  #3 (permalink)  
Старый 25.05.2015, 08:42
Аспирант
Отправить личное сообщение для makalet Посмотреть профиль Найти все сообщения от makalet
 
Регистрация: 25.05.2015
Сообщений: 76

ksa, я могу скинуть вам файлик, вы посмотрите.
Даже с простеньким примером не получается.
Ответить с цитированием
  #4 (permalink)  
Старый 25.05.2015, 08:49
Аватар для ksa
ksa ksa на форуме
CacheVar
Отправить личное сообщение для ksa Посмотреть профиль Найти все сообщения от ksa
 
Регистрация: 19.08.2010
Сообщений: 14,123

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

Сообщение от makalet
Даже с простеньким примером не получается.
Ты его еще даже не сделал...
Ответить с цитированием
  #5 (permalink)  
Старый 25.05.2015, 09:03
Аспирант
Отправить личное сообщение для makalet Посмотреть профиль Найти все сообщения от makalet
 
Регистрация: 25.05.2015
Сообщений: 76

Сообщение от ksa Посмотреть сообщение
Можешь сразу и деньги перечислить на карточку...

Ты его еще даже не сделал...
http://jsfiddle.net/qb4yjkgx/1/

На чистом хтмле вот ссылка выше.
У меня пхп и немного отличается
Ответить с цитированием
  #6 (permalink)  
Старый 25.05.2015, 09:15
Аватар для ksa
ksa ksa на форуме
CacheVar
Отправить личное сообщение для ksa Посмотреть профиль Найти все сообщения от ksa
 
Регистрация: 19.08.2010
Сообщений: 14,123

И что тут нужно сделать?

<!DOCTYPE html>
<html>
<head>
<meta http-equiv='Content-Type' content='text/html; charset=windows-1251' />
<!--
<script src='http://code.jquery.com/jquery-latest.js'></script>
<script src="https://code.angularjs.org/1.3.9/angular.min.js"></script>
<script src="https://code.angularjs.org/1.3.9/angular-route.js"></script>
<link rel='stylesheet type=text/css href=tmp.css' />
<link rel="stylesheet/less" type="text/css" href="style.less">
<script src="http://cdnjs.cloudflare.com/ajax/libs/less.js/2.5.0/less.min.js"></script>
-->
<style type='text/css'>
</style>
<script type='text/javascript'>
</script>
</head>
<body>
<table id='myTab'>
	<tr>
        <th>Тип</th>
		<th>Наименование</th>
		<th>Изображение</th>
		<th>Цена, грн.</th>
    </tr>
	<tr>
	<td>Processors</td>
	<td>
		<select class='t'>
			<option>Выбрать</option>
			<option value='Processors-1'> ЕУІІ 1</option>
			<option value='Processors-2'> ЕУІЕ 2</option>
			<option value='Processors-2'> ЕУІЕ 3</option>		
		</select>
	</td>
	<td><img src='http://javascript.ru/forum/image.php?u=8616&dateline=1282216923'></td>
	<td>22</td>
	</tr>
	<tr>
	<td>Graphics</td>
	<td>
		<select class='t'>
			<option>Выбрать</option>
			<option value='Graphics-1'> Graphics GeForce GTX 970 </option>
			<option value='Graphics-2'> Graphics GeForce GT 720 </option>
			<option value='Graphics-3'> Graphics 333 </option>
		</select>
	</td>
	<td><img src='http://javascript.ru/forum/image.php?u=8616&dateline=1282216923'></td>
	<td>33</td>
</tr>
</table>
</body>
</html>
Ответить с цитированием
  #7 (permalink)  
Старый 25.05.2015, 09:22
Аспирант
Отправить личное сообщение для makalet Посмотреть профиль Найти все сообщения от makalet
 
Регистрация: 25.05.2015
Сообщений: 76

Сообщение от ksa Посмотреть сообщение
И что тут нужно сделать?
Когда ничего не выбрано, то все элементы скрыты(цена и рисунок). Когда выбирается значение в селекте, то выводится рисунок и цена товара
Ответить с цитированием
  #8 (permalink)  
Старый 25.05.2015, 09:25
Аватар для ksa
ksa ksa на форуме
CacheVar
Отправить личное сообщение для ksa Посмотреть профиль Найти все сообщения от ksa
 
Регистрация: 19.08.2010
Сообщений: 14,123

Но, как я понимаю, рисунки и цены должны быть разные. Где это все брать?
Ответить с цитированием
  #9 (permalink)  
Старый 25.05.2015, 09:28
Аспирант
Отправить личное сообщение для makalet Посмотреть профиль Найти все сообщения от makalet
 
Регистрация: 25.05.2015
Сообщений: 76

Сообщение от ksa Посмотреть сообщение
Но, как я понимаю, рисунки и цены должны быть разные. Где это все брать?
Да, должны быть разные. Я не знаю как в чистом хтмле назначить для каждого значения в селекте свою цену и картинку. ПО этому я хотел скинуть файлы(бд, пхп), чтобы вы посмотрели и помогли
Ответить с цитированием
  #10 (permalink)  
Старый 25.05.2015, 09:55
Аватар для ksa
ksa ksa на форуме
CacheVar
Отправить личное сообщение для ksa Посмотреть профиль Найти все сообщения от ksa
 
Регистрация: 19.08.2010
Сообщений: 14,123

Сообщение от makalet
Я не знаю как в чистом хтмле назначить для каждого значения в селекте свою цену и картинку.
В параметры можно записать...
Ответить с цитированием
Ответ



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

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


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
функция отправки изображений как отправить и данные из селекта imedia Элементы интерфейса 1 25.08.2014 13:03
Как получить в JQUERY каждую строку как отдельный объект? Alex1233 Общие вопросы Javascript 3 22.08.2014 06:54
Как получить значение переменной из игры на HTML5? Dimaz Общие вопросы Javascript 6 10.08.2014 16:27
Как получить значения вышестоящих элементов дерева TreeStore ? Allan Stark ExtJS 1 31.07.2012 16:48
получить данные из store, как ? maslks ExtJS 5 14.10.2009 16:45