Adding Combo Box through javascript

[Chris]

Hello,

I need to be able to add radcomboboxes to a web page dynamically through javascript upon the completion of an another event, is there a way to do this?  I need this because it will be possible to have an unlimited number of combo boxes on the screen depending on how many times an event is fired, so I cannot predefine the control as invisible and then make it visible when the other event is fired. 

Any help would be appreciated.

Thanks

[Yana]

Hello Chris,

Thank you for contacting us.

RadComboBox is a server control, so it can't be created in Javascript, only its items can be added at client-side as shown in the Add/Remove/Disable Items.

You may consider also using RadAjaxManager to create and add RadComboBox server-side by a client-side trigger. For example:

<asp:ScriptManager ID="ScriptManager1" runat="server">
    </asp:ScriptManager>
    <telerik:RadAjaxManager ID="RadAjaxManager1" runat="server" OnAjaxRequest="RadAjaxManager1_AjaxRequest">
        <AjaxSettings>
            <telerik:AjaxSetting AjaxControlID="RadAjaxManager1">
                <UpdatedControls>
                    <telerik:AjaxUpdatedControl ControlID="Button2" />
                </UpdatedControls>
            </telerik:AjaxSetting>
            <telerik:AjaxSetting AjaxControlID="Button2">
                <UpdatedControls>
                    <telerik:AjaxUpdatedControl ControlID="PlaceHolder1" />
                    <telerik:AjaxUpdatedControl ControlID="Button2" />
                </UpdatedControls>
            </telerik:AjaxSetting>
        </AjaxSettings>
    </telerik:RadAjaxManager>
    <telerik:RadCodeBlock ID="RadCodeBlock1" runat="server">

        <script type="text/javascript">
    function addCombo()
    {
       var ajaxManager = $find("<%= RadAjaxManager1.ClientID %>");
       ajaxManager.ajaxRequestWithTarget('<%= Button2.UniqueID %>', '');
    }
        </script>

    </telerik:RadCodeBlock>
    <asp:PlaceHolder ID="PlaceHolder1" runat="server"></asp:PlaceHolder>
    <asp:Button ID="Button2" style="margin-left:-500px" runat="server" Text="Button" OnClick="Button2_Click" />
    <input id="Button1" type="button" onclick="addCombo()"
        value="add combobobox from client event" />

protected void RadAjaxManager1_AjaxRequest(object sender, Telerik.Web.UI.AjaxRequestEventArgs e)
    {
    }
    protected void Button2_Click(object sender, EventArgs e)
    {
        RadComboBox combobox1 = new RadComboBox();
        RadComboBoxItem item1 = new RadComboBoxItem("item 1");
        combobox1.Items.Add(item1);
        PlaceHolder1.Controls.Add(combobox1);
    }

Best wishes,
Yana
the Telerik team

Instantly find answers to your questions at the new Telerik Support Center