When I have text in the subject text box and i click on it to change the text it always moves my cursor to the start of the text even if i click at the end of the string. what gives?
same goes for the description text box.

Hi,

first of all I like to state that I am very impressed with the controls like a lot of people using them I find them to be the best.

Now to the matter in hand,

I was wondering if there is a way to display the validation errors(messages) in a form a tooltip.
Secondly if there is way the validationsummary can be added as a tooltip?

Thank you very much

Using Custom Skins of RadToolTip with Base Style Sheet after Upgrading to Q3.2009SP1

With the release of Q3.2009 SP1 we have introduced a change in serving the skins of RadToolTip.

RadToolTip was one of the few controls that did not use base style sheet, but only a skin .css file. Since Service Pack 1 the styling of the control is based on two style sheets – base style sheet and skin-specific style sheet.

The aim of this article is to explain in a few easy steps how to use this new functionality on custom skins that would be broken after upgrade.

The main purpose of the base style sheet of Telerik RadControls is to separate the layout-specific CSS rules that are common for all skins from the skin-specific settings (background images, colors and borders) and thus facilitate the skin maintenance or the creation of a new skin. By introducing a base style sheet to RadToolTip and moving the common settings in a separate file we managed to reduce the CSS file from 300+ lines to less than 50 lines per skin.

The easiest way to use a custom skin with the latest version of RadControls is to set EnableEmbeddedBaseStylesheet to false in the server declaration of RadToolTip. This will prevent the loading of the base style sheet on the page and the control will simply resort on the custom style sheet that contains all settings that are now gone in the base CSS file. However, in order to ensure that the skin will work in any possible case or future updates just read the rest of this article.

Let’s assume that our custom skin is based on one of the skins shipped with RadControls, for example – WebBlue. All skins are stored in [RadControlsInstallationRoot]/Skins/SkinName/ToolTip.SkinName.css. Let’s now compare the skins from SP1 with an older skin. The first thing that is obvious is that both files differ in size.

Essentially, what we need to do now is to remove selectors from the custom skin that are not required by the new skinning mechanism of RadToolTip.

The selectors or CSS properties that need to be removed from the skin are shown in red in the listing below:

.RadToolTip_WebBlue.rtLoading
{    
      background: url('ToolTip/Loading.gif') no-repeat center;
      width: 100%;
      height: 100%;
}

div.RadToolTip_WebBlue
{
      position: absolute;
      cursor: default;
}

div.RadToolTip_WebBlue div.rtCallout
{
      display: none;
}

div.RadToolTip_WebBlue.rtVisibleCallout div.rtCallout
{
      display: block;
}

div.RadToolTip_WebBlue table.rtWrapper
{
      padding: 0;
      margin: 0;
      border-collapse: collapse;
}

div.RadToolTip_WebBlue table.rtWrapper td.rtWrapperTopLeft,
div.RadToolTip_WebBlue table.rtWrapper td.rtWrapperTopRight,
div.RadToolTip_WebBlue table.rtWrapper td.rtWrapperBottomLeft,
div.RadToolTip_WebBlue table.rtWrapper td.rtWrapperBottomRight
{
      width: 3px;
      height: 3px;
      line-height: 1px;
      font-size: 1px;
      background-image: url('ToolTip/ToolTipSprites.gif');
      background-color: transparent;
      background-repeat: no-repeat;
}

div.RadToolTip_WebBlue table.rtWrapper td.rtWrapperTopLeft
{
      background-position: 0 -12px;
}

div.RadToolTip_WebBlue table.rtWrapper td.rtWrapperTopRight
{
      background-position: right -12px;
}

div.RadToolTip_WebBlue table.rtWrapper td.rtWrapperBottomLeft
{
      background-position: 0 -63px;
}

div.RadToolTip_WebBlue table.rtWrapper td.rtWrapperBottomRight
{
      background-position: right -63px;
}

div.RadToolTip_WebBlue table.rtWrapper td.rtWrapperTopCenter,
div.RadToolTip_WebBlue table.rtWrapper td.rtWrapperBottomCenter
{
      height: 3px;
      line-height: 0px;
      font-size: 1px;
      background: url('ToolTip/ToolTipSprites.gif') ;
      background-repeat: repeat-x;
}

div.RadToolTip_WebBlue table.rtWrapper td.rtWrapperTopCenter
{
      background-position: 0 -66px;
}

div.RadToolTip_WebBlue table.rtWrapper td.rtWrapperBottomCenter
{
      background-position: 0 -120px;
}

div.RadToolTip_WebBlue table.rtWrapper td.rtWrapperLeftMiddle,
div.RadToolTip_WebBlue table.rtWrapper td.rtWrapperRightMiddle
{
      background-image:  url('ToolTip/ToolTipVerticalSprites.gif');
      background-repeat: repeat-y;
      font-size: 1px;
      width: 3px;
}

div.RadToolTip_WebBlue table.rtWrapper td.rtWrapperLeftMiddle
{
      background-position: 0 0;
}

div.RadToolTip_WebBlue table.rtWrapper td.rtWrapperRightMiddle
{
      background-position: -3px 0;
}

div.RadToolTip_WebBlue table.rtWrapper td.rtWrapperContent
{
      font: normal 12px "Segoe UI", Arial, Sans-serif;
      height: 100%;
      background-color: #e4e5f0;   
      padding: 4px;
      color: #333;
}

div.RadToolTip_WebBlue div.rtTitlebar
{    
      color: #333;
      font: normal 18px "Segoe UI", Arial, Sans-serif;
      float: left;
      line-height: 22px;
}

div.RadToolTip_WebBlue a.rtCloseButton
{
      display: block;
      float: right;
      position: absolute;
      right: 2px;
      width: 12px;
      height: 12px;
      font-size: 1px;
      line-height: 1px;
      margin-top: 5px;
      margin-right: 3px;
      background-image: url('ToolTip/ToolTipSprites.gif');
      background-position: 0 0;
      background-repeat: no-repeat;
      text-indent: -9999px;
      outline: none;
}

/* RTL support begin */
div.RadToolTip_WebBlue_rtl a.rtCloseButton,
div.RadToolTip_WebBlue_rtl a.rtCloseButton:hover
{
      float: left ;
      text-decoration: none ;
      outline: none;
      left: 2px;
      margin-left: 1px;
      right: auto;
      margin-right: auto;
}

div.RadToolTip_WebBlue_rtl div.rtTitlebar,
div.RadToolTip_WebBlue_rtl table.rtWrapper td.rtWrapperTopCenter div.rtTitlebar div
{
      float: right ;
}

/* position="rtCalloutCenter" */

div.RadToolTip_WebBlue_rtl .rtCalloutCenter
{

      right: 0;
      left: auto;
}

/* position="rtCalloutBottomRight" */
.RadToolTip_WebBlue_rtl .rtCalloutTopLeft
{

      margin-right: -20px;
      left: 0;
}

/* position="rtCalloutBottomCenter" */
.RadToolTip_WebBlue_rtl .rtCalloutTopCenter
{
      margin-right: 10px;
}

/* position="rtCalloutBottomLeft" */
.RadToolTip_WebBlue_rtl .rtCalloutTopRight
{
      margin-right: 20px;
}

/* position="rtCalloutTopCenter" */
.RadToolTip_WebBlue_rtl .rtCalloutBottomCenter
{
      margin-right: 10px ;
}

/* position="rtCalloutTopLeft" */
.RadToolTip_WebBlue_rtl .rtCalloutBottomRight
{
      margin-right: 40px ;
}

/* position="rtCalloutTopRight" */
.RadToolTip_WebBlue_rtl .rtCalloutBottomLeft
{
      margin-right: -20px;
      left: 0;
}

/* position="rtCalloutMiddleRight" */
.RadToolTip_WebBlue_rtl .rtCalloutMiddleLeft
{
      margin-right: 10px;
      left: 0;
}

/* position="rtCalloutMiddleLeft" */

.RadToolTip_WebBlue_rtl .rtCalloutMiddleRight
{
      margin-right: 1px;
}

/* RTL support end */

div.RadToolTip_WebBlue div.rtCallout
{
      position: absolute;
      height: 11px;
      width: 11px;
      line-height: 0px;
      font-size: 1px;
      background-image: url('ToolTip/Callouts.gif');
      background-repeat: no-repeat;
}

/* position="rtCalloutCenter" */
div.RadToolTip_WebBlue .rtCalloutCenter
{
      visibility: hidden;
}

/* position="rtCalloutBottomRight" */
.RadToolTip_WebBlue .rtCalloutTopLeft
{
      margin-top: -10px;
      margin-left: 20px;
      background-position: 0 -22px;
}

/* position="rtCalloutBottomCenter" */
.RadToolTip_WebBlue .rtCalloutTopCenter
{
      left: 50% ;
      margin-top: -9px;
      margin-left: -10px;
      background-position: 0 0 ;
}

/* position="rtCalloutBottomLeft" */
.RadToolTip_WebBlue .rtCalloutTopRight
{

left: 100% ;
margin-top: -10px;
margin-left: -20px;
background-position: 0 -11px ;
}

 

/* position="rtCalloutTopCenter" */
.RadToolTip_WebBlue .rtCalloutBottomCenter
{

      top: 100% ;
      left: 50% ;
      margin-left: -10px ;
      margin-top: -1px ;
      background-position: 0 -55px ;
}

/* position="rtCalloutTopLeft" */
.RadToolTip_WebBlue .rtCalloutBottomRight
{
               top: 100% ;
               left: 100% ;
               margin-left: -40px ;
               margin-top: -1px ;
               background-position: 0 -66px ;
}

/* position="rtCalloutTopRight" */
.RadToolTip_WebBlue .rtCalloutBottomLeft
{
      top: 100% ;
      margin-left: 20px ;
      margin-top: -1px ;
      background-position: 0 -77px ;
}

/* position="rtCalloutMiddleRight" */
.RadToolTip_WebBlue .rtCalloutMiddleLeft
{
      top: 50% ;
      margin-left: -10px;
      margin-top: -7px;
      background-position: 0 -44px ;
}

/* position="rtCalloutMiddleLeft" */
.RadToolTip_WebBlue .rtCalloutMiddleRight
{
      left: 100% ;
      top: 50% ;
      margin-left: -1px;
      margin-top: -10px;
      background-position: 0 -33px;
}

div.RadToolTip_WebBlue table.rtWrapper td.rtWrapperTopLeft,  
div.RadToolTip_WebBlue table.rtWrapper td.rtWrapperTopCenter,  
div.RadToolTip_WebBlue table.rtWrapper td.rtWrapperTopRight,  
div.RadToolTip_WebBlue table.rtWrapper td.rtWrapperLeftMiddle,  
div.RadToolTip_WebBlue table.rtWrapper td.rtWrapperContent,  
div.RadToolTip_WebBlue table.rtWrapper td.rtWrapperRightMiddle,  
div.RadToolTip_WebBlue table.rtWrapper td.rtWrapperBottomLeft,  
div.RadToolTip_WebBlue table.rtWrapper td.rtWrapperBottomCenter,  
div.RadToolTip_WebBlue table.rtWrapper td.rtWrapperBottomRight  
{
   padding: 0;
   border: 0;
   border-collapse: collapse;
}

Finally, when we are over and done removing selectors and properties, the new custom skin should look similar to this:

.RadToolTip_WebBlue.rtLoading
{    
      background: url('ToolTip/Loading.gif') no-repeat center;
}

div.RadToolTip_WebBlue table.rtWrapper td.rtWrapperTopLeft,
div.RadToolTip_WebBlue table.rtWrapper td.rtWrapperTopRight,
div.RadToolTip_WebBlue table.rtWrapper td.rtWrapperBottomLeft,
div.RadToolTip_WebBlue table.rtWrapper td.rtWrapperBottomRight
{
      background-image: url('ToolTip/ToolTipSprites.gif');
}

div.RadToolTip_WebBlue table.rtWrapper td.rtWrapperTopCenter,
div.RadToolTip_WebBlue table.rtWrapper td.rtWrapperBottomCenter
{
      background-image: url('ToolTip/ToolTipSprites.gif') ;
}

 

div.RadToolTip_WebBlue table.rtWrapper td.rtWrapperLeftMiddle,
div.RadToolTip_WebBlue table.rtWrapper td.rtWrapperRightMiddle
{
      background-image:  url('ToolTip/ToolTipVerticalSprites.gif');
}

div.RadToolTip_WebBlue table.rtWrapper td.rtWrapperContent
{
      background-color: #e4e5f0;   
      color: #333;
}

div.RadToolTip_WebBlue div.rtTitlebar
{    
      color: #333;
}

div.RadToolTip_WebBlue a.rtCloseButton
{
      background-image: url('ToolTip/ToolTipSprites.gif');
}

div.RadToolTip_WebBlue div.rtCallout
{
      background-image: url('ToolTip/Callouts.gif');
}

Hi
I have a flash video control on a page running in a window, set to autplay on page load.
This works fine, and starts when the window is opened.

I order to ensure the media does not keep playing when the window is closed I have this
script (from Telerik):
However this also seems to ensure that the media does not play if the window is called again,
unless the parent page is refreshed by the visitor.

How can I get round this?

Thanks

Clive

Hi,

I've used the editor for an email program, but run into one problem with the images.  All mail clients (Gmail, Hotmail, Outlook, etc.) all have differences in handling CSS/XHTML and the way Q2 2009 formats the properties is creating a lot of inconsistency for us.  For example:  not all mail clients observe a style="margin:5px" but instead only want or recognize hspace or vspace.  Same goes for image scaling, especially when a message gets forwarded.  If it is a style="height:100px; width:100px;" some clients lose this information and the pictures revert back to original size.

Lastly, some mail clients do not like image alignment being handled as a style="float:left;" but it always works as align="left" across the board.

Obviously turning off ConvertToXHTML can allow someone with HTML knowledge to fix it at the HTML level, but the average user who builds the email doesn't always know HTML and just uses the image manager which always inserts with style="" for the properities.  If at all possible it would be nice to be able to leave ConvertToXHTML on as well, so that all non-image items are formatted as expected and to current standards, but if it has to be off we can try it that way.

Is there any way for us to work around this to be able to use the original properties such as hspace, vspace, align for images, since modern XHTML and standards isn't always accepted by the mail clients?

Thanks for any help and recommendations. :)

Hi all,

Is there any way to set the maximum number of lines in each row (or maximum height of each row) in RadGrid, so if the content is shorter than the maximum, it will be fully displayed, but if the contect has more lines, all the lines beyond the maximum will be hidden.??

for example. if I define "maximum rows" =3

the following text:

This is a test: line 1
This is a test: line 2
This is a test: line 3
This is a test: line 4

will only display the top 3 line in the gird row.

Is there any way to do that?

Thanks,
feng

Hello guys,

I want to make radsplitter get height from its content dynamically, not static height. I mean I don't want splitter to have scroll bars, instead using explorer natural scroll bars. Splitter has 2 panes; the left pane is a radpane menu which is higher than entire window and the right pane is a dynamic content with arbitrary heights. In this case I get 2 annoying scroll bars or my contents are hidden. I don't want either case. I want simply one scroll bar on explorer and to achieve this splitter have to get height from content dynamically.

This was OK inTelerik 2008 but in Telerik 2009 I have this problem.

This is a sample code showing the problem:


I would thanks in advance for any help.

Regards.

Hey Telerik!

When I switch to editmode in my RadGrid the Images for the Calendar are displayed only on the very last row. This only happened after switching from a previous version to Version 2008.03.1314.20

Do I need to add some styling element here?

Sincerely, Peter.

Hi,

I am trying to open the rad window and enable the users to drag anywhere and even outside the browser area. I want the window to behave similar to popup window of Window. I set the KeepInScreenBounds propert to to false for RadWindowManager as well as RadWindow. But I could not move the rad window out of the browser area. When I checked the view source this property is still set to true. Can any one help me to achieve my target? I use RadControls for ASP.NET AJAX Q2 2009 version.

Hi,
I am facing an annoying issue with the RadScheduler control;

• When I add an All day event let's say starting and ending the 1st December, it get spanned across 30st November and 1st December.
• When I want to correct it by resizing the bar, it is removing the all day event and make it starting and ending at a random time.

I tried to play with timezoneoffset DayEndTime and DayStartTime settings without success.


How to correct this erratic behavior?
Regards,
David