[Solved] To Dynamically add RadToolBarButton to RadToolBar control

[Kwaku]

I have a scenario where I would like to dynamically add RadToolBarButton control to R.adToolBar. The HTML and the Javascript are as follows:

HTML:
---------
<telerik:RadToolBar runat="server" ID="RadToolBar2" Width="100%" OnClientButtonClicked="onButtonClicked" >
 <Items>
 </Items>
</telerik:RadToolBar>

Javascript to insert RadToolBarButton control to RadToolBar2:
Initially, a request is made to Controller/Action to determine if button
needs be added. What is failing is the line:
 toolBar.Items.Insert(0, radButton);
It indicates that Items is not defined.
-----------------------------------------------------------------------
// Send a GET Request to Controller/Action
if ('<%=Model.RequestForInfo)%>' == 'True') {
 $.get("/Home/EmployeeInfo", { employeeId: id,
        idType: '<%= Model.TypeId%>'
 },
        function (data) {
           var radButton;
           var toolBar = '<%=RadToolBar2.ClientID%>';

           if (data.IsOk) {
                radButton = new Telerik.Web.UI.RadToolBarButton();
                radButton.Text = "Approve";
                radButton.ToolTip = "Select to approve .";
                toolBar.Items.Insert(0, radButton);
           }
        },
        'json');
}  

Any help will be greatly appreciated.

[Yana]

Hi Kwaku,

You should use $find method to get the client-side object of the toolbar as demonstrated here.

Regards,
Yana
the Telerik team