Need Direction: Create Reusable Grid in Popup Window

[Jeremy Yoder]

I have several places I'd like to call a read-only popup grid, select a row, and return a value to a textbox. I assumed I'd create an ascx file, which would contain a RadWindow, which would contain a RadGrid. I'd call the ascx control, passing it the SQL (to auto-populate the grid), the textbox name to fill on the return, and the column name to return from the selected row.

But while doing this I felt at a loss. (Right now I don't need all the passed in items to work -- I'd be happy just getting a reusable dialog box with a grid to popup). I created an ascx, threw a RadWindow on it (not sure if I should use RadWindoManager) but couldn't place a grid on the RadWindow. I found it uses a NavigateURL, which requires an aspx. So I created an aspx file with a grid and pointed the RadWindow at that... but that's when I began to wonder if I was doing this the wrong way.

With what controls and overall structure would you recommend I do this? I ask because I feel I might be using the wrong tools and/or structure, so I'm hoping for a little direction.

Thanks.

[Georgi Tunev]

Hello Jeremy,

Since Q3 RadWindow can be used as a controls container as well - more information on the subject is available in the documentation and in our demo. For your convenience I attached a small sample to this thread that shows how to put RadGrid in RadWindow.

 

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.

[Jeremy Yoder]

Thanks so much for the response -- I'd have never guessed I could use the RadWindow as a container, given the design interface doesn't lend itself to that. But now that I know, it really helped me out. Your attached example was also excellent.

I have a follow-up question. In your example, you're using a grid on the page. I was going to take your example and move the RadWindow (with RadGrid) into an ascx file to make it reusable from other pages, to call like a dialog box. However, in looking at the telerik dialog demo here...

http://demos.telerik.com/aspnet-ajax/window/examples/dialogreturnvalue/defaultcs.aspx

... I see it's doing this via an aspx file rather than ascx. That would never have occurred to me. So I'm wondering -- with Rad controls (and what I'm envisioning with a dialogbox-like grid to reuse across pages) would you recommend I use an aspx file like the demo? Or does an ascx file have any pros that I'm missing? Thanks again!

[Georgi Tunev]

Hello again Jeremy,

Well, using aspx file in the RadWindow will allow you to have only one dialog page that you could call from the pages where you need it, instead of having the dialog code in every control, so it is up to you to decide  which approach to use.


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.

[Jeremy Yoder]

Thanks again. I have a minor question: In your example I turned on the Grid's filtering. But doing so requires me to scroll down to see the bottom part of the Grid, even though RadWindow's AutoSize is still set to true. (It's even more evident if you remove the "TOP 10" from the SQL, as it enables paging, but the paging numbers are partially cut off.)

Is that a bug, or is there some other setting I'm missing? 

[Svetlina Anati]

Hello Jeremy,

Would you please test whether the following CSS fixes the problem:

1) If you have filtering enabled, please include the following:

  

.rgFilterBox
 {
    padding-bottom: 0 !important;
 }

2) If you also have paging enabled, please test with the following as well, added to the above:

.rgPagerTextBox
{
     padding-bottom: 0px !important;
     padding-top: 0px !important;
}

Let me know whether this fixed the problem.

Sincerely yours,
Svetlina
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.

[Jeremy Yoder]

No, that didn't solve the problem, but I believe I found the issue.

When I have filtering on, it widens all the columns, which made the grid just wide enough to not fit the width of my monitor. As a result, it created a horizontal scrollbar along the bottom, and that's the part that was covering the bottom edge. (I tested it by removing one column from the grid, which made the bottom scrollbar go away and didn't require me to scroll down anymore.)

That didn't occur to me before as I would have guessed a generated scrollbar would be taken into account. Is there a setting I need to change so it can work? (I have a fairly wide monitor, but some of our customers won't, so this could happen to them, depending on the number of columns we expose.)

[Svetlina Anati]

Hi Jeremy Yoder,

If there is no space, the expected behavior is to generate a scrollbar and this cannot be changed. The only thing I can recommend is to set explicit width to your grid, e.g 800px and this should be respected no matter how many columns the grid has.

Regards,
Svetlina
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.

[Jeremy Yoder]

I don't mind it creating a horizontal scrollbar. I just thought maybe the grid could lengthen vertically to account for it. But if you're saying it can't, then so be it. Thanks.