Modal not appearing
See original GitHub issueI have the code set up like the examples given:
_Imports.razor:
@using System.Net.Http
@using Microsoft.AspNetCore.Authorization
@using Microsoft.AspNetCore.Components.Authorization
@using Microsoft.AspNetCore.Components.Forms
@using Microsoft.AspNetCore.Components.Routing
@using Microsoft.AspNetCore.Components.Web
@using Microsoft.JSInterop
@using Blazored
@using Blazored.Modal
@using Blazored.Modal.Services
MainLayout.razor:
@inherits LayoutComponentBase
<div class="header">
<div>
<LoginDisplay />
</div>
</div>
<hr class="accent" />
<div class="px-4 container mt-2">
@Body
</div>
<BlazoredModal />
_Host.cshtml:
@page "/"
@namespace TicketingSolutions.Pages
@addTagHelper *, Microsoft.AspNetCore.Mvc.TagHelpers
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<base href="~/" />
<link href="~/css/bootstrap.min.css" rel="stylesheet" />
<link href="~/css/site.css" rel="stylesheet" />
<link href="~/css/blazored-modal.css" rel="stylesheet" />
@*<link href="~/css/all.min.css" rel="stylesheet" />*@
</head>
<body>
<div id="app">
@(await Html.RenderComponentAsync<App>(RenderMode.ServerPrerendered))
</div>
<script src="~/js/bootstrap.min.js"></script>
<script src="_framework/blazor.server.js"></script>
<script src="https://kit.fontawesome.com/a0cf32fa76.js" crossorigin="anonymous"></script>
@*<script defer src="~/js/all.min.js"></script>*@
</body>
</html>
Origin Component: (truncated for brevity)
@inject IModalService Modal
<td class="align-text-top calendar-click" @onclick="@(() => SubmitDate(date))">@Date</td>
private void SubmitDate(DateTime date)
{
var parameters = new ModalParameters();
parameters.Add("Date", date);
var options = new ModalOptions()
{
Position = "blazored-modal-center"
};
Modal.Show<Submit>("Submit Date", parameters);
}
Submit.razor (modal component)
@using TicketingSolutions.Models
@inject IModalService ModalService
<form>
(stuff)
</form>
@code {
[CascadingParameter] ModalParameters Parameters { get; set; }
private RepActivitySubmission repActivitySubmission { get; set; }
protected override void OnInitialized()
{
base.OnInitialized();
repActivitySubmission = new RepActivitySubmission();
}
private void Cancel()
{
ModalService.Cancel();
}
}
When I press the table cell in the originating component, nothing happens. When I add a breakpoint to the OnInitialized method, it runs, but nothing ever appears.
Thoughts?
Issue Analytics
- State:
- Created 4 years ago
- Comments:18 (6 by maintainers)
Top Results From Across the Web
Bootstrap modal not displaying
It was most likely to cause due to same css class name somewhere in loaded CSS. Therefore, instead of defining modal class as...
Read more >Modal not showing 5.7 - Bug Reports
I make a button to open the modal when i click the button modal not showing on preview . The only way i...
Read more >Modal not showing : r/bootstrap
Modal not showing. Hey! This is my first post here. I usually code in Python, where make small flask projects(websites) that's when i...
Read more >Modal not showing when used with Bootstrap V4 · Issue #280
I can confirm the issue and the workaround. With Boostrap 4.0.0-alpha.6, calling the open method makes the application appear to hang, scrolling ...
Read more >Bootstrap Modal Not showing
I'm trying to use bootstrap modal for editing/updating data, the first modal I created worked, but the second one that I had created...
Read more >
Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free
Top Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
I think I’ve found an issue. blazored-modal.css is empty
@arumford Have you done a hard refresh on your browser or cleared the cache to make sure that is not an issue? Otherwise, could you provide a screenshot or a repro of the issue?