RadDock as Detail viewer

[Jon]

Hi,

I've been looking for a way to get a view button on a grid to open a raddock for the current row and present read only data for it - kind of the view mode to look like the edit mode with a popup form.  I think that the raddock will look closer to the popup form than a radwindow.

Now one way that I could acheive this is to open a new page inside the dock or even just call some server side code to populate labels containing the view data.  

There must be a better way though that can work more seamlessly with the RadGrid.  Has anyone done this before or know of any good examples on the site (I may have missed some).

Thanks in advance for any pointers.

Regards,

Jon

[Andrey]

Hello Jon,

You could achieve similar functionality a lot easier with RadToolTip. Check this online demo to see how to achieve the same functionality with RadGrid and RadToolTip.

Another approach with RadToolTip is shown here.

Try these demo applications and check whether they suit your needs.

Regards,
Andrey
the Telerik team

[Jon]

Many thanks Andrey

That's pretty good although I managed to get it going with a RadDock panel in the end.  

Is there a way to use the close icon from the Edit popup window on the RadDock window?

Regards,

Jon

[Andrey]

Hello Jon,

The icon you are looking for is an embedded web resource and it could not be extracted dynamically from the Skin file, this is true because the URL to this image is changed on every incremental build of our controls. However you could find the desired icon in our online demos and right click on it and choose "Save Image As...", then you could use it as a static resource to your control.

I am attaching a compressed version of the Close icon from the Vista skin.

Regards,
Andrey
the Telerik team

[Jon]

Hi Andrey,

Thanks for the comment.  I used the icon from the Office2010Blue skin in the end.

I have got this far:

.RadDock_Office2010Blue .rdCenter .rdCommands A SPAN
{
    background-image:url('/Images/Icons/Custom/PopUpClose.gif') ! important;
}
.rdClose
{
    background-position:0px 0px;
}

The issue that I am now having is that when I hover over the icon it clears and doesn't show anything.  How do I set the hover image to the same as the above?

Regards,

Jon

[Slav]

Hi Jon,

Please check the help article Tutorial: Creating a Custom Skin and more specifically the section Modifying the Image Sprites to Achieve Totally New Looks for the Skin. The RadDock control uses a sprite image for configuring the appearance of its command buttons and the best approach to modify these buttons is to use the steps for changing the base sprite, provided in this help article.

Nevertheless, the approach that you have chosen could also be used, although it will require more modification of the default RadDock styles and some of the changes may break the appearance of the control as they are custom and aren't tested under various scenarios. For your convenience I have prepared and attached a sample page that uses the provided icon for changing the display of the RadDock Close command. Please use it as a reference for your further development.

All the best,
Slav
the Telerik team

[Jon]

Many thanks Slav,

I modified the CSS you sent to be as follows.  This mod stops the raddock from displaying weird characteristics from setting the CSS for the whole dock. I was missing the .rdClose from the end of the SPAN CSS...

Thanks for your help!

Regards,

Jon

.RadDock_Office2010Blue .rdCenter .rdCommands A SPAN.rdClose
    {
        width:18px ! important;
        background-image: url(/Images/Icons/Custom/PopUpClose.gif) !important;
        background-position:0px 0px ! important;
    }