Dynamically ajaxify button.

[JC]

Hi

There is a radgrid in my aspx page and it contains an image button. I want to dynamically ajaxify the button. Can anyone help with an example?

Thanks
JC

[Shinu]

Hi JC,

Please have a look at the following C# code snippet.

C#:

protected void RadGrid1_ItemCreated(object sender, Telerik.Web.UI.GridItemEventArgs e)
{
    if (e.Item is GridDataItem)
    {
        GridDataItem dataItem = e.Item as GridDataItem;
        ImageButton ibtnAddToCart = (ImageButton)(dataItem["TemplateColumn1"]).FindControl("ibtnAddToCart");
        RadAjaxManager1.AjaxSettings.AddAjaxSetting(ibtnAddToCart, RadGrid1); //ajaxify the button
    }
}

Thanks,
Shinu.

[Saif]

I tried the above example but its not working for me. Someone help me out to resolve this.

Markup:

<telerik:RadAjaxManager runat="server" ID="RadAjaxManager1" OnAjaxRequest="RadAjaxManager1_AjaxRequest">
           <AjaxSettings>
               <telerik:AjaxSetting AjaxControlID="rbtnAddControl">
                   <UpdatedControls>
                       <telerik:AjaxUpdatedControl ControlID="wizardControl" />
                   </UpdatedControls>
               </telerik:AjaxSetting>
           </AjaxSettings>
           <AjaxSettings>
               <telerik:AjaxSetting AjaxControlID="wizardControl">
                   <UpdatedControls>
                       <telerik:AjaxUpdatedControl ControlID="RadButton1" />
                         <telerik:AjaxUpdatedControl ControlID="rbtnAddControl" />
                   </UpdatedControls>
               </telerik:AjaxSetting>
           </AjaxSettings>

       </telerik:RadAjaxManager>
       <div>
           <table>
               <tr>
                   <td>
                       <telerik:RadButton ID="rbtnAddControl" runat="server" RenderMode="Lightweight" Text="AddControl" OnClick="rbtnAddControl_Click">
                       </telerik:RadButton>
                   </td>
               </tr>
               <tr>
                   <td>
                       <telerik:RadButton ID="RadButton1" runat="server" RenderMode="Lightweight" Text="doPostBack" OnClick="RadButton1_Click">
                       </telerik:RadButton>
                   </td>
               </tr>
           </table>
           <telerik:RadWizard runat="server" RenderMode="Lightweight" ID="wizardControl"
               DisplayProgressBar="false" ProgressBarPosition="Right" NavigationBarPosition="Right"
               NavigationButtonsPosition="Bottom" DisplayNavigationButtons="false">
           </telerik:RadWizard>

CodeBehind:

protected void Page_Load(object sender, EventArgs e)
       {
           RadAjaxManager radmanager = RadAjaxManager.GetCurrent(Page);
           AjaxSetting ajaxSetting1 = new AjaxSetting(wizardControl.ID);
           RadAjaxManager1.AjaxSettings.Add(ajaxSetting1);
       }

       protected void rbtnAddControl_Click(object sender, EventArgs e)
       {
           RadWizardStep step;

           //Creating step1
           step = new RadWizardStep();
           step.ClientIDMode = ClientIDMode.Static;
           step.ID = "step_1";

           //RadTextBox
           RadTextBox rtxtbox = new RadTextBox();
           rtxtbox.Text = "RadTextBox1";

           RadButton rbtnClick = new RadButton();
           rbtnClick.Text = "OnClickEvent";
           rbtnClick.ClientIDMode = ClientIDMode.Static;
           rbtnClick.ID = "button1";
           rbtnClick.Click += new EventHandler(radButton_click);
           RadAjaxManager1.AjaxSettings.AddAjaxSetting(wizardControl, rbtnClick);

           step.Controls.Add(rtxtbox);
           step.Controls.Add(rbtnClick);
           wizardControl.WizardSteps.Add(step);

           //Step2 for demo
           step = new RadWizardStep();
           step.ClientIDMode = ClientIDMode.Static;
           step.ID = "step_2";

           RadTextBox rtxtbox1 = new RadTextBox();
           rtxtbox1.Text = "RadTextBox2";
           step.Controls.Add(rtxtbox1);
           wizardControl.WizardSteps.Add(step);
       }

[Rumen]

Hi,

Please follow the details in the documentation Add AjaxSettings Programmatically:

ASPX:

<telerik:RadAjaxManager ID="RadAjaxManager1" runat="server">
</telerik:RadAjaxManager>
 <asp:Button ID="Button1" runat="server" Text="Button" OnClick="Button1_Click" />
 <asp:Panel ID="Panel1" runat="server" Height="95px">
            <asp:Image ID="Image1" runat="server" ImageUrl="http://www.Telerik.com/images/Homepage/TelerikLogo.gif" />
</asp:Panel>

Codebehind

     protected void Page_Load(object sender, EventArgs e)
    {
       RadAjaxManager1.AjaxSettings.AddAjaxSetting(Button1, Panel1, null);
       //where the AddAjaxSettings() methods has the below overloads
       //public void AddAjaxSetting(Control ajaxifiedControl, Control updatedControl)
       //public void AddAjaxSetting(Control ajaxifiedControl, Control updatedControl, RadAjaxLoadingPanel loadingPanel)
       //public void AddAjaxSetting(Control ajaxifiedControl, Control updatedControl, RadAjaxLoadingPanel loadingPanel, UpdatePanelRenderMode renderMode)
       //public void AddAjaxSetting(Control ajaxifiedControl, Control updatedControl, RadAjaxLoadingPanel loadingPanel, UpdatePanelRenderMode renderMode, Unit updatePanelHeight)
    }

     protected void Button1_Click(object sender, EventArgs e)
    {
        Image1.Visible = !Image1.Visible;
    }

Regards,
Rumen
Progress Telerik