Страница 1 из 1
OTRS динамические формы
Добавлено: 26 фев 2013, 07:56
egorbright
Всем привет.
В данном посте я хотел бы рассмотреть создание разных наборов полей (форм) для разных очередей.
Как здесь мне и посоветовали, я проследовал на 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');
});
}
Скрываем поля, показываем поля, вуаля =)
Re: OTRS динамические формы
Добавлено: 24 апр 2013, 10:08
Morfz
Доброго времени суток! Если это возможно, могли бы вы, составить более подробную инструкцию, ибо я, как и многие другие, полный профан в программировании. Да и в целом плохо ориентируюсь в настройках OTRS. Спасибо.
Re: OTRS динамические формы
Добавлено: 25 апр 2013, 01:37
alexus
Я думаю, что за разумное вознаграждение автор избавит Вас от мучений профанации
.
Re: OTRS динамические формы
Добавлено: 20 май 2013, 11:12
egorbright
Могу объяснить, но мне нужно знать что именно Вам не понятно =)
Re: OTRS динамические формы
Добавлено: 22 май 2013, 07:34
Morfz
Здравствуйте! Я пробовал править 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, где это и как это использовать?
Re: OTRS динамические формы
Добавлено: 22 май 2013, 08:24
egorbright
Моё решение выглядит иначе... Как в той ветке я делать не стал, ибо жёсткая привязка идет.
Re: OTRS динамические формы
Добавлено: 22 май 2013, 09:00
Morfz
Скажите, а вашем способе, что произойдет, если скроется поле обязательное для заполнения, получиться создать заявку?
Код: Выделить всё
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?)
Re: OTRS динамические формы
Добавлено: 22 май 2013, 10:54
egorbright
С обязательностью полей возникает еще один костыль.
Мне пришлось сделать следующее:
1. В админ-интерфейсе OTRS не делать обязательными динамические поля;
2. Добавлять класс "Validate_Required"в тег формы (например input);
3. Получать валидацию формы только на клиенте.
Re: OTRS динамические формы
Добавлено: 22 май 2013, 13:55
egorbright
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. пишем туда это:
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 файликами.
Уфф... Если чего не понятно - пишите. "Объяснятор" из меня никакой...
Re: OTRS динамические формы
Добавлено: 22 май 2013, 14:16
Morfz
Спасибо, буду пробовать, может чего нить и получиться.
Re: OTRS динамические формы
Добавлено: 12 июл 2013, 10:37
jas_1211
Добрый день всем!
Изменил форму клиентов чтобы клинеты не писали свою заявку, а чтоб она была кликабельна (файл CustomerTicketMessage.dtl).
логика такая, скрываю стандартную форму джаваскриптом, и рисую свою..
по нажатия на кнопку анализируется то что выбрал пользователь (опять же джаваскриптом) и исходя из условий вставляется в родную форму: очередь, тема, текст и приоритет.
сделал всё, всё работает кроме одного ньюанса, в поле Текст вставляться не хочет, как я понял из-за "ckeditor.js" файлика который помогает работает для того чтобы былj табло редактирования текста.. без неё работает, но текст понятно не форматированный уходит, для меня важен не сколько стиль, а перевод на другую строку, он его отправляется одной строкой.. так вот кто-нибудь сталкивался с этим? Как его можно подредактировать? что посоветуете?
Re: OTRS динамические формы
Добавлено: 12 июл 2013, 10:56
egorbright
Поможет изучение API CK Editor-a
Re: OTRS динамические формы
Добавлено: 28 окт 2013, 16:22
jas_1211
Здравствуйте! сделал тоже самое. все работает. есть только один нюанс: к некоторым типам заявок надо прикладывать файл. так вот после того как файл загрузится, страница апдейтится и всё что пользователь до этого выбирал, сбрасывается=(
как можна это побороть?
Re: OTRS динамические формы
Добавлено: 29 окт 2013, 07:45
egorbright
Ответ здесь:
Код: Выделить всё
<!--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-->