
I have my grid using the Telerik skin. I have the rest of my controls using the Web20 skin (blue and silver basically).
I'm using the EditMode="Popup" on my grid and I'm specifying a custom template for it to use. In this template I have a number of RadTextBox's that should be styling to Web20 but are being forced to use a grey/silver border (I assume from the Telerik skin). Is this normal behaviour? I've tried setting them via Skin="Web20" instead of using my theme but the problem persists.
Another problem I'm having is setting the window title of the popup. I'd like it to say something like "Client Details" but I can't find the property to set this value.
I aso want this window to be modal but I don't see the option for it.
Finally I don't see the option to specify where the window opens. I'd like to be able to tell the popup to open in the center of my screen instead of basing it off of the location of the grid that is opening it.
Thanks.
17 Answers, 1 is accepted

1) If I have a validation summary dynamically show itself when saving the record then it will expand the size of the form but the window will not expand itself. This makes it so the controls near the bottom of the window overhang. I have not specified a height/width of the window so I would think it could grow/shrink to accomodate its contents?
2) Is there a way to make it so the close button (X) in the top right of the window does not cause validation? I would like it to act as a cancel button really and close the window regardless.
Thank you.

In order to set а window title you must use:
<EditFormSettings CaptionFormatString="Client Details" />
You may also want to check this related help article:
http://www.telerik.com/help/aspnet-ajax/grdpopupeditform.html
Modal mode will be available in the next release, but for centering the popup you will have to do few things. Listen for OnPopUpShowing client event and then the coordinates of the edit form. For example:
<ClientSettings>
<ClientEvents OnPopUpShowing="CenterEditForm" />
</ClientSettings>
in your JavaScript:
function CenterEditForm(sender, eventArgs)
{
//get instance of the edit form
var popup = eventArgs.get_popUp();
//your custom code for centering
popup.style.top = "40%";
popup.style.left = "40%";
}
The validation on the Close button (X) is internally off - CausesValidation = false. It should react like a cancel action.
As for the textboxes - yes, the Grid edit form styles override the textboxes' Web20 skin. In order to fix this, please add the following CSS code to your web application:
body form .radInput_Web20 .radEnabledCss_Web20,
body form .radInput_Web20 .radEmptyMessageCss_Web20,
body form .radInput_Web20 .radHoverCss_Web20,
body form .radInput_Web20 .radFocusedCss_Web20,
body form .radInput_Web20 .radReadOnlyCss_Web20,
body form .radInput_Web20 .radDisabledCss_Web20,
body form .radInput_Web20 .radNegativeCss_Web20,
body form .radInput_Web20 .radInvalidCss_Web20
{
border:1px solid #6788be;
border-bottom-width:2px;
padding:2px 0 2px 1px;
font:12px arial,verdana,sans-serif;
color:#000;
}
.radInput_Web20 .radEnabledCss_Web20,
body form .radInput_Web20 .radEmptyMessageCss_Web20
{
background:#fefefe;
}
body form .radInput_Web20 .radHoverCss_Web20
{
border-color:#a5bedf;
background:#fefefe;
color:#242424;
}
body form .radInput_Web20 .radFocusedCss_Web20
{
background:#fff;
}
body form .radInput_Web20 .radReadOnlyCss_Web20
{
background:#f9f9f9;
}
body form .radInput_Web20 .radDisabledCss_Web20
{
background:#f6f6f6;
color:#aaa;
cursor:default;
}
body form .radInput_Web20 .radNegativeCss_Web20
{
background:#fefefe;
}
body form .radInput_Web20 .radInvalidCss_Web20
{
border-color:#f00;
background:#fefefe;
color:#f00;
}
Sincerely yours,
Dimo
the Telerik team
Instantly find answers to your questions at the new Telerik Support Center

The CSS you provided doesn't seem to impact the style of the controls inside of the popup though. Am I missing something?
I'm also still looking for an answer on the height/width issue if javascript changes the content dimensions (like a validation control/summary does).
Also - the close button does in fact cause validation. Is there some way to turn this off?
Thank you.

Would like to join your pact.
I was just about to post the same issues on the dynamically grow/shrink of the window size upon validation summary displaying and the validation on the X cancellation not letting the window close (this one here).
But say no more, you said it all!
Please help Telerik!
Thanks

Thanks, Jim
Please find attached a sample project on how to center the pop-up edit form in RadGrid and how to hide the pop-up close button also.
Let us know if any issues arise.
Sincerely yours,
Iana
the Telerik team
Instantly find answers to your questions at the new Telerik Support Center

Type 'Telerik.Web.UI.GridClientEvents' does not have a public property named 'OnPopUpShowing'.
I am using Promethius, RadControls for ASPNET AJAX Q1 2008.
Thanks Jim
This new client event has been introduced in the Q1 2008 SP2 release of RadControls for ASP.NET AJAX (2008.1.619). Please migrate to this version following the instructions from this KB article and let us know how it goes.
Best regards,
Stephen
the Telerik team
Instantly find answers to your questions at the new Telerik Support Center

Just found that out and am in the middle of the migration.
Again thanks

Could elaborate more on the issue you are facing?
Note that the script from the help topic is to center the form over the grid. However if you would like place it at the center of the page, you should mind the window's width/height in the calculations.
Best wishes,
Iana
the Telerik team
Check out Telerik Trainer, the state of the art learning tool for Telerik products.

- ScrollBars - defines whether and which scrollbars should appear in the edit form. This setting is with higher priority, so if Height is set but the vertical scrollbar is not shown and the content requires more room, the popup will be resized to accommodate the entire content. The default value is None.


You can get the width and the other properties of the popup's inner contents as shown below:
var popUp = eventArgs.get_popUp();
alert(popUp.children[1].children[0].style.width);
The object children[0] is the div in the popup. You can get the table inside the div by trying to access the inner child .
Thanks,
Princy


I ran into the same issue with required field validators on the page.
just add the below tag in your validation control:
<EnableClientScript="false">
as in
<asp:RequiredFieldValidator ID="RequiredFieldValidator1" ControlToValidate=<control name>
ErrorMessage="This field is required!" runat="server" EnableClientScript="false">