Табулятор - как создать многострочный текст в форматере: «ссылка»

Question

Я использую http://tabulator.info и хочу иметь ссылку html в ячейке таблицы. Я использую formatter:"link" и все работает:

{title:"Reference", field:"ref", headerSort:false, formatter:"link",  variableHeight:true, formatterParams:{labelField:"name", target:"_blank", urlField:"link",  urlPrefix:"articles/"}, width:"185"},

Но текст из labelField не является многострочным, как это возможно при formatter:"textarea". Можно ли иметь многострочный текст ссылки html?

Спасибо, Вадим

Answer 1

большое спасибо за ответ, но кажется, что я не настолько силен, чтобы делать это с помощью пользовательских форматеров ... Итак, я нашел это: Разрыв строки и это:

 .tabulator-row .tabulator-cell a {
        white-space: pre-wrap;
    }

работает. Еще раз спасибо!

Answer 2

Я успешно использовал Custom Formaters для создания многострочных строк. Суть в том, что пользовательский форматер вызывается при поступлении данных в таблицу, причем ячейка передается как параметр. Вы можете извлечь данные ячейки из этого (cell.getValue()) и манипулировать ими, как вам нужно. По крайней мере, это то, что я делаю, чтобы добавить Font Awesome иконки в различные строки на основе содержащихся данных. Я использую Handlebars для форматирования фрагмента HTML и возвращаю, что когда вызывается пользовательская функция форматера

В любом случае, я не уверен, что понимаю, что вам нужно сделать, но, возможно, это поможет.

---

let eventTableItemMediaScript = `
<div>{{eventTitle}}</div>
<div class="d-flex justify-content-between mr-1">
<small>
{{eventDate}}
</small>
<i class="{{iconName}}" style="color:{{iconColor}}"></i>
</div>
`
let eventTableItemMediaTemplate = Handlebars.compile(eventTableItemMediaScript);

---

Из документов

{title:"Name", field:"name", formatter:function(cell, formatterParams, onRendered){
    //cell - the cell component
    //formatterParams - parameters set for the column
    //onRendered - function to call when the formatter has been rendered

    return "Mr" + cell.getValue(); //return the contents of the cell;
    },
}