Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 22.04.2014, 08:53
Новичок на форуме
Отправить личное сообщение для decd Посмотреть профиль Найти все сообщения от decd
 
Регистрация: 22.04.2014
Сообщений: 5

Если выбран radiobutton "Другое" - появление нового текстового поля
Здравствуйте, надеюсь на Вашу помощь, ибо сильно поджимают сроки.
Вопрос завязан на незнании возможностей javascript. Уверен, задача тривиальная. Пытаюсь использовать готовые решения.
У меня есть:
<?php echo $form->radioButtonList($model,'company_type_of_ownership',array(
        "Private company"=>"Private company",
        "Other"=>"Other (please, specify)"),array('separator' => "",'onchange'=>'return ownership(this.value)')); ?>

И:
<div id="check_1" style="display:none">                 
        <div class="row">  
            <?php echo $form->labelEx($model,'company_type_of_ownership_other'); ?>             
            <?php echo $form->textField($model,'company_type_of_ownership_other',array('size'=>50,'maxlength'=>50)); ?>
            <div class="app_tip"></div>
            <?php echo $form->error($model,'company_type_of_ownership_other'); ?>                
        </div>    
    </div>

И наконец:
function ownership(obj){    
            if(obj=="Other"){
            document.getElementById('check_1').style.display="block";
                            return false;
            }else{
            document.getElementById('check_1').style.display="none"; 
            return false;
            }
     }
function legalForm(obj){    
            if(obj=="Other"){
            document.getElementById('check_2').style.display="block";
                            return false;
            }else{
            document.getElementById('check_2').style.display="none"; 
            return false;
            }
     }
function learnFrom(obj){    
            if(obj=="Other"){
            document.getElementById('check_4').style.display="block";
                            return false;
            }else{
            document.getElementById('check_4').style.display="none"; 
            return false;
            }
     }

(Несколько одинаковых скриптов, потому что имеется несколько таких полей для разных вопросов).
Все работает отлично, при выборе "Other", появляется скрытый hidden див и пользователь может ввести свое значение.
Проблема возникает тогда, когда пользователь выбирает "Other", но забывает указать свой вариант при отправке формы. Срабатывают мои правила валидации и он возвращается на ту же страницу. НО. Радио кнопка "Other" все так же выбрана, однако скрытое поле прячется, я так понимаю из-за ONCHANGE.

Для того чтобы оно появилось и он мог ввести значение, необходимо выбрать какой-нибудь другой вариант (В данном случае 'Private company') и затем снова выбрать 'Other". Тогда поле, разумеется, вновь появится. Но такой подход не очевиден и мало кто догадается совершить такие манипуляции. Как исправить? Наверное, должно быть что-то вроде: 'onchange'||'ifchosen' (только на языке js, разумеется).

Буду рад услышать Ваши предложения, спасибо!
Ответить с цитированием
  #2 (permalink)  
Старый 22.04.2014, 10:18
Профессор
Отправить личное сообщение для jsnb Посмотреть профиль Найти все сообщения от jsnb
 
Регистрация: 15.03.2014
Сообщений: 561

Я так понимаю у вас форма отправляется в любом случае, на сервере проверяются данные и если забыли указать, то возвращается та же страница? Если так, то при загрузке странице проверяйте какой радиобаттон выбран и показывайте то что надо. Или уточните проблему. И приводите уже сгенерированный HTML, а не эту PHP солянку с кучей непонятных переменных.
Ответить с цитированием
  #3 (permalink)  
Старый 22.04.2014, 10:33
Новичок на форуме
Отправить личное сообщение для decd Посмотреть профиль Найти все сообщения от decd
 
Регистрация: 22.04.2014
Сообщений: 5

Сообщение от jsnb Посмотреть сообщение
Я так понимаю у вас форма отправляется в любом случае, на сервере проверяются данные и если забыли указать, то возвращается та же страница? Если так, то при загрузке странице проверяйте какой радиобаттон выбран и показывайте то что надо. Или уточните проблему. И приводите уже сгенерированный HTML, а не эту PHP солянку с кучей непонятных переменных.
Здравствуйте, благодарю за отзыв!

Совершенно верно, на сервере у меня:
if ($this->company_type_of_ownership=='Other' && !$this->company_type_of_ownership_other) {
            $this->addError('typeofwnership', 'Please, specify the type of ownership');
        }

и если забыли указать свое значение, то возвращается эта же страница с ошибкой и просьбой это значение ввести. Проверить радиобаттон (при чем так, чтобы и предыдущий скрипт срабатывал) - это именно то что мне нужно, но не нашел готовых примеров в сети (а у самого написать не получается, синтаксис js/jquery знаю плохо). Если есть возможность, прошу помочь с готовым решением.

Еще раз спасибо

P.S. Если Вам это поможет:
<div class="row">
        <label for="Application_company_type_of_ownership" class="required">2.1 Company type of ownership <span class="required">*</span></label>        <div class="radiogroup">
        <input id="ytApplication_company_type_of_ownership" type="hidden" value="" name="Application[company_type_of_ownership]" /><span id="Application_company_type_of_ownership"><input onchange="return ownership(this.value)" id="Application_company_type_of_ownership_0" value="Private company" checked="checked" type="radio" name="Application[company_type_of_ownership]" /> <label for="Application_company_type_of_ownership_0">Private company</label><input onchange="return ownership(this.value)" id="Application_company_type_of_ownership_1" value="Other" type="radio" name="Application[company_type_of_ownership]" /> <label for="Application_company_type_of_ownership_1">Other (please, specify)</label></span>        </div>
        <div class="app_tip">(Please, specify your company type of ownership)</div>
        <div class="errorMessage" id="Application_company_type_of_ownership_em_" style="display:none"></div>    </div>
    
    <div id="check_1" style="display:none">                 
        <div class="row">  
            <label for="Application_company_type_of_ownership_other">Specify the company type of ownership (if "Other" was chosen in 2.1)</label>             
            <input size="50" maxlength="50" name="Application[company_type_of_ownership_other]" id="Application_company_type_of_ownership_other" type="text" value="my type of ownership" />            <div class="app_tip"></div>
            <div class="errorMessage" id="Application_company_type_of_ownership_other_em_" style="display:none"></div>                
        </div>    
    </div>
Ответить с цитированием
  #4 (permalink)  
Старый 22.04.2014, 10:58
Профессор
Отправить личное сообщение для jsnb Посмотреть профиль Найти все сообщения от jsnb
 
Регистрация: 15.03.2014
Сообщений: 561

Вставьте на страницу после формы такой блок скрипта:
<script type="text/javascript">
ownership(document.getElementById('Application_company_type_of_ownership_1').value);
</script>

Но это очень костыльное решение. По хорошему там надо это дело переписывать. И вообще первичную валидацию на стороне клиента делать чтобы зря данные туда сюда не гонять.

Последний раз редактировалось jsnb, 22.04.2014 в 11:01.
Ответить с цитированием
  #5 (permalink)  
Старый 22.04.2014, 11:04
Новичок на форуме
Отправить личное сообщение для decd Посмотреть профиль Найти все сообщения от decd
 
Регистрация: 22.04.2014
Сообщений: 5

СПАСИБО! Решение работает, за исключением одного - текстовое поле не скрыто по умолчанию. Оно прячется только если мы выбираем (в данном случае) "Private company" и в последующем ведет себя корректно (прячется/появляется при кликах на соответствующие кнопки). Есть ли возможность сделать что бы оно было спрятано при первой загрузке формы?
Ответить с цитированием
  #6 (permalink)  
Старый 22.04.2014, 12:11
Профессор
Отправить личное сообщение для jsnb Посмотреть профиль Найти все сообщения от jsnb
 
Регистрация: 15.03.2014
Сообщений: 561

Сообщение от decd Посмотреть сообщение
СПАСИБО! Решение работает, за исключением одного - текстовое поле не скрыто по умолчанию. Оно прячется только если мы выбираем (в данном случае) "Private company" и в последующем ведет себя корректно (прячется/появляется при кликах на соответствующие кнопки). Есть ли возможность сделать что бы оно было спрятано при первой загрузке формы?
Вместо того вставьте такой блок:
<script type="text/javascript">
(function() {
  var radio = document.getElementById('Application_company_type_of_ownership_1');
  if (radio.checked) ownership(radio.value);
})();
</script>
Ответить с цитированием
  #7 (permalink)  
Старый 22.04.2014, 12:59
Новичок на форуме
Отправить личное сообщение для decd Посмотреть профиль Найти все сообщения от decd
 
Регистрация: 22.04.2014
Сообщений: 5


Не знаю как и благодарить

В виду сроков думал уже вообще отказаться от данной функции.

А если таких радио будет несколько, и вариантов выбора 3-4 для каждого - тоже будет работать?


P.S Сейчас проверю)
Ответить с цитированием
  #8 (permalink)  
Старый 22.04.2014, 13:03
Профессор
Отправить личное сообщение для jsnb Посмотреть профиль Найти все сообщения от jsnb
 
Регистрация: 15.03.2014
Сообщений: 561

Сообщение от decd Посмотреть сообщение
А если таких радио будет несколько, и вариантов выбора 3-4 для каждого - тоже будет работать?
Данный код работает только с конкретным радиобаттоном по id. На другие он не влияет. У вас вообще всё странно сделано, надо как-то это переписывать нормально.
Ответить с цитированием
  #9 (permalink)  
Старый 22.04.2014, 13:08
Новичок на форуме
Отправить личное сообщение для decd Посмотреть профиль Найти все сообщения от decd
 
Регистрация: 22.04.2014
Сообщений: 5

Добавил для другого радио:
(function() {
  var radio2 = document.getElementById('Application_company_legal_form_3');
  if (radio2.checked) legalForm(radio2.value);
})();

И для него тоже заработало, СУПЕР!

Ситуация такова, что с js никогда не работал, а в данном конкретном проекте приходится и фронтэндом заниматься. Сейчас главное в сроки уложиться, а по ходу уже буду стараться привести все это в человеческий вид. Или попросить кого навести порядок в скриптах, не за бесплатно, конечно. Кстати, Вы бы взялись?
Ответить с цитированием
Ответ



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

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


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
автозаполнение текстового поля значением другого поля ilyas-> Элементы интерфейса 2 21.10.2013 08:07
Нужно сделать плавное появление текстового поля как на сайте vkontakte.ru paratrooper1981 Элементы интерфейса 1 23.11.2009 18:24