How do you add hyperlinks to column values?

siddhantjm

How do you add hyperlinks to column values in the datatable.
Values are printed using Javascript.

rf1234

here is an example: files are being rendered as hyperlinks with icons in one column

define the column in columns data. the column uses a row of my table "file" which contains various attributes including the files system and web paths.

....
columns: [
{data: null,
            render: function (data, type, row) {
                return renderFilesDataTable(row.file);
            }
        },
....
],

render the column using these functions that use a couple of font awesome icons and specify the path of the files. that's all.

function renderFilesDataTable(rowFile) {
    var ix=0;
    var returnString = '';
    var fileName; var fileNameShort;
    var fileExtension;
    var n;
    var iconField;
    while (rowFile[ix]) {
        if (ix !== 0) {
            returnString = returnString.concat('<br>');
        }
        n = rowFile[ix].name.lastIndexOf("."); 
        fileExtension = rowFile[ix].name.substring(n+1);
        iconField = getIconFieldforFiles(fileExtension, '');
        fileName = rowFile[ix].name.substring(0, n);
        if (fileName.length > 11) {
            fileNameShort = fileName.substring(0, 11) + '...';
        }
    //interface files infoma, Sap, Datev are displayed differently!
        if ( rowFile[ix].name === 'interface.txt') {            
            returnString = returnString.concat
                    (iconField + ' ' + "<a href="+rowFile[ix].web_path+
                        " download='Schnittstelle'>Download Schnittstelle</a>");
        } else {
//            returnString = returnString.concat
//                    (iconField + ' ' + fileNameShort.link(rowFile[ix].web_path));
            returnString = returnString.concat
                    (iconField + ' ' + "<a href="+rowFile[ix].web_path+
                        " download="+fileName+">"+fileNameShort+"</a>");
        }
        ix++; 
    }
    return returnString;
}

function getIconFieldforFiles(fileExtension, size) {
    fileExtension = fileExtension.toLowerCase();
    var iconField = '';
    if ( fileExtension == 'pdf' ) {
        iconField = "<i class='fa fa-file-pdf-o " + size + "' aria-hidden='true'></i>";                   
    } else {
        if ( fileExtension == 'xls'     || 
             fileExtension == 'xlsx'    ||
             fileExtension == 'ods'     ||
             fileExtension == 'csv'      ) {
            iconField = "<i class='fa fa-file-excel-o " + size + "' aria-hidden='true'></i>";
        } else {
            if ( fileExtension == 'doc'     ||
                 fileExtension == 'docx'    ||
                 fileExtension == 'rtf'     ||
                 fileExtension == 'odt'     ) {
                iconField = "<i class='fa fa-file-word-o " + size + "' aria-hidden='true'></i>";
            } else {
                if ( fileExtension == 'ppt'     ||
                     fileExtension == 'pptx'    ||
                     fileExtension == 'odp'    ) {
                    iconField = "<i class='fa fa-file-powerpoint-o " + size + "' aria-hidden='true'></i>";    
                } else {
                    if ( fileExtension == 'txt' ) {
                        iconField = "<i class='fa fa-cloud-download " + size + "' aria-hidden='true'></i>";
                    }
                }
            }
        }
    }    
    return iconField;
}

siddhantjm

I just want simple hyperlinks to the data present the columns.

rf1234

what is rendered in function renderFilesDataTable are simple hyperlinks to the data presented in the column. Those data are files in my case.

allan

render: function ( data, type, row ) {
  return '<a href="...">'+data+'</a>';
}

is a simplified example. See also the columns.render documentation.

Allan