YUI 3 rendering dropdown in a column on a datatable

Question

I am trying to customize one of the column into a dropdown. It is a json response and the response for the column that I want to customize it into a dropdown list is an array. I am able to create a string into select and option tags but on the Data table it is exactly showing as a string and not as a dropdown. I dont know what am I missing.

The code snippet for my dropdown formatter looks like this :-

var columns =[
    {
        key:'Form Name',
    },
    {
        key:'Form Number',
    },
    {
        key:'Prefix',
    },
    {
        key:'Suffix',
        id:"suffixColumn",
        formatter: function(o){
            console.log(o);
            var suffixArr = o.data.Suffix;
            var mySelect = '<select>';
            for (var count = 0; count < (suffixArr.length); count++) {
                mySelect += "<option value=\"" + count + "\">" + suffixArr[count] + "</option>";
            }
            mySelect+= '</select>';
            console.log(mySelect);
            return(mySelect) ;
        }
    }                                                  
];

Answer 1

Add allowHTML: true to the column attributes to tell the DataTable not to escape the special characters and simply let them through as HTML.