radConfirm button width

5 posts, 0 answers
  1. Steven Black
    Steven Black avatar
    44 posts
    Member since:
    Feb 2008

    Posted 22 May 2010 Link to this post

    Hello,

    I would like to adjust the size of the radConfirm buttons (Ok/Cancel) so that they are the same width.  After reviewing the radWindow HTML, I overrode the innerspan class and added the appropriate width.  This seems to have done the trick perfectly.

    My question is this - a class name of "innerspan" seems very generic, and I'm wondering if any other radControls use this class name for anything else.  So far my application seems to be fine, but I want to make sure I'm not messing up anything else by making this change.  Is there a more appropriate solution for modifying the button widths of the radConfirm?  This way seems very simple.

    Thanks.

    Steve
  2.
  3. Shinu
    Shinu avatar
    17764 posts
    Member since:
    Mar 2007

    Posted 24 May 2010 Link to this post

    Hello Steve,

    I tried following CSS on page in order to set same width for both buttons in RadConfirm. I hope this wont mess-up any other style applied for the controls.

    CSS:
     
        <style type="text/css"> 
            .rwPopupButton .rwOuterSpan .rwInnerSpan 
            { 
                width: 30px !important; 
                text-align: center !important; 
            } 
        </style> 


    -Shinu.
  5. Steven Black
    Steven Black avatar
    44 posts
    Member since:
    Feb 2008

    Posted 24 May 2010 Link to this post


    Hello Shinu,

    Thanks for the reply, but this did not work for me.  It didn't seem to do anything. 
  7. Petio Petkov
    Admin
    Petio Petkov avatar
    825 posts

    Posted 25 May 2010 Link to this post

    Hi Steven Black,

    You can change the ConfrimTemplate as described in the following help article:
    http://www.telerik.com/help/aspnet-ajax/window_dialogschangingthedialogtemplates.html
    The code below illustrates a simple example where both "OK" and "Cancel" buttons are with equal width.
    <%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <head runat="server">
        <title></title>
        <script type="text/javascript">
            function confirmCallBackFn(arg)
            {
            }
      
        </script>
    </head>
    <body>
        <form id="form1" runat="server">
        <asp:ScriptManager ID="ScriptManager1" runat="server">
        </asp:ScriptManager>
        <div>
     <telerik:RadWindowManager ID="RadWindowManager1" runat="server">
      
      
    <ConfirmTemplate>
    <div class="rwDialogPopup radconfirm">   
    <div class="rwDialogText">
    {1}    
    </div>      
    <div>
     <a onclick="$find('{0}').close(true);"  class="rwPopupButton" href="javascript:void(0);" ><span class="rwOuterSpan"><span class="rwInnerSpan" style="width:75px">##LOC[OK]##</span></span></a>
     <a onclick="$find('{0}').close(false);" class="rwPopupButton"  href="javascript:void(0);"><span class="rwOuterSpan"><span class="rwInnerSpan" style="width:75px">##LOC[Cancel]##</span></span></a>
    </div>
    </div>
    </ConfirmTemplate>
    </telerik:RadWindowManager> 
    <button style="width: 150px; margin-bottom: 3px;" onclick="radconfirm('Are you sure?', confirmCallBackFn, 330, 100, null,'RadConfirm custom title'); return false;">radconfirm dialog</button><br style="clear:both" /><br style="clear:both" />
      
        </div>
        </form>
    </body>
    Hope this helps.



    Regards,
    Petio Petkov
    the Telerik team

    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.
  9. Steven Black
    Steven Black avatar
    44 posts
    Member since:
    Feb 2008

    Posted 25 May 2010 Link to this post

    Thanks for the reply.  I will review the article shortly.

    The solution you provided is to change the ConfirmTemplate.  I was hoping for a solution that doesn't involve making any changes to the radWindowManager itself, because then I'd have to make that change on almost every single page in my application.

    I currently put a style into my .css file called "innerspan".  The entire style is:

    .innerspan { width:70px; }

    That alone did the trick for me, so this issue is of minor concern right now. 

    Thanks for the help.

    Steve
Back to Top