Warning: Cannot use a scalar value as an array in /home/admin/public_html/forum/include/fm.class.php on line 757

Warning: Invalid argument supplied for foreach() in /home/admin/public_html/forum/include/fm.class.php on line 770
Форумы портала PHP.SU :: Версия для печати :: Динамическая форма
Форумы портала PHP.SU » Клиентская разработка » JavaScript & VBScript » Динамическая форма

Страниц (1): [1]
 

1. kuller - 17 Апреля, 2016 - 17:20:04 - перейти к сообщению
Помогите пожалуйста... я плохо знаю js, а мне необходимо сделать динамическую форму. Чтоб данные подставлялись без использования php. Точный пример это как на авито когда добавляем объявление. Пробовал поискать готовые результаты, но нет не чего....

P.S за готовый результат формы могу заплатить!
2. kuller - 17 Апреля, 2016 - 23:02:01 - перейти к сообщению
пока актуально Огорчение

почему этот код по первому клику выдает undefined

CODE (html):
скопировать код в буфер обмена
  1.  
  2. <input type="radio" id="t1" name="category_id" value="1"> текст 2 <label for="t1" onclick="category();">Квартира</label><input type="radio" id="t2" name="category_id" value="2"> <label for="t2" onclick="category();"> текст 2 </label>
  3.  


CODE (javascript):
скопировать код в буфер обмена
  1.  
  2. function category(id)
  3. {
  4.         var category_id = $('input[name=category_id]:checked').val();
  5.         alert(category_id);
  6. }
  7.  


так, постоянно увеличивается количество отображения alert
CODE (javascript):
скопировать код в буфер обмена
  1.  
  2. $(".category_id").click(function()
  3.         {
  4.                 var category_id = $('input[name=category_id]:checked').val();
  5.                
  6.                 alert(category_id);
  7.         });
  8.  
3. IllusionMH - 18 Апреля, 2016 - 12:18:17 - перейти к сообщению
kuller, а кто сказал что нужно слушать клик? и вы уверены что клик срабатывает после того как происходит выделение?
и вообще, в обработчиках событий this ссылается зачастую на нужный элемент
4. kuller - 18 Апреля, 2016 - 21:46:00 - перейти к сообщению
IllusionMH пишет:
kuller, а кто сказал что нужно слушать клик? и вы уверены что клик срабатывает после того как происходит выделение?
и вообще, в обработчиках событий this ссылается зачастую на нужный элемент


да, с этим разобрался.

Подскажите как присвоить лучше каждой категории свои поля?

Сейчас делаю так...

передаю через onclick id-категории поля которые уникальные (не повторяются в других категорий) прописываю в самом js и через .html('code'); вывожу на странице. Так же у некоторых полей надо менять просто текст (название поля), делаю аналогично. В результате получается куча условий if.

мне кажется что этот способ начинает чем та попахивать.... Как правильно все это дело организовать?
5. IllusionMH - 19 Апреля, 2016 - 14:17:21 - перейти к сообщению
kuller, иметь массив конфигов полей для разнык категорий, и уметь рендерить конфиг в html.
Или искать либы.
6. kuller - 23 Апреля, 2016 - 21:32:28 - перейти к сообщению
Написал!!! не знаю только на сколько правильно код построен, но работает )))

Спойлер (Отобразить)

(Добавление)
продолжение

Спойлер (Отобразить)

(Добавление)
html

CODE (html):
скопировать код в буфер обмена
  1.  
  2. <div class="pad10">
  3.         <h2 class="section_title">Выберите категорию</h2>
  4.         <div id="form">
  5.                 <div id="category_id" class="left action_checkbox">
  6.                         <span class="category_title">Категория</span>
  7.                         <input type="radio" id="kv" name="category_id" value="1" onclick="category(0);"><label for="kv" class="lfch lfch_save">Квартира</label>
  8.                         <input type="radio" id="km" name="category_id" value="2" onclick="category('km');"><label for="km" class="lfch lfch_save">Комнаты</label>
  9.                         <input type="radio" id="dom" name="category_id" value="3" onclick="category('dom');"><label for="dom" class="lfch lfch_save">Дома, дачи, коттеджи</label>
  10.                         <input type="radio" id="land" name="category_id" value="4" onclick="category(0);"><label for="land" class="lfch lfch_save">Земельные участки</label>
  11.                         <input type="radio" id="parking" name="category_id" value="5" onclick="category(0);"><label for="parking" class="lfch lfch_save">Гаражи и машиноместа</label>
  12.                         <input type="radio" id="commercial" name="category_id" value="6" onclick="category(0);"><label for="commercial" class="lfch lfch_save">Коммерческая недвижимость</label>
  13.                         <input type="radio" id="abroad" name="category_id" value="7" onclick="category(0);"><label for="abroad" class="lfch lfch_save">Недвижимость за рубежом</label>
  14.                 </div>
  15.                 <div id="type_obj" class="left action_checkbox_item form-category" style="display: none;">
  16.                         <span class="category_title_exp"></span>
  17.                         <div class="category_item"></div>
  18.                 </div>
  19.         </div>
  20.         <div id="result_category" onclick="shows();"></div>
  21.         <div class="clr"></div>
  22.         <div id="f_form" style="display: none;">
  23.                 <div id="apartments"></div>
  24.                 <div class="inBlock">
  25.                         <div class="w200 left">Ваше имя</div>
  26.                         <input type="text" id="name" class="f_input" maxlength="30" style="width: 430px;">
  27.                 </div>
  28.                 <div class="inBlock">
  29.                         <div class="w200 left">Телефон</div>
  30.                         <input type="text" id="phoneAd" class="f_input" style="width: 130px;">
  31.                 </div>
  32.                 <div class="inBlock" style="margin-top: 10px;">
  33.                         <div class="w200 left">&nbsp;</div>
  34.                         <input type="submit" value="Отправить" class="btn" onclick="addObj();">
  35.                 </div>
  36.         </div>
  37. </div>
  38.  


и немного css
CODE (htmlphp):
скопировать код в буфер обмена
  1.  
  2. .category_title, .category_title_exp {font-size: 13px; color: #858585; padding: 5px 7px 5px; display: block;}
  3. .lfch {width: auto; cursor: pointer; display: inline-block;}
  4. .action_checkbox  {border-right: 1px solid #d8d8d8;}
  5. .action_checkbox, .action_checkbox_item  {width: 334px; font-size: 14px; position: relative;}
  6. .lfch_save {background: none; line-height: 30px; padding: 0 7px; width: 320px;}
  7. .lfch_save:hover {background: #FEC171; color: #fff; line-height: 30px;}
  8. .action_checkbox input:checked + .lfch_save, .action_checkbox_item  input:checked + .lfch_save {background: #FE9B1A; color: #fff; line-height: 30px;}
  9. .action_checkbox input,.action_checkbox_item input {display: none;}
  10.  

(Добавление)
еще функция отвечающая за изменения категории

CODE (javascript):
скопировать код в буфер обмена
  1. function shows()
  2. {
  3.         $("#result_category").fadeOut(500);
  4.         $("#f_form").fadeOut(500);
  5.         setTimeout(function()
  6.         {
  7.                 $("#form").fadeIn(500);
  8.         }, 505);
  9. }

 

Powered by ExBB FM 1.0 RC1