GGLP

Как сделать кликабельной ссылку в текстовом поле

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

Например, надо сделать кликабельной ссылку на собрание в zoom.

Задача

Кликабельная ссылка в текстовом поле

Решение

1. Добавить поле на карточку через мастер раздела. Для примера пусть это будет поле gglpZoomLink
2. Добавить следующий код в блок кода values нашего поля:
   "showValueAsLink": true,
"href": {
    "bindTo": "UsrUrlFieldName",
    "bindConfig": {"converter": "getLinkFormat"}
},
"controlConfig": {
    "className": "Terrasoft.TextEdit",
    "linkclick": { bindTo: "onLinkClick"}
}
3. Добавить следующий код в блок кода methods:
   getLinkFormat: function(value) {
    return {
        "url": value,
        "caption": value
    };
},
 
onLinkClick: function(url) {
    var link = document.createElement("a");
    link.href = url;
    link.target = "_blank";
    document.body.appendChild(link);
    link.click();
    document.body.removeChild(link);
    return false;
}

Объяснение

Итоговый вид кода страницы получился примерно такой:

Из метода getLinkFormat возвращаются значения двух переменных (можно задавать отдельно ссылку и текст ссылки), но мы используем ссылку для отображения без преобразований.

В методе onLinkClick использовано динамическое формирование элемента <a>, чтобы избежать блокировки всплывающих окон браузером.

Что интересно, если указывать ссылку без протокола (https://), она будет отображаться как относительная, добавляя в начале адрес приложения.

Оригинал решения: How to Format a URL as a Clickable Link in a Text Field in Creatio

Обсудить в Telegram

• Creatio
• TextField
• Link
• Page

• Назад
• Вперед