OTRS динамические формы

Только для готовых решений! Пожалуйста, не используйте для вопросов и обсуждений!

Модератор: ykolesnikov

Ответить
egorbright
OTRS Новобранец
Сообщения: 126
Зарегистрирован: 11 янв 2013, 12:06

OTRS динамические формы

Сообщение egorbright » 26 фев 2013, 07:56

Всем привет.

В данном посте я хотел бы рассмотреть создание разных наборов полей (форм) для разных очередей.
Как здесь мне и посоветовали, я проследовал на otterhub и посмотрел там ветку, в которой велось обсуждение данной проблемы.

Что мы будем делать?

В данном примере - скрывать и показывать разные поля в зависимости от выбранного значения в селекте «Очередь» («Получатель», «To») посредством изменения атрибута class элементов DOM.

Что нам это даст?

У нас действительно будут разные формы заявок для разных очередей. Только вот именовать это решение «не костылём» язык не поворачивается.

Что делать?

1. Нам нужен файл .js, в котором мы будем хранить свои функции и их вызовы.
2. Нам надо добавить его через админ-интерфейс в Loader, чтобы при включении серверного кэширования и оптимизации *.js файлов всё произошло как надо.
3. Свой файл css, в котором мы будем хранить необходимые для совершения всего этого классы.
4. Файл css также необходимо добавить в Loader.

JS

1. Формируем JS объект:

Код: Выделить всё

var containers = {
	'Dest': {
		'22': ['external-network-access'],
		'20': ['create-virtual-machine'],
	},
	'DynamicField_extAccessConnectionType': {
		'3': ['radmin-fields'],
		'5': ['vpn-fields', 'radmin-fields'],
	},
 };
Его структура:

Код: Выделить всё

    'id_поля': {
        'int целое число, создержащееся в value поля': ['контейнер1', 'контейнер2']
    },
...
контейнер1, контейнер2 - это id контейнеров, в которых упакованы поля (например, div)

2. Показываем поля:

Код: Выделить всё

function showFields(elementId, elementVal) {
	hideFields(elementId);
	
	elementVal = parseInt(elementVal);
	
	if (containers[elementId] != undefined) {
		
		var current = containers[elementId];
		
		if (!isNaN(elementVal)) {
			if (Array.isArray(current[elementVal])) {
				$.each(current[elementVal], function(i) {
					var id = current[elementVal][i];
					$('#' + id).removeClass(elementId + '-hidden');
					setValidation(id);
				});
			}
		}
	}	
}

Код: Выделить всё

3. Скрываем поля:
function hideFields(elementId) {
	var current = containers[elementId];
	
	$.each(current, function(i) {
		var id = current[i];
		$('#' + id).addClass(elementId + '-hidden');
		//console.log('Added class: ' + elementId + '-hidden');
	});
}
Скрываем поля, показываем поля, вуаля =)
Последний раз редактировалось egorbright 08 апр 2013, 15:34, всего редактировалось 2 раза.
FreeBSD 7.4 :: OTRS 3.3.11
FreeBSD 9.1 :: OTRS 5

Morfz
OTRS Новобранец
Сообщения: 13
Зарегистрирован: 24 апр 2013, 10:05

Re: OTRS динамические формы

Сообщение Morfz » 24 апр 2013, 10:08

Доброго времени суток! Если это возможно, могли бы вы, составить более подробную инструкцию, ибо я, как и многие другие, полный профан в программировании. Да и в целом плохо ориентируюсь в настройках OTRS. Спасибо.
Win2003R2, OTRS 3.2.1

alexus
OTRS Гуру
Сообщения: 5192
Зарегистрирован: 20 сен 2010, 18:17
Откуда: Москва
Благодарил (а): 92 раза
Поблагодарили: 82 раза

Re: OTRS динамические формы

Сообщение alexus » 25 апр 2013, 01:37

Я думаю, что за разумное вознаграждение автор избавит Вас от мучений профанации :-).
С уважением,
Алексей Юсов

Prod: OTRS CE ITSM 6.0.28 on CentOS 7 Apache 2.4 MariaDB 10.4.13 + Radiant Customer Portal

Radiant System OTRS Intergrator RU
Группа OTRS Community в Teleram
Хотите внедрить OTRS? Спросите меня как!

egorbright
OTRS Новобранец
Сообщения: 126
Зарегистрирован: 11 янв 2013, 12:06

Re: OTRS динамические формы

Сообщение egorbright » 20 май 2013, 11:12

Могу объяснить, но мне нужно знать что именно Вам не понятно =)
FreeBSD 7.4 :: OTRS 3.3.11
FreeBSD 9.1 :: OTRS 5

Morfz
OTRS Новобранец
Сообщения: 13
Зарегистрирован: 24 апр 2013, 10:05

Re: OTRS динамические формы

Сообщение Morfz » 22 май 2013, 07:34

Здравствуйте! Я пробовал править CustomerTicketMessage.dtl, по этой теме: http://forums.otterhub.org/viewtopic.php?f=60&t=8032, но у меня ничего не получилось.
Я добавил одно динамическое поле, добавил свою очередь и для эксперимента включил очередь Junk, и вставил следующий код:

Код: Выделить всё

<script type="text/javascript">
    Core.Customer.InitFocus();
#	switch ($('#Dest').val() ) { 
#		case "3\|\|Junk":
#			document.getElementById('DynamicField_Kabinet').style.display = 'block';
#			document.getElementById('LabelDynamicField_Kabinet').style.display = 'block';
#		break;
#		default:
#			document.getElementById('DynamicField_Kabinet').style.display = 'none';
#			document.getElementById('LabelDynamicField_Kabinet').style.display = 'none';
#	}
</script>
На данный момент форма новой заявки выглядит так:
Изображение
Если раскомментировать код, то поле и текст "Кабинет" исчезнут, и какую бы я очередь не выбирал, их не будет. Так как поле обязательно для заполнения, и его не видно, то заявку создать не получается... хотя может причина и не в этом. Что не так я делаю?
По поводу метода описанного в этой теме, тут мне не понятно всё. Не понятен код, где указывается очередь, где указывается конкретные динамические поля, которые необходимо скрыть. Сама структура файла непонятна. Непонятно, что должно быть в файле стилей (*.css). Я так и не смог найти Loader, где это и как это использовать?
Win2003R2, OTRS 3.2.1

egorbright
OTRS Новобранец
Сообщения: 126
Зарегистрирован: 11 янв 2013, 12:06

Re: OTRS динамические формы

Сообщение egorbright » 22 май 2013, 08:24

Моё решение выглядит иначе... Как в той ветке я делать не стал, ибо жёсткая привязка идет.
FreeBSD 7.4 :: OTRS 3.3.11
FreeBSD 9.1 :: OTRS 5

Morfz
OTRS Новобранец
Сообщения: 13
Зарегистрирован: 24 апр 2013, 10:05

Re: OTRS динамические формы

Сообщение Morfz » 22 май 2013, 09:00

Скажите, а вашем способе, что произойдет, если скроется поле обязательное для заполнения, получиться создать заявку?

Код: Выделить всё

var containers = {
   'Dest': {
      '22': ['external-network-access'],
      '20': ['create-virtual-machine'],
   },
   'DynamicField_extAccessConnectionType': {
      '3': ['radmin-fields'],
      '5': ['vpn-fields', 'radmin-fields'],
   },
};
В данном примере, применительно ко мне, "Dest" останется неизменно, ибо это id элемента select на форме новой заявки? Далее идут значения, содержащиеся в value этого select'а. А вот, то что в квадратных скобках мне не понятно. Как мне указать, что необходимо скрыть динамическое поле "Кабинет"? Или надо просто указать в этих скобках ID нужного мне динамического поля? Что храниться в файле *.css? Куда ложить эти файлы? Как заюзать Loader?)
Win2003R2, OTRS 3.2.1

egorbright
OTRS Новобранец
Сообщения: 126
Зарегистрирован: 11 янв 2013, 12:06

Re: OTRS динамические формы

Сообщение egorbright » 22 май 2013, 10:54

С обязательностью полей возникает еще один костыль.

Мне пришлось сделать следующее:

1. В админ-интерфейсе OTRS не делать обязательными динамические поля;
2. Добавлять класс "Validate_Required"в тег формы (например input);
3. Получать валидацию формы только на клиенте.
FreeBSD 7.4 :: OTRS 3.3.11
FreeBSD 9.1 :: OTRS 5

egorbright
OTRS Новобранец
Сообщения: 126
Зарегистрирован: 11 янв 2013, 12:06

Re: OTRS динамические формы

Сообщение egorbright » 22 май 2013, 13:55

1. Dest - верно. Это ID элемента, зависимость от которого мы пытаемся выстроить.
2. Значения, содержащие value - тоже верно. Это в зависимости от каких позиций в select-e будем чего-то делать.
3. Содержимое квадратных скобок - это id элементов DIV, в которых мы располагаем необходимые динамические поля (в файле CustomerTicketMessage.dtl; Настоятельно рекомендуется данный файл переместить в папку Custom/Kernel/Output/HTML/Standard/ и уже там его менять. Инструкция по выводу динамических полей не всех вместе, а по одиночке, приведена прямо в этом файле. Смотрите закомментированные строки ближе к концу файла).
4. В файле css хранятся стили для классов. Благодаря jQuery мы просто будем переключать классы объектов DOM, которые будут нести за собой визуальные изменения на странице.
Например:
1. создаем файл: /usr/local/otrs/var/httpd/htdocs/skins/Customer/default/css/CustomCustomer.css
2. пишем туда это:

Код: Выделить всё

.Dest-hidden {
	display: none;
}
3. Где хранить файлы? Где пожелаете, но удобнее - здесь: <OTRS_DIR>/var/httpd/htdocs/skins/Customer/default/css/<filename>.css
4. Loader: Хранить файлы в указанном в п. 3 месте будем для того, чтобы быстрее добавлять их в Loader:
  • Идем сюда: Framework -> Core::Web
    Там ищем это: Loader::Customer::CommonJS###000-Framework
    Добавляем туда еще одно поле и указываем <filename>.css
    Аналогичная история с js файликами.
Уфф... Если чего не понятно - пишите. "Объяснятор" из меня никакой...
FreeBSD 7.4 :: OTRS 3.3.11
FreeBSD 9.1 :: OTRS 5

Morfz
OTRS Новобранец
Сообщения: 13
Зарегистрирован: 24 апр 2013, 10:05

Re: OTRS динамические формы

Сообщение Morfz » 22 май 2013, 14:16

Спасибо, буду пробовать, может чего нить и получиться. :)
Win2003R2, OTRS 3.2.1

jas_1211
OTRS Новобранец
Сообщения: 16
Зарегистрирован: 10 июл 2013, 16:26

Re: OTRS динамические формы

Сообщение jas_1211 » 12 июл 2013, 10:37

Добрый день всем!
Изменил форму клиентов чтобы клинеты не писали свою заявку, а чтоб она была кликабельна (файл CustomerTicketMessage.dtl).
логика такая, скрываю стандартную форму джаваскриптом, и рисую свою..
по нажатия на кнопку анализируется то что выбрал пользователь (опять же джаваскриптом) и исходя из условий вставляется в родную форму: очередь, тема, текст и приоритет.
сделал всё, всё работает кроме одного ньюанса, в поле Текст вставляться не хочет, как я понял из-за "ckeditor.js" файлика который помогает работает для того чтобы былj табло редактирования текста.. без неё работает, но текст понятно не форматированный уходит, для меня важен не сколько стиль, а перевод на другую строку, он его отправляется одной строкой.. так вот кто-нибудь сталкивался с этим? Как его можно подредактировать? что посоветуете?

egorbright
OTRS Новобранец
Сообщения: 126
Зарегистрирован: 11 янв 2013, 12:06

Re: OTRS динамические формы

Сообщение egorbright » 12 июл 2013, 10:56

Поможет изучение API CK Editor-a
FreeBSD 7.4 :: OTRS 3.3.11
FreeBSD 9.1 :: OTRS 5

jas_1211
OTRS Новобранец
Сообщения: 16
Зарегистрирован: 10 июл 2013, 16:26

Re: OTRS динамические формы

Сообщение jas_1211 » 28 окт 2013, 16:22

Здравствуйте! сделал тоже самое. все работает. есть только один нюанс: к некоторым типам заявок надо прикладывать файл. так вот после того как файл загрузится, страница апдейтится и всё что пользователь до этого выбирал, сбрасывается=(
как можна это побороть?

egorbright
OTRS Новобранец
Сообщения: 126
Зарегистрирован: 11 янв 2013, 12:06

Re: OTRS динамические формы

Сообщение egorbright » 29 окт 2013, 07:45

Ответ здесь:

Код: Выделить всё

<!--dtl:js_on_document_complete-->
<script type="text/javascript">//<![CDATA[
    $('#Attachment').bind('change', function (Event) {
        var $Form = $('#Attachment').closest('form');
        Core.Form.Validate.DisableValidation($Form);
        $Form.find('#AttachmentUpload').val('1').end().submit();
    });
//]]></script>
<!--dtl:js_on_document_complete-->
FreeBSD 7.4 :: OTRS 3.3.11
FreeBSD 9.1 :: OTRS 5

Ответить