Filter by date in a new dialog

HI!
I open a new window where I have a table. In the grid, I have sorted by date. When I click on the date icon, the settings window does not display correctly.
Below is the code and how it looks.
I use the latest version of the library.

dialogService.Open<ExchangeRateBankModal>($"Курсы валют: {bank.EnglishTitle}",
                               new Dictionary<string, object>() { { "Bank", bank } },
                               options: new DialogOptions(){Width = "700px", Top = "50px" })

Dialog page code:

<RadzenGrid TItem="ExchangeRateFullModel" FilterCaseSensitivity="FilterCaseSensitivity.CaseInsensitive" Data="@rates" AllowFiltering="true" AllowSorting="true" PageSize="50" AllowPaging="true">
    <Columns>
        <RadzenGridColumn TItem="ExchangeRateFullModel" Property="@nameof(ExchangeRateFullModel.DateCourseDate)" Title="Дата курса">
            <Template Context="data">
                @(data.DateCourseDate.ToString("dd.MM.yyyy"))
            </Template>
        </RadzenGridColumn>
        <RadzenGridColumn TItem="ExchangeRateFullModel" Property="@nameof(ExchangeRateFullModel.BankAlphabeticCode)" Title="Банк" />
        <RadzenGridColumn TItem="ExchangeRateFullModel" Property="@nameof(ExchangeRateFullModel.BaseCurrencyAlphabeticCode)" Title="Базовая валюта" />
        <RadzenGridColumn TItem="ExchangeRateFullModel" Property="@nameof(ExchangeRateFullModel.Unit)" Format="int32" Title="Единица измерения" />
        <RadzenGridColumn TItem="ExchangeRateFullModel" Property="@nameof(ExchangeRateFullModel.Rate)" Filterable="false" Title="Курс" />
        <RadzenGridColumn TItem="ExchangeRateFullModel" Property="@nameof(ExchangeRateFullModel.QuoteCurrencyAlphabeticCode)" Title="Валюта котировки" />
    </Columns>
</RadzenGrid>


1 Like

I'll see what we can do however most probably this is not going to be an easy fix. We are using position:fixed for our popups and in this case you have popup in popup. The most reliable way will be to use position:absolute instead for our popups however they should be moved to root element - complete rewrite. At the moment the only option I can suggest you is to avoid popup in popup UI.

The fix was easier than I expected:

I'll publish new version immediately.

2 Likes

We're interested in this capability to show a popup within a popup in a more general context (that is, not just when we select a date filter). Would you mind sharing more code so we could try to do it ourselves?

Also, is RadzenDialog similar to Chris Sainty's Blazored.Modal in that ModalParameters of arbitrary types can be passed to the modal, and the modal can return a result of arbitrary type? the Radzen demos only show an ID being passed to a Modal, and the Modal returning only a simple boolean. It seems that Radzen's Dictionary<string, object> is equivalent to Blazored.Modal parameters, and RadzenDialog's Close(dynamic result) can accept arbitrary types, and yet we ran into problems when we made our first code attempt (cant remember the particulars now, but we were probably using the community edition version committed around Nov 6). if the answer to this our 2nd question in the post is "yes" to both parameter and result types, we would like to try again especially if we can also attempt to exercise the new show popup within a popup fix / capability.

thank you for your help!

Hi @radzenfan,

I'm not familiar with Chris Sainty's Blazored.Modal however with Radzen.Blazor Dialog you can pass and return arbitrary objects:

Page that will open the dialog:

protected override void OnInitialized()
{
        dialogService.OnOpen += Open;
        dialogService.OnClose += Close;

        var query = (from order in dbContext.Orders.Where(o => o.OrderID == orderID)
                           .Include("Customer")
                           .Include("Employee")
                           .Include("OrderDetails")
                           .Include("OrderDetails.Product")
                     select order).ToList();

        order = query.Last();
}
....
<RadzenButton Text=@($"Show OrderID: {orderID} details") Click="@(args => dialogService.Open<DialogCardPage>($"Order {orderID}",
                          new Dictionary<string, object>() { { "Order", order } },
                          new DialogOptions(){ Width = "700px", Height = "530px", Left = "calc(50% - 350px)", Top = "calc(50% - 265px)" }))" />
...
async void Close(dynamic result)
{
        events.Add(DateTime.Now, "Dialog closed. Result: " + result);
        await InvokeAsync(() => { StateHasChanged(); });
}

Page shown as dialog:

[Parameter] public Order order { get; set; }
...
<RadzenButton Click="@((args) => dialogService.Close(order))" Text="OK" Style="margin-bottom: 10px; width: 150px" />
...

thanks! that was quick! :slight_smile:

how about showing a popup within a popup? do we need to do anything special in our code, or is it that with the new code fix, if we do something like the code below in the first popup, the second popup will just show up correctly now?
<RadzenButton Text=@($"Show OrderID: {orderID} details") Click="@(args => dialogService.Open($"Order {orderID}",
new Dictionary<string, object>() { { "Order", order } },
new DialogOptions(){ Width = "700px", Height = "530px", Left = "calc(50% - 350px)", Top = "calc(50% - 265px)" }))" />
...

You want to show new dialog from already opened dialog? You can do that however since the dialog at the moment is considered as modal it will close the previous dialog.

<RadzenButton Text=@($"Show another dialog") Click="@(args => dialogService.Open<DataGridPage>($"Another dialog",
                          new Dictionary<string, object>() { },
                          new DialogOptions(){ Width = "800px", Height = "600px", Left = "calc(50% - 400px)", Top = "calc(50% - 300px)" }))" />

Multiple dialogs at the same time is not supported.

ok. bummer, but thanks for clarifying!

I've just published Radzen.Blazor 1.1.35 with support for multiple dialogs! The dialog is still modal (you cannot interact with the UI behind the dialog) however you can open dialog over dialog.

oh wow! thank you very much!