Datatables encode HTML

Question

I have used jQuery Datatables on my Laravel web apps. I have used packagist chumper/datatable to handle Datatables server processing.

Unfortunately, I found serious security problem, i.e. XSS (cross-site scripting). Server returns JSON data and Client loads the data to table without escaping them.

How can I get Client to escape the data before loading them into the table?

Answer 1

fnCreatedRow is a callback function for manipulating table row element after the row has been created. We can used this callback function to modify the row before the row will be inserted to HTML document.

I used chumper/datatable to generate this function:

$table = Datatable::table()
    ->addColumn('ID', 'Username', 'Name', 'Email', 'Actions')
    ->setUrl(URL::to('admin/users/data'))
    ->setOptions(array('aoColumns' => array(array('sType' => 'numeric'), null, null, null, array('bSortable' => false))))
    ->setCallbacks('fnCreatedRow', 
        'function(nRow, aData, iDisplayIndex, iDisplayIndexFull) {
            for (var i = 1; i < 4; i++) jQuery("td:eq(" + i + ")", nRow).text(aData[i]);
        }'
    )
    ->noScript();       
return View::make('admin.users.index', compact('table'));

I used fnCreatedRow to modify the content of each td elements so the td elements display the data as text (HTML encoded).