HTML5 datalist tag is not populating in Safari

Question

I have a datalist tag which allows my users to have a suggestion box. However, I\'ve noticed that this feature is not supported in safari. Is there a workaround to this issu

Answer 1

Further to what Mianto said regarding iamse7en's issue, in order to bind your datalist to a dynamic DIV (the example Mianto gave and then Moritz edited is hard-coded), change the following at line 51:

function convert(input, datalist, listItems) {
    var fakeList = document.createElement('ul');
    var visibleItems = null;
    fakeList.id = listId;
    fakeList.className = LIST_CLASS;
    document.body.appendChild( fakeList );

to:

function convert(input, datalist, listItems) {
    var fakeList = document.createElement('ul');
    var visibleItems = null;
    fakeList.id = listId;
    fakeList.className = LIST_CLASS;
    input.parentNode.style.position = "relative";
    input.parentNode.appendChild( fakeList );