This is a migrated thread and some comments may be shown as answers.

No Drop zone dotted border

9 Answers 216 Views
Dock
This is a migrated thread and some comments may be shown as answers.
Fernando Mayorga
Top achievements
Rank 1
Fernando Mayorga asked on 12 Jan 2010, 08:22 PM
I have a set of RadDocks with the handle set to none and using a custom handle.  When one of these docks is dropped into an empty RadDockZone there is no dotted line shown for the Drop Zone.

I noticed this behavior on your online examples as well:
to reproduce, empty a dock zone and then drag a RadDock into the emptied zone, you will notice that no indication of the drop zone is visible.

Is there a way to force the dotted border for the drop zone to show while dragging on top of the zone?

Thank you.

Fernando Mayorga

9 Answers, 1 is accepted

Sort by
0
Pero
Telerik team
answered on 13 Jan 2010, 07:38 AM
Hi Fernando,

You can make the drop zone have dotted border (or in fact have any other custom style) by using the RadDockZone's HighlightedCssClass property. Create a custom CSS class and apply it to the desired DockZone. We have an example that demonstrates this functionality. Please take a look at it: http://demos.telerik.com/aspnet-ajax/dock/examples/highlightedcssclass/defaultcs.aspx.

CustomCssClass is applied to HighlightedCssClass property.

Kind regards,
Pero
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.
0
Accepted
Gido Geek
Top achievements
Rank 2
answered on 13 Jan 2010, 09:13 AM
Hi Fernando,

I had the same issue. It can be solved with some JavaScript magic ;)

Telerik.Web.UI.RadDockZone.prototype._showPlaceholder = function(dock, location) {   
    this._repositionPlaceholder(dock.get_element(), location);   
   
    if (!dockBounds) {   
        dockBounds = dock._getBounds();   
    }   
    var placeholderMargin = dock._getMarginBox(this._placeholder);   
    var placeholderBorder = dock._getBorderBox(this._placeholder);   
   
    var horizontal = this.get_isHorizontal();   
    var placeholderStyle = this._placeholder.style;   
   
    placeholderStyle.height = dockBounds.height - (placeholderMargin.vertical + placeholderBorder.vertical) + "px";   
    placeholderStyle.width = this.get_fitDocks() && !horizontal ? "100%" : dockBounds.width - (placeholderMargin.horizontal + placeholderBorder.horizontal) + "px";   
    placeholderStyle.backgroundColor = "transparent";   
   
    placeholderStyle.display = "block";   
   
    return;   
}   
 

I assumed you wanted to achieve the same behavior as on a non-empty zone. This did wonders for me!

If this was helpful please mark my answer as the answer to your question.
0
Fernando Mayorga
Top achievements
Rank 1
answered on 13 Jan 2010, 03:43 PM
Gido, works great, thanks for sharing this!  I guess I should have inspected the object before posting, you save me tons of time.

Fernando
0
Gido Geek
Top achievements
Rank 2
answered on 13 Jan 2010, 04:07 PM
Hey Fernando,

I'm glad I could be of assistance.
Thx for marking the answer.

Regards,
Gido
0
Quinten
Top achievements
Rank 1
answered on 30 Jun 2010, 05:24 PM
Gido,

I'm interested in applying your Javascript solution, but I'm getting errors with the script as-is.  IE is not recognizing "Telerik.Web.UI.RadDockZone.prototype". 

What could I be doing wrong?

Thank you!

[EDIT] I fixed this by putting the script after the ScriptManager block.

Thanks for the fix, Gido!!
0
ADH
Top achievements
Rank 1
answered on 18 Aug 2010, 03:24 PM
This solution helped me. I had to change one line, though:

if (!dockBounds) {

became

if (typeof dockBounds == "undefined" || !dockBounds) {

Thanks!
0
LeBear
Top achievements
Rank 1
answered on 30 Sep 2010, 07:43 PM
Gido Geek and ADH, you guys rock!
0
LeBear
Top achievements
Rank 1
answered on 30 Sep 2010, 07:49 PM
Also...

Hey, Telerik.  You wouldn't want to add this as default behavior, would you?
0
Pero
Telerik team
answered on 05 Oct 2010, 09:03 AM
Hi,

We will consider this scenario and decide how to handle it. We will either incorporate this functionality in the RadDock control, or add an article in our Code Library, that describes how to achieve this behavior.

Kind regards,
Pero
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
Tags
Dock
Asked by
Fernando Mayorga
Top achievements
Rank 1
Answers by
Pero
Telerik team
Gido Geek
Top achievements
Rank 2
Fernando Mayorga
Top achievements
Rank 1
Quinten
Top achievements
Rank 1
ADH
Top achievements
Rank 1
LeBear
Top achievements
Rank 1
Share this question
or