Search code examples
jqueryjquery-uiselect-menujquery-ui-selectmenu

jQuery UI's cloned selectmenu not working


I want to clone a div with different elements inside. One of those elements is a select converted to selectmenu. The cloning works fine, except that the new select is not clickeable and it's items cannot be displayed.

See this DEMO. Just click on the "clone" button and try to select the new selectmenu.

What would be a clean way to make this work?


Solution

  • my solution to destroy selectmenu (Removes the selectmenu functionality completely. This will return the element back to its pre-init state.)

    so your code will be

    $("select").selectmenu();
    
    $("#btnClone").click(function()
    {
        $( "select" ).selectmenu( "destroy" );
        $(".content:first").clone().appendTo(".container");
        $("select").selectmenu();
    
    });
    

    DEMO

    may be there are another solutions .. but till now thats what I reached so far