Home > Software engineering >  How to sort accented words using DataTables plugin
How to sort accented words using DataTables plugin

Time:11-24

Am using DataTable plugin, i need to sort my table which contains accented words.

The code i made sorts just the second column with targets: 1 , i didn't find how to do that to all columns. This is the plugin doc : https://datatables.net/plug-ins/sorting/

<link href="https://cdn.datatables.net/1.11.3/css/jquery.dataTables.css" rel="stylesheet"/>
 <table class="display" id="cc-table" aria-describedby="cc-table_info">
    <thead>
        <tr>
            <th >
                <p> Civilité </p>
            </th>
            <th >
                <p> Nom du parrain </p>
            </th>
            <th >
                <p>Prénom du parrain </p>
            </th>
            <th >
                <p> Mandat du parrain </p>
            </th>
            <th >
                <p> Commune ou circonscription </p>
            </th>
            <th >
                <p> Département </p>
            </th>
            <th >
                <p> Candidat </p>
            </th>
            <th >
                <p> Date de publication </p>
            </th>
        </tr>
    </thead>
    <tbody>
        <tr class="odd">
            <td class="sorting_1">M.</td>
            <td>BERNARD-PHILIBERT</td>
            <td>Olivier</td>
            <td>Maire délégué d'une commune associée ou d'une commune déléguée</td>
            <td>Nivigne et Suran</td>
            <td>Ain</td>
            <td>ARTHAUD Nathalie</td>
            <td>08/09/2021</td>
        </tr>
        <tr class="even">
            <td class="sorting_1">M.</td>
            <td>éTÉVÉ</td>
            <td>Romain</td>
            <td>Maire</td>
            <td>Maranwez</td>
            <td>Ardennes</td>
            <td>ARTHAUD Nathalie</td>
            <td>08/09/2021</td>
        </tr>
        <tr class="odd">
            <td class="sorting_1">M.</td>
            <td>DONZÉ</td>
            <td>Éric</td>
            <td>Maire</td>
            <td>Montoulieu</td>
            <td>Ariège</td>
            <td>ARTHAUD Nathalie</td>
            <td>08/09/2021</td>
        </tr>
        <tr class="even">
            <td class="sorting_1">M.</td>
            <td>ÉPINAT</td>
            <td>Pascal</td>
            <td>Maire</td>
            <td>Pélissanne</td>
            <td>Bouches-du-Rhône</td>
            <td>ARTHAUD Nathalie</td>
            <td>08/09/2021</td>
        </tr>
        <tr class="odd">
            <td class="sorting_1">M.</td>
            <td>CHEVALIER</td>
            <td>Gilbert</td>
            <td>Maire</td>
            <td>Tanavelle</td>
            <td>Cantal</td>
            <td>ARTHAUD Nathalie</td>
            <td>08/09/2021</td>
        </tr>
        <tr class="even">
            <td class="sorting_1">M.</td>
            <td>ÉLIE</td>
            <td>Daniel</td>
            <td>Maire</td>
            <td>Chaveroche</td>
            <td>Corrèze</td>
            <td>ARTHAUD Nathalie</td>
            <td>08/09/2021</td>
        </tr>
        <tr class="odd">
            <td class="sorting_1">M.</td>
            <td>MELONI</td>
            <td>Salvatore</td>
            <td>Maire</td>
            <td>Grosbois-en-Montagne</td>
            <td>Côte-d'Or</td>
            <td>ARTHAUD Nathalie</td>
            <td>08/09/2021</td>
        </tr>
        <tr class="even">
            <td class="sorting_1">M.</td>
            <td>CARLIER</td>
            <td>Michel</td>
            <td>Maire</td>
            <td>Lansargues</td>
            <td>Hérault</td>
            <td>ARTHAUD Nathalie</td>
            <td>08/09/2021</td>
        </tr>
        <tr class="odd">
            <td class="sorting_1">M.</td>
            <td>AUGIAS</td>
            <td>Franck</td>
            <td>Maire</td>
            <td>Chisseaux</td>
            <td>Indre-et-Loire</td>
            <td>ARTHAUD Nathalie</td>
            <td>08/09/2021</td>
        </tr>
        <tr class="even">
            <td class="sorting_1">M.</td>
            <td>GROS</td>
            <td>Stéphane</td>
            <td>Maire</td>
            <td>Bellecombe</td>
            <td>Jura</td>
            <td>ARTHAUD Nathalie</td>
            <td>08/09/2021</td>
        </tr>
    </tbody>
</table>


 
 <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
 <script type="text/javascript" charset="utf8" src="https://cdn.datatables.net/1.11.3/js/jquery.dataTables.js" defer></script>
 <script type="text/javascript" charset="utf8" src="https://cdn.datatables.net/plug-ins/1.11.3/sorting/diacritics-sort.js" defer></script>
 <script type="text/javascript">
     $(document).ready(function () {
            $('#cc-table').DataTable({
            responsive: true,
            columnDefs: [
            { targets: 1, type: 'diacritics-neutralise'}
        ]
      });
     });
 </script>
<iframe name="sif1" sandbox="allow-forms allow-modals allow-scripts" frameborder="0"></iframe>

CodePudding user response:

You can use targets: "_all" - see the documentation for the columnDefs.targets option.

  • Related