BSModal Nesting/Multi-Modal Support Request

[kalshair]

I am currently working on a project where our users will be creating objects with multiple fields, and will be able to edit those objects. To create these objects, I am currently using a page with modals for selecting each value, as dropdowns are not allowed as per the project requirements. For instance, users need to input a formula from a predetermined list. To accomplish this, I use a modal with a datatable that contains that predetermined list, and they can select and accept one to populate the form field. The final objects populate a sort of 'Recent creations' data table, and clicking one needs to enable editing.

When clicking this, the ideal behavior is that a modal opens, and then clicking a field to edit opens another modal for that field without closing the first modal.

With all this said, it seems Blazored's Modals DO allow for this already. I'd just like a strong integration with Blazorstrap because almost all of my code is already done in Blazorstrap.

[jbomhold3]

Just to make sure I understand the requirements correctly.

<BSModal DataId="modal1">
    <Header>Modal Title</Header>
    <Content>Woohoo, you're reading this text in a modal!
              <!-- Nested Modal -->
              <BSModal DataId="nestedModal">
              <Header>Modal Title</Header>
              <Content>My parent stays open because I'm nested</Content>
             </BSModal>
             <!-- END Nested Modal -->
             <BSButton Color="BSColor.Primary" Target="nestedModal">Launch demo modal</BSButton>
      </Content>
</BSModal>
<BSButton Color="BSColor.Primary" Target="modal1">Launch demo modal</BSButton>

[jbomhold3]

Or are you just wanting a flag that says hey, ill close and open this one myself? Something Like

        /// <summary>
        /// Using this will allow you to manually control the modal show/hide state. It ignores all forwarded events and only responds to the Show/Hide methods.
        /// </summary>
        [Parameter] public bool IsManual { get; set; } 

https://gyazo.com/3bf58f6879d99c8d57ec4fc80e6ef902

[jbomhold3]

90% sure I addressed your requirements. Added in https://www.nuget.org/packages/BlazorStrap/5.1.103-Preview1a See https://blazorstrap.io/VNext/V5/components/modal

[jbomhold3]

No reply fairly sure I resolved the requirements issue closed

[kalshair]

I am so sorry for missing your comments and all that. I have not tested yet, but based on the documentation, it is exactly what I was hoping for. I really appreciate the assist!!

[kalshair]

So, just some quick feedback, as this does seem to work splendidly: is it possible to have the multi and nested modals be affected by the static backdrop parameter? I.e., clicking the background closing or not closing the modal(s) depending on the setup.

[jbomhold3]

Nested is easy enough since would just have to take the parent and set the parent's param. Multi would require better tracking and indexing open modals. Something I'm going to have to do anyway. Since I want to a point we could do something like var modalId = BlazorStrap.Modals.ShowAsync(() => Id.params). modal.HideAsync()

[kalshair]

Semi-related, would it be possible to have static versions of the modal methods that we can pass strings for data-ids to and control them that way?

Example ->

...<\BSModal> @code { public void Blahblah() { BSModal.ShowAsync("modalA") } } ________________________________ From: John Bomhold ***@***.***> Sent: Tuesday, May 23, 2023 12:01:20 PM To: chanan/BlazorStrap ***@***.***> Cc: Kamal Alshair ***@***.***>; Author ***@***.***> Subject: '[EXT]'Re: [chanan/BlazorStrap] BSModal Nesting/Multi-Modal Support Request (Issue #588) This message is from an External Source. Exercise caution when opening attachments and clicking links. Nested is easy enough since would just have to take the parent and set the parent's param. Multi would require better tracking and indexing open modals. Something I'm going to have to do anyway. Since I want to a point we could do something like var modalId = BlazorStrap.Modals.ShowAsync(() => Id.params). modal.HideAsync() — Reply to this email directly, view it on GitHub, or unsubscribe. You are receiving this because you authored the thread.Message ID: ***@***.***> ________________________________ The information contained in this message may be privileged and confidential and protected from disclosure. If the reader of this message is not the intended recipient, or an employee or agent responsible for delivering this message to the intended recipient, you are hereby notified that any dissemination, distribution or copying of this communication is strictly prohibited. If you received this communication in error, please notify us immediately by replying to the message and deleting it from your computer.

[jbomhold3]

Kinda jotting down notes now for myself

[Inject] public IBlazorStrap BlazorStrap {get;set;}
private BSModal _modal;
protected override OnInit()
{
       _modal = BlazorStrap.Modals.Add<ModalComponent>((0 => params)
}

public async Task ShowModal()
{
       await _modal.ShowAsync();
       await BlazorStrap.Modals.ShowAsync<SelfHidingModal>(() => params);
}
public async Task HideModal()
{
       await _modal.HideAsync();
}
public Dispose()
{
       BlazorStrap.Modals.Remove(_modal);
}

[jbomhold3]

BlazorStrap.ForwardClick("data-Id"); already kinda does that. Having statics maybe but would rather add a ShowAsync/HideAsync("data-Id") on the service so it can happen over all toggleable vs just modals

[kalshair]

Didn't even know I could do something like call BlazorStrap like that, but the ShowAsync("data-Id") for toggleables thing makes a lot of sense to me.

[jbomhold3]

yeah, I need to make copilot document the BlazorStrap/Interop service for me and get it added to the docs lol.