Ru-Board.club
← Вернуться в раздел «Web-программирование»

» Form action, помогите сделать форму

Автор: Botovskiu
Дата сообщения: 09.08.2013 06:03
Здравствуйте, нужно сделать небольшую форму, слева цена, на против выбор размера, выбираешь размер и слева цена меняется.

Подскажите как реализовать, скиньте примеры подобных форм.

Скрин примера прикрепил, а так же хочу сам вводить размеры и ценник на данные размеры.

Автор: Cheery
Дата сообщения: 09.08.2013 06:29

Код: <select onchange='document.getElementById("price").innerHTML = this.value'>
<option value=''> -- выберите цену -- </option>
<option value='$1'>одна цена</option>
<option value='$10'>другая цена</option>
<option value='$100'>третья цена</option>
</select>
<span id='price'></span>
Автор: Botovskiu
Дата сообщения: 09.08.2013 07:07
с выбором ясно, спасибо, а <span id='price'></span> , это там где будет выводиться цена ?

Добавлено:
странно, не выводит цену !
Автор: Cheery
Дата сообщения: 09.08.2013 07:26
Botovskiu

Цитата:
это там где будет выводиться цена

да


Цитата:
странно, не выводит цену !

почему так решили? какой браузер?
Автор: Botovskiu
Дата сообщения: 09.08.2013 07:37
проверял на мозиле и опере, __http://vifein.ru/nashi-tovary/matrasy-s-pruzhinnym-blokom/27-lateks-.html
Автор: Cheery
Дата сообщения: 09.08.2013 07:43
Botovskiu

Цитата:
<select> <option value=""> -- выберите цену -- </option> <option value="$1">одна цена</option> <option value="$10">другая цена</option> <option value="$100">третья цена</option> </select>

сравните с тем, что я написал.. чего не хватает?
можно через jQuery

$('select').change(function(){
$('#price').html($(this).val());
});
Автор: Botovskiu
Дата сообщения: 09.08.2013 08:19
это dle, она зачем то переделала !

надо тогда по другому, а как по другому ?

с этим что делать.
$('select').change(function(){
$('#price').html($(this).val());
});
Автор: Cheery
Дата сообщения: 09.08.2013 08:24
Botovskiu

Цитата:
с этим что делать.

у вас хоть какие то знания js есть?

$(document).ready(function(){
$('select').change(function(){
$('#price').html($(this).val());
});
});

вставить js код.

вместо 'select' лучше сделать уникальный селектор для элемента, иначе обработчик прицепится ко всем селектам на странице.
Автор: Botovskiu
Дата сообщения: 09.08.2013 08:30
в селектах, в формах, в js не шарю.

а как сделать уникальный ?

вы мне сделать можете то что будет работать, я понимаю что все очень просто, 300 руб, вышлю вам на счет.
Автор: Cheery
Дата сообщения: 09.08.2013 08:38
Botovskiu

Цитата:
а как сделать уникальный

добавить уникальный id к нужному селекту и заменить, тогда, $('select') на $('#этот_id')
Автор: Botovskiu
Дата сообщения: 09.08.2013 09:01
Вас поймет тот кто разбирается в этом !


<select id='price'>
<option value=''> -- выберите цену -- </option>
<option value='$1'>одна цена</option>
<option value='$10'>другая цена</option>
<option value='$100'>третья цена</option>
</select>
<span id='price'></span>
$(document).ready(function(){
$('#price').change(function(){
$('#price').html($(this).val());
});
});

вставил в сайт, так нижняя часть, торчит у меня как текст.
как простой текст на сайта.
$(document).ready(function(){
$('#price').change(function(){
$('#price').html($(this).val());
});
});
Автор: Cheery
Дата сообщения: 09.08.2013 09:06
Botovskiu
ну посмотрите же как javascript вставляется в страницу..неужели все по шагам надо объяснять?
к тому же id должен быть уникальным на страние, не повторяться у разных элементов

<select id='select'>
<option value=''> -- выберите цену -- </option>
<option value='$1'>одна цена</option>
<option value='$10'>другая цена</option>
<option value='$100'>третья цена</option>
</select>
<span id='price'></span>
<script>
$(document).ready(function(){
$('#select').change(function(){
$('#price').html($(this).val());
});
});
</script>
Автор: Botovskiu
Дата сообщения: 09.08.2013 09:49
дле блокирует:

сделал по другому, в шаблон новости где будут размер вставил:
<select id='select'>
<option value=''> -- выберите цену -- </option>
<option value='$1'>одна цена</option>
<option value='$10'>другая цена</option>
<option value='$100'>третья цена</option>
</select>
<span id='price'></span>

в сам сайт в самую главную старницу где подключение стилей и т.д идет, вставил:
<script>
$(document).ready(function(){
$('#select').change(function(){
$('#price').html($(this).val());
});
});
</script>

но ценник не показывает при выборе размера.
Автор: Cheery
Дата сообщения: 09.08.2013 09:52
Botovskiu

Цитата:
но ценник не показывает при выборе размера.

а куда он должен выводить, если у вас нет элемента с id='price' ??
Автор: Botovskiu
Дата сообщения: 09.08.2013 10:06
dle, убирает из кода <span id='price'></span>
Автор: Cheery
Дата сообщения: 09.08.2013 10:08
Botovskiu

Цитата:
<span id='price'></span>

потому что пустой, видимо.
добавьте что то между тегами - например &nbsp;
Автор: Botovskiu
Дата сообщения: 09.08.2013 10:08
попробовал так, <strong id="price"></strong>, не работает

Добавлено:
&nbsp;<span id='price'></span>&nbsp;

он вырезал и оставил ) &nbsp; &nbsp;
Автор: Cheery
Дата сообщения: 09.08.2013 10:13
Botovskiu
я уже сказал - &nbsp; между тегами span
Автор: Botovskiu
Дата сообщения: 09.08.2013 10:16
<&nbsp;span&nbsp; id='price'></&nbsp;span&nbsp;>

не работает, дле тупо убрало весь код

Добавлено:
коечего тут вычитал про js

------------------------------------
система защиты все-таки будет противиться нашим поползновениям, в частность обманывать кой-какие зарезервированные слова, скажем код
javascript: elemrnt.onclick=function(){alert('123');}

Она выведет чисто
j&#097;vascript: elemrnt.&#111;nclick=function(){alert('123');}

К счастью система защиты не слишком умна и прокатит вот такой вариант:
eval(‘j’+’a’+’vascript: elemrnt.’+’o’+’nclick=function(){alert('123');}’);
Автор: Cheery
Дата сообщения: 09.08.2013 10:22
Botovskiu

Цитата:
<&nbsp;span&nbsp; id='price'></&nbsp;span&nbsp;>

как же с вами сложно то..здесь даже знания html не нужны - простая логика..
<span id='price'>&nbsp;</span>
Автор: Botovskiu
Дата сообщения: 09.08.2013 10:28
не работает, но так проканало спан не исчез )
при выборе размера, цены нет...

Добавлено:
между прочим я сделал простой html фаил, туда вставил код, и проверил, он не работает, ошибка где то !

Добавлено:

Код: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251" />
<title>Документ без названия</title>
</head>

<body>
<select id='select'>
<option value=''> -- выберите цену -- </option>
<option value='$1'>одна цена</option>
<option value='$10'>другая цена</option>
<option value='$100'>третья цена</option>
</select>
<span id='price'></span>


<script>
$(document).ready(function(){
$('#select').change(function(){
$('#price').html($(this).val());
});
});
</script>
</body>
</html>
Автор: Cheery
Дата сообщения: 09.08.2013 10:35
Botovskiu

Цитата:
он не работает

и не будет работать, потому что jquery не подключили.. это раз - http://jsfiddle.net/PUFra/
второе - в вашей странице уже есть ошибка

Цитата:
Uncaught TypeError: Object [object Object] has no method 'tabs'

которая имеет отношение к коду с табами.
из за нее не выполняется указанный выше js код
Автор: Botovskiu
Дата сообщения: 09.08.2013 10:38
вы про это:


Код: <script type="text/javascript">
$(function() {
if ($.browser.msie && $.browser.version.substr(0,1)<7)
{
            $('li').has('ul').mouseover(function(){
                $(this).children('ul').show();
                }).mouseout(function(){
                $(this).children('ul').hide();
                })
}
});
</script>
<script>
$(function() {
$( "#tabs" ).tabs();
});
</script>
Автор: Cheery
Дата сообщения: 09.08.2013 10:38
Botovskiu

Цитата:
$( "#tabs" ).tabs();

Автор: Botovskiu
Дата сообщения: 09.08.2013 10:39
убрал, все работает, большое спасибо, я собирался убрать, но не думал что это из за этого !
Автор: Botovskiu
Дата сообщения: 12.08.2013 07:51
Возник вопрос:
хотел сделать что бы первый размер и цена выводилась вместе ...выберите размер...

<select id="select" style="width: 170px;">
<option value="9 170 руб">900*2000</option>

<option value="7 840 руб">800*1900</option>
<option value="8 260 руб">800*2000</option>
<option value="8 750 руб">900*1900</option>
<option value="9 170 руб">900*2000</option>
<option value="11 620 руб">1200*1900</option>
<option value="12 250 руб">1200*2000</option>
<option value="13 650 руб">1400*1900</option>
<option value="14 280 руб">1400*2000</option>
<option value="15 470 руб">1600*1900</option>
<option value="16 310 руб">1600*2000</option>
<option value="17 290 руб">1800*1900</option>
<option value="18 270 руб">1800*2000</option>
</select>

сделал так, <option value="9 170 руб">900*2000</option> он оно не показывает стоимость, нужно открывать список и выбирать что то что бы показывало как доработать ?
Автор: Cheery
Дата сообщения: 12.08.2013 18:30
Botovskiu

Цитата:
как доработать ?

указывайте стоимость по умолчанию в элементе с id='price'

либо просто
$('#select').trigger('change');
Автор: Botovskiu
Дата сообщения: 13.08.2013 02:32
Добавить ? правильно ли

<script>
$(document).ready(function(){
$('#select').change(function(){
$('#price').html($(this).val());
$('#select').trigger('change');
});
});
</script>
Автор: Cheery
Дата сообщения: 13.08.2013 03:18
Botovskiu

Цитата:
правильно ли

да хотя бы так..

можно и проще
$(document).ready(function(){
$('#select').change(function(){
$('#price').html($(this).val());
}).trigger('change');
});
Автор: Botovskiu
Дата сообщения: 13.08.2013 04:45
Большое спасибо, да надо изучать js, на сколько сложный язык ? в отличии css и html

Страницы: 12

Предыдущая тема: [PHP] Публикация объявлений на авито.


Форум Ru-Board.club — поднят 15-09-2016 числа. Цель - сохранить наследие старого Ru-Board, истории становления российского интернета. Сделано для людей.