Creating Telerik Dropdown control dynamically

[Prashant]

Hi, I am using MVC 3 and trying to create telerik Dropdown control dynamically through JQuery or Javascript at runtime on link button click .Please guide me.Thanks in advance.

[Petur Subev]

Hello Prashant,

Such functionality is not supported. Neverthless, if you have included all the needed scripts you can render the needed HTML and then call our initialization function.
e.g.
HTML:

<div class="t-widget t-dropdown t-header" style="width:200px" tabindex="0">
        <div class="t-dropdown-wrap t-state-default">
            <span class="t-input">Chai</span>
            <span class="t-select">
                <span class="t-icon t-arrow-down">select</span>
            </span>
        </div>
        <input id="DropDownList" name="DropDownList" style="display:none" type="text" value="1">
</div>

the init function:

$('#DropDownList').tDropDownList({
                    data: [{
                        "Text": "Chai",
                        "Value": "1"
                    },
                    {
                        "Text": "Chang",
                        "Value": "2"
                    },
                    {
                        "Text": "Aniseed Syrup",
                        "Value": "3"
                    },
                    {
                        "Text": "Original Frankfurter grüne Soße",
                        "Value": "77"
                    }]
                })

Kind regards,
Petur Subev
the Telerik team

[Gerard]

I had the same problem, and your code works fine, thanks. However, I have an issue when I apply the tDropDownList method on an element that I cloned with the jQuery clone method. In the previous example, I would clone the containing div, and then change the id and name properties of the hiddent input. There is no error, but the list is not filled. Would you have any suggestion? It seems that some initialization is missing.

Thanks

Update: please ignore, it works: I had a typo in my code!