0

Есть такая форма
alt text
при клике на верхний пункт - выезд курьера за оплатой - под ним должно появлять поле ввода адреса. Поле появляется, но не получается сделать так, чтобы при клике на этот пункт он оказывался выбран - кружок в radio ставится при клике только на самом кружке, хотя всё взято в тег <label>, а если сначала выбрать какой-то другой пункт. а потом попробовать выбрать первый, он не выбирается вообще, куда не кликай. http://jsfiddle.net/jgNHc/3/
И еще вопрос, как в скрипт добавить, чтобы если сначала выбрать первый пункт, а потом выбрать другой, чтобы поле адреса в таком случае свернулось?

2
  • 1
    я использую для подобных форм использую knockout.js, а вот и чистое решение
    – Spectre
    7 янв 2013 в 18:41
  • со slideDown и slideUp получается красивее. какие-то очень странные штуки в этой knockout.js библиотеке))
    – Heidel
    7 янв 2013 в 19:08

1 ответ 1

3

Лучше всего будет навесить на поле с именем courier_payment обработчик события изменения (onchange):

http://jsfiddle.net/jgNHc/6/

$('input[name="courier_payment"]').change(function(){

  if(this.value == 'courier_payment') {
   $(".adress").slideDown('normal'); 
  }
  else {
    $(".adress").slideUp('normal'); 
  }
});

И да, давайте правильную форму. У вас все значения value были одинаковыми.

Теперь давайте проанализируем ваш код:

$(".click").click(function(){
   $(".adress").slideToggle('normal');
   return false;
});

При клике на элемент с классом click функция возвращает false. По этому и не происходит выбор пункта.

3
  • Да, понятно, спасибо. За подсказку на счет value спасибо, как-то пропустилось. В моем коде без return false; поле ввода адреса появлялось и сразу сворачивалось.
    – Heidel
    7 янв 2013 в 19:07
  • @lampa объясните, пожалуйста, как так получается, что при повторном клике на первый пункт, под которым должен разворачиваться блок .adress, блок все равно остается развернутым, а сворачивается только при клике на другие пункты? а то я не совсем понимаю, как работает этот скрипт.
    – Heidel
    8 янв 2013 в 9:10
  • 1
    @Heidel всё просто. Если мы изменяем значение радио-кнопки courier_payment, то происходит событие, в котором происходит проверка значения радио-кнопки. Если оно соответствует courier_payment, то опускаем слайдер, если нет - поднимаем.
    – lampa
    8 янв 2013 в 11:37

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.