Help with adding a link to a AJAX created datatable

smarthomes

I have the following code working. I now need to add a link to one of the cells. I have looked for examples and documentation and have not had any luck.

I need to add a link that wraps the second column.

The rendered result would look like: "<a href="getItem.cfm?id=" + id + ">" + column + "</a>"

Even getting pointed in the right direction would be helpful. Thanks in advance.

'''

jQuery(document).ready(function() {    

    var packageID = <cfoutput>"#decrypt(url.pid,application.encryptionKey,'AES','hex')#"</cfoutput>;

    $('#package_desc_short').summernote({height:300});  

    var selected_table = $('#selected_items').dataTable({
        "ajax": '/cfcs/db_items.cfc?method=getSelectedItems&pid=' + packageID,
        "columns": [{
            "visible": false,               
            "orderable": false,
        },{
            "orderable": true   
        }, {
            "orderable": true   
        }, {
            "orderable": true   
        }, {
            "orderable": true       
        }],
        "paging": false,
        "info": false,
        "searching": false
    });

    var unselected_table = $('#unselected_items').dataTable({
        "ajax": '/cfcs/db_items.cfc?method=getUnselectedItems&pid=' + packageID,
        "columns": [{
            "visible": false,
            "orderable": false,
            "searchable": false 
        },{
            "orderable": true,
            "searchable": true  
        }, {
            "orderable": true,
            "searchable": true          
        }, {
            "orderable": true,
            "searchable": false     
        }, {
            "orderable": true,
            "searchable": false         
        }]
    });

    unselected_table.on('click', 'tr' ,function() {

        var rowArray = unselected_table.api().row(this).data();
        var itemID = rowArray[0];

        $.ajax({
            type: "post",
            url: "/cfcs/db_items.cfc?method=insertItemToPackage",
            data: {
                "pid": packageID,
                "iid": itemID
            },
            success: function(){
                $('#item_package_message').html("Item added to package").show().delay(2000).fadeOut();
                selected_table.api().ajax.reload();
                selected_table.dataTable().api().draw();
            },
            error: function(){
                alert("Error");
            }
        });

    });

    selected_table.on('click', 'tr' ,function() {

        var rowArray = selected_table.api().row(this).data();
        var itemID = rowArray[0];

        $.ajax({
            type: "post",
            url: "/cfcs/db_items.cfc?method=deleteItemFromPackage",
            data: {
                "pid": packageID,
                "iid": itemID
            },
            success: function(){
                $('#item_package_message').html("Item removed from package").show().delay(2000).fadeOut();
                selected_table.api().ajax.reload();
                selected_table.dataTable().api().draw();                
            },
            error: function(){
                alert("Error");
            }
        }); 

    });

});

'''

tangerine

There's an example here:

https://datatables.net/reference/option/columns.render

smarthomes

Thank you very much.

This is what I did. Hopefully it is correct.

'''
jQuery(document).ready(function() {

    var selected_table = $('#selected_items').dataTable({
        "ajax": '/cfcs/db_items.cfc?method=getSelectedItems&pid=34',
        "columnDefs": [{
            "targets": 2,
            "render": function ( data, type, row, meta ) {
                var itemID = row[0];                    
                return '<a href="/cfcs/blah.cfc?item_id=' + itemID + '">' + data + '</a>';
            }
        }],         
        "columns": [{
            "visible": false,               
            "orderable": false,
        },{
            "orderable": true   
        }, {
            "orderable": true   
        }, {
            "orderable": true   
        }, {
            "orderable": true       
        }],
        "paging": false,
        "info": false,
        "searching": false
    });

});

'''