Показ/скрытие полей через JavaScript
#1
Отправлено 11 Март 2011 - 18:04
например как только в списке мы выбираем один пункт (заказ на авто) - то сразу же ниже показываются поля - которые нужно заполнить для заказа именно авто.
а если мы выберем пункт (заказ катера) - то покажутся уже другие поля.
возможно это как то можно реализовать через ява скрипт.
в любом случае это очень удобно
#2
Отправлено 11 Март 2011 - 18:45
Для этого во-первых добавляете код события "onchange" (изменение поля) на сам список:
function onchange_{$one_field.id}() { display_field(id1, document.getElementById('value{$one_field.id}').value=="заказ на авто"); display_field(id2, document.getElementById('value{$one_field.id}').value=="заказ катера"); // id1 и id2 - id тех полей, которые необходимо скрыть/отобразить, вместо них подставляете нужные вам номера } addHandler(document.getElementById('value{$one_field.id}'), 'onchange', onchange_{$one_field.id});Во-вторых, добавляете видимость этих полей уже в их настройки (это нужно чтобы определять видимость поля при открытии записи, еще до изменения списка):
display_field({$one_field.id}, document.getElementById('valueID').value=="заказ на авто"); // ID заменяете на реальный id поля "список"
Вместо {$one_field.id} можно тоже вставлять сразу id текущего поля, как в документации на сайте. Это просто переменная, которая вставляет его автоматически.
ВНИМАНИЕ! Пример выше на текущий момент (2016 год) частично устарел (в частности, он не поддерживает работу с полями связи, даты и т.д., см. ниже по теме), поэтому в настоящее время рекомендуется следующий вариант (задача та же самая):
function onchange_{$one_field.id}() { display_field(id1, $('#value{$one_field.id}').val()=="заказ на авто"); display_field(id2, $('#value{$one_field.id}').val()=="заказ катера"); // id1 и id2 - id тех полей, которые необходимо скрыть/отобразить, вместо них подставляете нужные вам номера } $(document).ready(onchange_{$one_field.id}); $('#value{$one_field.id}').change(onchange_{$one_field.id});
Код добавляется только в первое поле (которое меняется), в скрываемые поля добавлять код уже не нужно! Более того, если заменить {$one_field.id} на id изменяемого поля, то код в принципе может находится в любом месте.
ВАЖНО! Код в примере выше будет работать, только если поле {$one_field.id} (т.е. откуда берутся значения для сравнения) является редактируемым! Иначе необходимо использовать для скрытия/отображения полей правила доступа.
Общий алгоритм для js в полях таким образом такой:
function onchange_{$one_field.id}() // имя функции может быть любым, необязательно "onchange_{$one_field.id}", главное чтобы не повторялось в других местах { // любой нужный вам js-код } $(document).ready(onchange_{$one_field.id}); // запускаем функцию при событии загрузки страницы (т.о. нужные поля могут сразу скрываться) $('#value{$one_field.id}').change(onchange_{$one_field.id}); // запускаем ту же самую функцию при событии изменения поля
ВНИМАНИЕ! Любой JS код будет активен только в режиме редактирования основной записи, в режиме таблицы/подтаблицы JS код работать не будет!
Одна из причин этого - в разных строках таблицы могут быть разные значения, тогда как столбец с полем один на все строки. Скрыть же столбец "частично" невозможно.
ДОПОЛНЕНИЕ ДЛЯ ВЕРСИЙ 3.х
Код выше работает только в режиме стандартного ("полного") редактирования, т.е. после нажатия на кнопку Редактировать. В режиме "быстрого редактирования" он не работает (не реагирует на изменение поля), поля скрываются/показываются только после перезагрузки страницы. Для того чтобы скрытие полей работало и в новом режиме тоже, необходимо дополнить код выше следующим фрагментом:
function fast_change_{$one_field.id}() { display_field(id1, $('#view_cell_{$one_field.id}').val()=="заказ на авто"); display_field(id2, $('#view_cell_{$one_field.id}').val()=="заказ катера"); // id1 и id2 - id тех полей, которые необходимо скрыть/отобразить, вместо них подставляете нужные вам номера } $('#view_cell_{$one_field.id}').change(fast_change_{$one_field.id});
В итоге получим код работающий в обоих режимах:
// стандартное редактирование: function onchange_{$one_field.id}() { display_field(id1, $('#value{$one_field.id}').val()=="заказ на авто"); display_field(id2, $('#value{$one_field.id}').val()=="заказ катера"); // id1 и id2 - id тех полей, которые необходимо скрыть/отобразить, вместо них подставляете нужные вам номера } $(document).ready(onchange_{$one_field.id}); $('#value{$one_field.id}').change(onchange_{$one_field.id}); // быстрое редактирование: function fast_change_{$one_field.id}() { display_field(id1, $('#view_cell_{$one_field.id}').val()=="заказ на авто"); display_field(id2, $('#view_cell_{$one_field.id}').val()=="заказ катера"); // id1 и id2 - id тех полей, которые необходимо скрыть/отобразить, вместо них подставляете нужные вам номера } $('#view_cell_{$one_field.id}').change(fast_change_{$one_field.id});
ВНИМАНИЕ!
Начиная с версии 3.0.4 появилась опция "Режим быстрого редактирования/добавления записей", при включении которой "JS в полях" больше не работает, а показ/скрытие полей полностью регулируется правилами доступа.
В дальнейшем предусмотрен полный переход программы на данный режим.
Сообщение отредактировал CbCoder: 28 Февраль 2024 - 15:05
#3
Отправлено 11 Март 2011 - 19:02
вы просто этой версией - на новый уровень базу вывели ...
вопрос по данному коду - как сделать, чтобы по умолчанию - дополнительные поля были скрыты? и только при выборе нужного условия в списке они показывались.
по тому скрипту который сейчас - при открытии заявки - видны все поля. естественно когда начинаешь выбирать список - остаются нужные, но лучше сразу все не показывать
#4
Отправлено 11 Март 2011 - 19:08
Разработчик (11.3.2011, 18:45) писал:
display_field({$one_field.id}, document.getElementById('valueID').value=="заказ на авто"); // ID заменяете на реальный id поля "список"
#5
Отправлено 02 Июнь 2011 - 09:29
в таблице договор есть поле-список (предмет договора) состоит из:
Обучение (Екат)
Обучение выездной
Регистрация, настройка ПО
ОАЭФ
Конкурс (94 ФЗ)
Аукцион (Фас 67)
Конкурс (Фас 67)
Аукцион (ГК РФ)
Выбрать можно только одно.
И надо чтобы в зависимости от выбранного показывались только необходимые поля.
Мои действия:
1 добавляю в поле-список (предмет договора) в джава скрипт
function onchange_{$one_field.id}()
{
display_field(id10, document.getElementById('value{$one_field.id}').value=="Обучение (Екат)");
display_field(id11, document.getElementById('value{$one_field.id}').value=="Обучение (Екат)");
display_field(id12, document.getElementById('value{$one_field.id}').value=="Обучение (Екат)");
display_field(id13, document.getElementById('value{$one_field.id}').value=="Обучение (Екат)");
display_field(id14, document.getElementById('value{$one_field.id}').value=="Обучение (Екат)");
display_field(id15, document.getElementById('value{$one_field.id}').value=="Обучение (Екат)");
display_field(id16, document.getElementById('value{$one_field.id}').value=="Обучение (Екат)");
display_field(id10, document.getElementById('value{$one_field.id}').value=="Обучение выездной");
display_field(id11, document.getElementById('value{$one_field.id}').value=="Обучение выездной");
display_field(id12, document.getElementById('value{$one_field.id}').value=="Обучение выездной");
display_field(id13, document.getElementById('value{$one_field.id}').value=="Обучение выездной");
display_field(id14, document.getElementById('value{$one_field.id}').value=="Обучение выездной");
display_field(id15, document.getElementById('value{$one_field.id}').value=="Обучение выездной");
display_field(id16, document.getElementById('value{$one_field.id}').value=="Обучение выездной");
display_field(id8, document.getElementById('value{$one_field.id}').value=="Регистрация, настройка ПО");
display_field(id8, document.getElementById('value{$one_field.id}').value=="ОАЭФ");
display_field(id8, document.getElementById('value{$one_field.id}').value=="Конкурс (94 ФЗ)");
display_field(id8, document.getElementById('value{$one_field.id}').value=="Аукцион (Фас 67)");
display_field(id8, document.getElementById('value{$one_field.id}').value=="Конкурс (Фас 67)");
display_field(id8, document.getElementById('value{$one_field.id}').value=="Аукцион (ГК РФ)");
}
addHandler(document.getElementById('value{$one_field.id}'), 'onchange', onchange_{$one_field.id});
2. добавляю в поле 8
display_field({$one_field.id}, document.getElementById('value7').value=="Регистрация, настройка ПО");
display_field({$one_field.id}, document.getElementById('value7').value=="ОАЭФ");
display_field({$one_field.id}, document.getElementById('value7').value=="Конкурс (94 ФЗ)");
display_field({$one_field.id}, document.getElementById('value7').value=="Аукцион (Фас 67)");
display_field({$one_field.id}, document.getElementById('value7').value=="Конкурс (Фас 67)");
display_field({$one_field.id}, document.getElementById('value7').value=="Аукцион (ГК РФ)");
3. Добавляю в поля 11,12,13,14,15,16
display_field({$one_field.id}, document.getElementById('value7').value=="Обучение (Екат)");
display_field({$one_field.id}, document.getElementById('value7').value=="Обучение выездной");
Ничерта не пашет - как все поля показывались так и показываются.
Что то где то напутал
Я правильно понял - ID поля - это его номер порядковый номер под которым он в таблице стоит?
#6
Отправлено 02 Июнь 2011 - 09:41
#7
Отправлено 02 Июнь 2011 - 09:43
Цитата
Во-вторых никакой строки "id" в аргументе функции display_field не пишется. В противном случае этот аргумент писался бы в кавычках как все нормальные строки. Пишется только сам ID в виде числа: display_field(111, document.getElementById('value{$one_field.id}').value=="Обучение (Екат)");
#9
Отправлено 02 Июнь 2011 - 10:27
Сработало только на крайних точках
display_field({$one_field.id}, document.getElementById('value7').value=="Регистрация, настройка ПО");
display_field({$one_field.id}, document.getElementById('value7').value=="ОАЭФ");
display_field({$one_field.id}, document.getElementById('value7').value=="Конкурс (94 ФЗ)");
display_field({$one_field.id}, document.getElementById('value7').value=="Аукцион (Фас 67)");
display_field({$one_field.id}, document.getElementById('value7').value=="Конкурс (Фас 67)");
display_field({$one_field.id}, document.getElementById('value7').value=="Аукцион (ГК РФ)"); - срабатывает только когда ставишь Аукцион (ГК РФ),
Если ставишь Регистрация, настройка ПО или что то другое из этого списка - не срабатывает.
Может между ним надо какойто символ - "Или" - поставить?
Что бы система понимала что если выберут любой из указанный параметров надо показывать строки.
#10
Отправлено 02 Июнь 2011 - 10:40
display_field({$one_field.id}, document.getElementById('value7').value=="Регистрация, настройка ПО" || document.getElementById('value7').value=="ОАЭФ" || ....... );или более читабельная запись:
if (document.getElementById('value7').value=="Регистрация, настройка ПО") display_field({$one_field.id}, 1); else if (document.getElementById('value7').value=="ОАЭФ") display_field({$one_field.id}, 1); ...... else display_field({$one_field.id}, 0);
#11
Отправлено 02 Июнь 2011 - 11:14
#12
Отправлено 02 Июнь 2011 - 11:36
#13
Отправлено 02 Июнь 2011 - 12:02
Это в список
function onchange_{$one_field.id}()
{
display_field(1027, document.getElementById('value{$one_field.id}').value=="Обучение (Екат)" || document.getElementById('value{$one_field.id}').value=="Обучение выездной" );
display_field(1028, document.getElementById('value{$one_field.id}').value=="Обучение (Екат)" || document.getElementById('value{$one_field.id}').value=="Обучение выездной" );
display_field(1029, document.getElementById('value{$one_field.id}').value=="Обучение (Екат)" || document.getElementById('value{$one_field.id}').value=="Обучение выездной" );
display_field(1030, document.getElementById('value{$one_field.id}').value=="Обучение (Екат)" || document.getElementById('value{$one_field.id}').value=="Обучение выездной" );
display_field(1031, document.getElementById('value{$one_field.id}').value=="Обучение (Екат)" || document.getElementById('value{$one_field.id}').value=="Обучение выездной" );
display_field(1032, document.getElementById('value{$one_field.id}').value=="Обучение (Екат)" || document.getElementById('value{$one_field.id}').value=="Обучение выездной" );
display_field(1033, document.getElementById('value{$one_field.id}').value=="Обучение (Екат)" || document.getElementById('value{$one_field.id}').value=="Обучение выездной" );
display_field(1045, document.getElementById('value{$one_field.id}').value=="Регистрация, настройка ПО" || document.getElementById('value{$one_field.id}').value=="Аукцион (ГК РФ)" || document.getElementById('value{$one_field.id}').value=="ОАЭФ" || document.getElementById('value{$one_field.id}').value=="Конкурс (94 ФЗ)" || document.getElementById('value{$one_field.id}').value=="Аукцион (Фас 67)" || document.getElementById('value{$one_field.id}').value=="Конкурс (Фас 67)" );
}
addHandler(document.getElementById('value{$one_field.id}'), 'onchange', onchange_{$one_field.id});
Это в поле № 1045
display_field({$one_field.id}, document.getElementById('value1044').value=="Регистрация, настройка ПО" || document.getElementById('value1044').value=="Аукцион (ГК РФ)" || document.getElementById('value1044').value=="ОАЭФ" || document.getElementById('value1044').value=="Конкурс (94 ФЗ)" || document.getElementById('value1044').value=="Аукцион (Фас 67)" || document.getElementById('value1044').value=="Конкурс (Фас 67)" );
Это в ост поля
display_field({$one_field.id}, document.getElementById('value1044').value=="Обучение (Екат)" || document.getElementById('value1044').value=="Обучение выездной" );
#14
Отправлено 02 Июнь 2011 - 22:42
#15
Отправлено 03 Июнь 2011 - 05:58
#16
Отправлено 16 Июль 2011 - 03:05
#17
Отправлено 04 Август 2011 - 12:07
Чтобы проверить, что какое значение храниться в этом поле применил код
var Nazvanie_dokumenta=document.getElementById('value981').value; alert("onchange: "+Nazvanie_dokumenta);Получаем, например: "onchange: 4". Т.е. получаем ID значения в этом поле, как и должно быть.
Но если я проверяю значение этого поля и хочу скрыть поле 987 при помощи кода
display_field(987, document.getElementById('value{$one_field.id}').value==4);то условие не срабатывает. Пробовал также value=="4", все равно не получается.
Подскажите, плз, как проверить значение поля связи.
#18
Отправлено 04 Август 2011 - 14:00
Проверил у себя - все работает. Если разумеется правильно проставить id полей.
#19
Отправлено 04 Август 2011 - 14:19
Разработчик (4.8.2011, 14:00) писал:
Проверил у себя - все работает. Если разумеется правильно проставить id полей.
Должно показываться. Полный код такой:
// Изменение отображения поля Название документа, при загрузке страницы // display_field(981,0); function on_change_Nazvanie_dokumenta() { // Изменение значения поля Название документа // var Nazvanie_dokumenta=document.getElementById('value981').value; //alert("onchange: "+Nazvanie_dokumenta); display_field(987, document.getElementById('value{$one_field.id}').value==4); }; addHandler(document.getElementById('value981'), 'onchange', on_change_Nazvanie_dokumenta);
#20
Отправлено 04 Август 2011 - 14:46
Количество пользователей, читающих эту тему: 7
0 пользователей, 7 гостей, 0 анонимных