Как сделать заполнение формы при нажатии на кнопку?

Question

[Caspergreen]

Как сделать заполнение формы при нажатии на кнопку? Имеется 3 кнопки, в которых 3 разных значения, эти значения надо передать в скрытую форму.

Answer 1

[ZeXeDeR]

Без JS вряд ли получится. Нужно присвоить каждой кнопке id, затем повешать событие (при нажатии, берется значение и вставляется в форму).

Comments

[Caspergreen]

Можно и на js, есть ли примеры? :)

[ZeXeDeR]

код с формой и кнопками в студию)

[Caspergreen]

<form method="post">
<div class="choose-term">
<button type="button" name="val" value="1"><input type="hidden" name="val" value="1">1 месяц</input></button>
<div class="price">8 000</div>
</div>
<div class="choose-term selected">
<button type="button" name="val" value="2"><input type="hidden" name="val" value="2">2 месяца</input></button>
<div class="price">16 000</div>
</div>
<div class="choose-term">
<button type="button" value="3" value="2"><input type="hidden" name="val" value="3">3 месяца</input></button>
<div class="price">24 000</div>
</div>
</form>

[ZeXeDeR]

во-первых, насколько могу судить, с точки зрения валидности нельзя оборачивать input в button. во-вторых, в третьей кнопке два value и в-третьих, откуда и куда передавать надо?

[Caspergreen]

надо по нажатию на каждую кнопку, передать цифру в поле, т.е 3 кнопки, 3 цифры передается в инпут)))

[ZeXeDeR]

что-то не хочет работать, утром подумаю, если не успеют решить, щас уже спать рубит)
Если на jQuery, то будет выглядеть примерно так:

$('#button').onclick(function(){
$('#input').val($('#button').val());
});
где #button - id первой кнопки, а #input - id 1 первого инпута

Answer 2

[Ольга]

Тут куча вариантов решения,в зависимости от ситуации.
Я не совсем поняла,каждая кнопка должна заполнить несколько полей?
Если так,можно завести 3 невидимых инпута или один, но потом его парсить(занчения можно записать через пробел,_ или что-нить другое) функцией на php( split() )
что бы передать множественные значения в инпут можно воспользоваться атрибутом data:

<form id="myForm">
<div class="button" data-some_data_1="x1" data-some_data_2="y1" data-some_data_2="z1">кнопка1</div>
<div class="button" data-some_data_1="x2" data-some_data_2="y2" data-some_data_2="z2">кнопка2</div>
<div class="button" data-some_data_1="x3" data-some_data_2="y3" data-some_data_2="z3">кнопка3</div>
<input name="input" id="input"/>
<input type="sumit"/>
</form>

и к ним мы будем обращаться так:

$('.button').click(function(){
var input=$('#input');
var data1=$(this).data('some_data_1');
var data2=$(this).data('some_data_2');
var data3=$(this).data('some_data_3');
input.attr('value',data1+'_'+data2+'_'+data3);
$('#myForm').submit()
})
Еще проще каждую кнопку представить в качестве <a href="http://habrahabr.ru/post/144104/">кастомизированного радиобаттона</a>