Кастомизация
18
Авг
0

Светофор

Поместим на форму объекта цветовой индикатор, который будет менять свой цвет в зависимости от значения какого-либо поля (в данном случае пиклиста).

Приступим:

  • Создайте в CRM из следующих рисунков PNG Веб-ресурсы (с аналогичными именами):
  • Добавьте в нужный объект пиклист с именем new_importance и следующими значениями:
    • 100000000 — Синий
    • 100000001 — Зеленый
    • 100000002 — Желтый
    • 100000003 — Оранжевый
    • 100000004 – Красный

    Разместите пиклист на форме объекта;

  • Создайте JS Веб-ресурс с таким кодом:
    // Меняем цвет кружка
    function circle_build() {
        // Определяем начальный цвет кружка
        colorCircle = circle_color();
    
        // Создаем большой начальный кружок
        var bigContainer = document.getElementById('form_title_div').parentNode.parentNode.parentNode.parentNode.parentNode.parentNode.parentNode;
        var newTD = document.createElement('td');
        newTD.style.setAttribute('padding', '4px');
        newTD.setAttribute('width', '56px');
        var newIMG = document.createElement("img");
        newIMG.setAttribute('src', Xrm.Page.context.getServerUrl() + '/WebResources/new_circle_' + circle_color());
        newIMG.setAttribute('id', 'circle');
        newTD.appendChild(newIMG);
        bigContainer.appendChild(newTD);
    
        // Получаем ссылку на круг для дальнейшей смены его цвета
        сircle = document.getElementById('circle');
    }
    
    // Меняем цвет кружка
    function circle_change() {
        сircle.src = Xrm.Page.context.getServerUrl() + '/WebResources/new_circle_' + circle_color();
    }
    
    // Определение цвета кружка
    function circle_color() {
        switch (Xrm.Page.getAttribute("new_importance").getValue()) {
            case 100000000: return 'blue'; break
            case 100000001: return 'green'; break
            case 100000002: return 'yellow'; break
            case 100000003: return 'orange'; break
            case 100000004: return 'red'; break
            default: return 'grey';
        }
    }
    

    Этот код состоит из трех функций. Первая будет вызываться на онлоаде объект и будет путем манипуляций с DOM’ом вставлять на форму (в верхний колонтитул) рисунок из Веб-рисурса. Вторая функция будет менять рисунок при изменении пиклиста. Ну, а третья функция – вспомогательная – она будет определять текущий цвет, выбранный в пиклисте и возвращать его в первые две функции;

  • Подключите JS Веб-ресурс к форме нужного объекта. На onLoad этого же объекта повесьте вызов функции circle_build, а на событие onChange поля new_importance вызов функции circle_change.

Идем играться…




Комментарии (0)

*

code