Problem Ajaxifying Labels

11 posts, 0 answers
  1. Geoff Van Brunt
    Geoff Van Brunt avatar
    41 posts
    Member since:
    Jan 2006

    Posted 04 May 2007 Link to this post

    I have a couple of labels on the page that I need to update periodically via Ajax. When RadAjaxManager is used to included them in an Ajax call, they are wrapped in a div. Once this happens the layout of the page is broken as they were originally spans. <edit>I'm guessing this has to do with them being wrapped with UpdatePanels, but how do I work around this?</edit> I guess I can wrap them in a panel to fix this. (slaps forhead).

    Not only that, if they are configured to be updated by multiple controls, they will be wrapped by more than one div with the same id. Is this the correct behaviour?
  2. surfer
    surfer avatar
    585 posts
    Member since:
    Jul 2003

    Posted 05 May 2007 Link to this post

    This is indeed related to UpdatePanel - it renders div tags which are typically block elements and place their child contents in a new row. This may screw up design in certain situations. That is why there is a RenderMode property in asp:UpdatePanel, e.g.

                <asp:UpdatePanel runat="server" ID="UpdatePanel1" RenderMode="Inline"
                    <ContentTemplate> 
                        <asp:Button runat="server" ID="Button1" Text="CallBack" /> 
                    </ContentTemplate> 
                </asp:UpdatePanel> 

    RenderMode Inline resolves the problem. I am not sure how this very same approach is possible with RadAjaxManager - I see no RenderMode property for RadAjaxManager / Panel... maybe there is a need for such a property that will propagate to all UpdatePanels RadAjaxManager creates? Or there is another way?
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. surfer
    surfer avatar
    585 posts
    Member since:
    Jul 2003

    Posted 05 May 2007 Link to this post

    Just a quick example of the scenario above - the following declaration

    <asp:UpdatePanel runat="server" ID="UpdatePanel1" RenderMode="Inline"
        <ContentTemplate> 
        <asp:Button runat="server" ID="Button1" Text="CallBack" /> 
        </ContentTemplate> 
    </asp:UpdatePanel> 
         
    <telerik:RadAjaxManager ID="RadAjaxManager1" runat="server" > 
        <AjaxSettings> 
        <telerik:AjaxSetting AjaxControlID="Button2"
            <UpdatedControls> 
            <telerik:AjaxUpdatedControl ControlID="Button2" /> 
            </UpdatedControls> 
        </telerik:AjaxSetting> 
        </AjaxSettings> 
    </telerik:RadAjaxManager> 
     
    <asp:Button runat="server" ID="Button2" Text="CallBack" /> 

    Renders the following markup:

     
     
     
     
    <span id="UpdatePanel1"
        <input type="submit" name="Button1" value="CallBack" id="Button1" /> 
    </span> 
                 
    <div id="RadAjaxManager1SU"
        <span id="RadAjaxManager1" style="display:none;"></span> 
    </div> 
             
    <div id="Button2Panel"
        <input type="button" name="Button2" value="CallBack" onclick="javascript:__doPostBack('Button2','')" id="Button2" /> 
    </div> 

    In the built-in UpdatePanel ajaxification, the button is wrapped inside a <span> which preserves the layout (because of the RenderMode = "Inline" setting).

    With RadAjaxManager, this becomes <div> (per the default RenderMode = "Block") and since this is a block element, it can screw up design.



  5. Geoff Van Brunt
    Geoff Van Brunt avatar
    41 posts
    Member since:
    Jan 2006

    Posted 05 May 2007 Link to this post

    Ah, now I seem to remember this. I played around with Atlas "way back when" the first Alpha came out. It seemed like every release broke my projects (at least with Infragistics controls) so I switched to Telerik both because of WAY better support and their RadAjax. Now I forget almost everything to do with ASP.Net Ajax... :)

    At any rate, perhaps a better question is why doesn't RadAjaxManager default to displaying them all as inline elements? I mean you want to "drop it in" and not affect the flow of the controls just like the older "non-Promethus" version. Or is their some reason why div's are preferred to spans? Perhaps what is needed is a global setting on RadAjaxManager to render them as inline or as block elements. For that matter, they could also drop in the same setting for the "updated controls" then you could turn it off or on per control.

    What do you think?

    Also getting back to my original post, I also think there is a bug as it wraps controls that are the "target" of more than one Ajax update in multiple divs with the same name... That isn't right is it?
  6. surfer
    surfer avatar
    585 posts
    Member since:
    Jul 2003

    Posted 05 May 2007 Link to this post

    I would also prefer <span>'s since this will interfere less with page layout, however the problem is that Microsoft chose <div> block element as default for reasons I am not aware of (but maybe they have a good reason after all). It will be a bit awkward if RadAjaxManager's default setting differs from the default settings of UpdatePanel... A RenderMode enum for RadAjaxManager with default setting the same as the default for UpdatePanel seems like a good idea.

    The second issue... I really have no idea. Maybe the extra div's are needed for something, can't really tell what for at this point...
  7. Christopher Blickley
    Christopher Blickley avatar
    202 posts
    Member since:
    Jan 2004

    Posted 04 Oct 2007 Link to this post

    Has there been any more discussion of this issue?  When I ajaxify controls like labels, they always seem to get a blank line rendered before them after an ajax postback using RadAjaxManager.  I wonder if this is related to this at all. 

    -Chris
  8. Christopher Blickley
    Christopher Blickley avatar
    202 posts
    Member since:
    Jan 2004

    Posted 04 Oct 2007 Link to this post

    Hello,

    Actually, now that I think about, this scenario may be related too.  I have two RadComboBoxes side by side on a page like this, with text in front of each one, then a panel with lots of data that is loaded depending of what is selected int he comboboxes:

    Type:  <RadComboBox1>    Term:  <RadComboBox2>
    <asp:Panel>

    I am using RadAjax to update the second combobox and the panel when the first combobox is changed.  This works fine, however, when I secify that RadComboBox should updated by an ajax call, it suddenly jumps down to the next line like this:

    Type:  <RadComboBox1>    Term: 
    <RadComboBox2>
    <asp:Panel>

    If I don't define RadComboBox2 as control to be udpated in RadAjaxManger, everything is fine.

    As a way around this, I wrapped everything above in a <asp:panel> and then just update everything instead.  This works fine and it makes me think is related to the <div> vs <span> issue talked about in this thread.  I didn't have a chance to check the output yet, but this change occured when I moved from the old RadAjax to the Promethius version, so maybe this explains it.

    It is not a big deal to me right now since I found a way around it, but there may be scenarios where this may not work out as well.  It would also be much better to just update the RadComboBox instead of having to update more than necessary by wrapping it in a <asp:Panel>

    Is there any way around this right now?

    -Chris
  9. Steve
    Admin
    Steve avatar
    10941 posts

    Posted 05 Oct 2007 Link to this post

    Hi Christopher,

    We are already considering a RenderMode property for the AjaxManager with default value Block as MS AJAX. For the time being you can change the Render when using AjaxManager by hooking up to the AjaxSettingCreating like this:

     protected void RadAjaxManager1_AjaxSettingCreating(object sender, Telerik.Web.UI.RadAjaxControl.AjaxSettingCreatingEventArgs e)
        {
            e.UpdatePanel.RenderMode = UpdatePanelRenderMode.Inline;
        }


    Hope this helps.

    Kind regards,
    Steve
    the Telerik team

    Instantly find answers to your questions at the new Telerik Support Center
  10. Grisha
    Grisha avatar
    8 posts
    Member since:
    Sep 2007

    Posted 09 Nov 2007 Link to this post

    Thanks for solution, Steve. Was battling with this thing all day.
  11. E
    E avatar
    1 posts
    Member since:
    Jul 2013

    Posted 09 Aug 2013 Link to this post

    I have the same problem, I tried your suggestion but still persists the problem. My panel is in a master page, do I have to do something different? 

    <telerik:RadAjaxManager ID="AjaxManagerProxy" runat="server" UpdatePanelRenderMode="Inline">
    <AjaxSettings>
    <telerik:AjaxSetting AjaxControlID="NIT_NOG">// this is a radtextbox
                            <UpdatedControls>
                                <telerik:AjaxUpdatedControl ControlID="PanelProveedor" UpdatePanelRenderMode="Inline"/>//this is an asp:panel
                            </UpdatedControls>
    </telerik:AjaxSetting>
    </AjaxSettings>
    </telerik:RadAjaxManager>
  12. Maria Ilieva
    Admin
    Maria Ilieva avatar
    4017 posts

    Posted 13 Aug 2013 Link to this post

    Hello,

    You should set the "UpdatePanelsRenderMode" property in the main RadAjaxManager no matter if it is on the Master or in the Content Page. Do let us know if you are facing any issue in setting this property and if further assistance is needed.

    Regards,
    Maria Ilieva
    Telerik
    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to the blog feed now.
Back to Top
UI for ASP.NET Ajax is Ready for VS 2017