Accorciare i testi troppo lunghi sulle tabelle datatables jquery
Datatables è uno dei più pratici e versatili plugin per JQuery Javascript, oltre ad essere uno strumento Open Source quindi completamente gratuito è in continuo miglioramento il che lo rende uno strumento altamente flessibile e versatile completo di molte funzionalità avanzate per qualsiasi tabella HTML.
In questo articolo vediamo come poter accorciare un testo troppo lungo presente in un campo della tabella, questa funzione mi è stata utile diverse volte per rappresentare delle stringhe con lunghezze variabili che finivano a capo “rovinando” il risultato grafico della pagina.
Uno degli esempi più semplici è quello di questa tabella HTML dove vogliamo andare a ridurre il testo della prima colonna quando è superiore ai dieci caratteri:
"columnDefs": [ { targets: 0,
render: function ( data, type, row ) {
return data.length > 10 ?
data.substr( 0, 10 ) +'…' :
data;
}
}]
Il risultato è il seguente:
In pratica nelle opzioni della colonna (columnDefs) è stata inserita una funzione che restituisce un testo accorciato se il numero dei caratteri del campo è maggiore a dieci.
Il metodo substr viene utilizzato per accorciare il testo della stringa del primo campo della tabella e vengono aggiunti i tre puntini (…) alla fine per far capire che il testo è stato accorciato.
Se ti interessano altri esempi per accorciare i campi delle tabelle dataTables nel link: https://datatables.net/blog/2016-02-26 puoi trovare altri esempi con anche un plugin specifico per questa funzionalità molto utile per rappresentare i testi nelle vostre pagine HTML.
Fonti:
https://datatables.net/blog/2016-02-26: Articolo originale in inglese con diversi esempi per gestire le stringhe troppo lunghe rappresentate nelle tabelle dataTables.
https://www.w3schools.com/jsref/jsref_substr.asp: Spiegazione in dettaglio sul metodo substr() dal sito w3school.com con diversi esempi.
Spero che questo articolo ti sia stato utile, se hai avuto problemi oppure vuoi approfondire meglio qualche particolare scrivimi un commento o condividi l’articolo con persone che potrebbero trovarlo utile.
GRAZIE!!!
