Additional script doesn't work on paginated tables from table page 2 onwards

joe_ma

Hello

I use data tables to paginate and filter addresses that are displayed as table rows.

In addition I also use an script to obfuscate email addresses in this list.

Both of these scripts are called from the bottom of the page, the latter one as the last script just before the </body> tag.

My problem: the email obfuscating script only works on the first page of the paginated table. From page 2 onwards, email addresses appear obfuscated and are no more resolved by this script.

I have tried to call the email obfuscating script with drawCallback, but this resulted in the table not being paginated at all.

These are the options settings:

        $("#myTable").DataTable( {          
        paging:   true,
        lengthChange: false,
        pageLength: 5,
        pagingType: "simple_numbers",
        info: false,
        responsive: true,
        language: {
                search: "_INPUT_",
                zeroRecords:    "Ihre Suche ergab kein Resultat<br>Votre recherche n'a pas reçu des resultats",
                searchPlaceholder: "Tabelle filtern nach … / filtrer le tableau pour …",
                paginate: {
                    previous: '‹',
                    next:     '›'
                 },
        aria: {
            paginate: {
                previous: 'Previous',
                next:     'Next'
            }
        }
         }
        });

Thanks for your help.

kthorngren

Not sure what is in your code but could the second FAQ here be your issue?

Kevin

joe_ma

Thanks Kevin for your answer.
I am not sure, whether this answers my question. I frankly don't exactly understand what I should do with this jQuery "on" method. I am no specialist for javascript by far.

But I don't think that this script to resolve the email addresses has anything to do with events attached to table cells. It simply looks for obfuscated email addresses anywhere in the html and resolves them.

This is the code of this script:

$(function() {
    // restore mailto: links
    $("a[href^='GOSPAM:']").each(function(){
        var email = $(this).attr("href").substr(7);
        // replace email with its reversed version
        email = email.split("").reverse().join("");
        // replace "GOSPAM:" with "mailto:"
        $(this).attr("href","mailto:" + email);         
    }); 
    
    $(".email-obfuscator-unreverse").each(function() {
        $(this).replaceWith($(this).text().split("").reverse().join(""));
    });
});

You can see it in action here.

Note that on the first table page, emails are resolved, whereas on any other table page they remain obfuscated.

kthorngren

I think it would be best to put the script into drawCallback. If you add rows to the table the script might not affect the new rows. If the pagination is broken when using drawCallback then you are probably getting a Javascript error which can be seen on the browsers console.

See if this works:

drawCallback: function() {
    // restore mailto: links
    $("a[href^='GOSPAM:']").each(function(){
        var email = $(this).attr("href").substr(7);
        // replace email with its reversed version
        email = email.split("").reverse().join("");
        // replace "GOSPAM:" with "mailto:"
        $(this).attr("href","mailto:" + email);         
    }); 
    
    $(".email-obfuscator-unreverse").each(function() {
        $(this).replaceWith($(this).text().split("").reverse().join(""));
    });
}

Kevin

joe_ma

Great!!

Thank you very much, Kevin. Everything is fine now.

Pagination was broken the first time because of a missing comma.

Jörg