Change Icon of RadConfirm

8 posts, 0 answers
  1. bslaght
    bslaght avatar
    184 posts
    Member since:
    Jun 2006

    Posted 30 Oct 2009 Link to this post

    How do I change the icon in the top left of the title bar in my radconfirm window?
    I am using RadWindowsManager and I can set the icon that way, but then the same icon appeas for RadAlert, RadConfirm, etc.

    I want to specify the icon for only the RadConfirm window.  Please advise.

    Thanks
    Brett
  2. Georgi Tunev
    Admin
    Georgi Tunev avatar
    7207 posts

    Posted 02 Nov 2009 Link to this post

    Hello Brett,

    I believe that the following forum thread will be of help:
    http://www.telerik.com/community/forums/aspnet-ajax/window/radconfirm-src-icon-change.aspx


    Kind regards,
    Georgi Tunev
    the Telerik team

    Instantly find answers to your questions on the new Telerik Support Portal.
    Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. bslaght
    bslaght avatar
    184 posts
    Member since:
    Jun 2006

    Posted 02 Nov 2009 Link to this post

    Hi Georgi,
    Your solution only changes the icon within the body of the radwindow.  I am trying to change the icon in the titlebar.  Currently this icon can be controlled if I change the "IconUrl"  in the RadWindowManager properties, however I would like to control the icon individually for the built-in RadWindow Dialogs

    I would like to use different icons for radalert and radconfirm, but can't figure out how to set them individually.  I have included a screenshot to show what icon I mean.

    Thanks,
    Brett
  5. Georgi Tunev
    Admin
    Georgi Tunev avatar
    7207 posts

    Posted 03 Nov 2009 Link to this post

    Hello Brett,

    In this case, you can try the approach described in this forum post - just replace radopen with radconfirm()

    http://www.telerik.com/community/forums/aspnet-ajax/window/set-iconurl-client-side-not-setting-the-icon-on-a-new-window.aspx


    Kind regards,
    Georgi Tunev
    the Telerik team

    Instantly find answers to your questions on the new Telerik Support Portal.
    Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
  6. bslaght
    bslaght avatar
    184 posts
    Member since:
    Jun 2006

    Posted 05 Nov 2009 Link to this post

    HI Georgi,
     I tried the approach you suggested in the article and seems it would work well in most cases, however I am trying to catch the delete event from a button in a radgrid.  That being the case, how can I modify my function to include the the icon code.  I will past in my JS script for you review and if you could recommend where to add the appropiate changes, that would be great.

    <script type="text/javascript">  
            var oldConfirm = radconfirm;  
              
            window.radconfirm = function(text, mozEvent) {  
                var ev = mozEvent ? mozEvent : window.event; //Moz support requires passing the event argument manually        
                //Cancel the event        
                ev.cancelBubble = true;  
                ev.returnValue = false;  
                if (ev.stopPropagation) ev.stopPropagation();  
                if (ev.preventDefault) ev.preventDefault();  
     
                //Determine who is the caller        
                var callerObj = ev.srcElement ? ev.srcElement : ev.target;  
     
                //Call the original radconfirm and pass it all necessary parameters        
                if (callerObj) {  
                    //Show the confirm, then when it is closing, if returned value was true, automatically call the caller's click method again.        
                    var callBackFn = function(arg) {  
                        if (arg) {  
                            callerObj["onclick"] = "";  
                            if (callerObj.click) callerObj.click(); //Works fine every time in IE, but does not work for links in Moz        
                            else if (callerObj.tagName == "A"//We assume it is a link button!        
                            {  
                                try {  
                                    eval(callerObj.href)  
                                }  
                                catch (e) { }  
                            }  
                        }  
                    }  
                    oldConfirm('Are you sure you want to delete this job from your application?', callBackFn, 300, 100, null'Delete Confirmation');  
                      
                }  
                return false;  
            }       
        
        </script> 

    Thanks in advance.
    Brett
  7. Georgi Tunev
    Admin
    Georgi Tunev avatar
    7207 posts

    Posted 06 Nov 2009 Link to this post

    Hello Brett,

    You should execute the code when calling the original radconfirm.
    e.g.
    var oldConfirm = radconfirm;
     
    window.radconfirm = function(text, mozEvent)
    {
        var ev = mozEvent ? mozEvent : window.event; //Moz support requires passing the event argument manually       
        //Cancel the event       
        ev.cancelBubble = true;
        ev.returnValue = false;
        if (ev.stopPropagation) ev.stopPropagation();
        if (ev.preventDefault) ev.preventDefault();
     
        //Determine who is the caller       
        var callerObj = ev.srcElement ? ev.srcElement : ev.target;
     
        //Call the original radconfirm and pass it all necessary parameters       
        if (callerObj)
        {
            //Show the confirm, then when it is closing, if returned value was true, automatically call the caller's click method again.       
            var callBackFn = function(arg)
            {
                if (arg)
                {
                    callerObj["onclick"] = "";
                    if (callerObj.click) callerObj.click(); //Works fine every time in IE, but does not work for links in Moz       
                    else if (callerObj.tagName == "A") //We assume it is a link button!       
                    {
                        try
                        {
                            eval(callerObj.href)
                        }
                        catch (e) { }
                    }
                }
            }
            var oWnd = oldConfirm('Are you sure you want to delete this job from your application?', callBackFn, 300, 100, null, 'Delete Confirmation');
            oWnd.set_iconUrl("http://www.mass.gov/massgov2/images/rss/feed-icon.jpg");
            oWnd._titleIconElement.style.background = "transparent url('http://www.mass.gov/massgov2/images/rss/feed-icon.jpg') no-repeat scroll 0px 0px";
     
        }
        return false;
    }



    Regards,
    Georgi Tunev
    the Telerik team

    Instantly find answers to your questions on the new Telerik Support Portal.
    Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
  8. Tejas Shah
    Tejas Shah avatar
    2 posts
    Member since:
    Dec 2009

    Posted 07 Dec 2009 Link to this post

    Well, let me correct.. I am not trying to change icon in Window header (where minimize, maximize etc buttons are present)

    I want to replace "Blue Questionmark" image on window with custom image based on Confirmation I am suppose to show.

    If I use following, it replaces questionmark image with image specified.

    <style type="text/css">
            .RadWindow .rwWindowContent .radconfirm
            {
                background-image: url('../../images/stop.gif');
                background-position: left top;
            }
        </style>

    Is there any way around it?
  9. Martin
    Admin
    Martin avatar
    585 posts

    Posted 08 Dec 2009 Link to this post

    Hello Tejas Shah,

    The CSS approach you have tried is the only possible and correct way to change the image of the confirm dialog. However, please consider that you may need to force your custom values in certain cases, i.e:

    <style type="text/css">
     .RadWindow .rwWindowContent .radconfirm
     {
      background-image: url('../../images/stop.gif') !important;
      background-position: left top !important;
     }
    </style>

    Please, let me know if you experience further problems.

    All the best,
    Martin Ivanov
    the Telerik team

    Instantly find answers to your questions on the new Telerik Support Portal.
    Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
Back to Top
UI for ASP.NET Ajax is Ready for VS 2017