I am working on having a button setup that opens a blazored modal that allows a user to enter in the hours and minutes worked on a request, as well as adding comments. I started using the Blazored.Modal nuget package the [CascadingParameter] is used for closing or submitting the data in the modal. When looking through with a break point on I found that the
[CascadingParameter] BlazoredModalInstance BlazoredModal { get; set; }
comes back NULL when I try to pass data in form the parent object. I have attached my code for my issue below. Thanks for your help and responses in advanced.
@using Logscan_Request.Shared
@using Logscan_Request.Pages.Modal
@using Logscan_Request.Shared.Tabs
<div class="card-header" @onclick="Expand">
<div class="row">
<div class="col">
<label><b>ORI:@RequestItem.ORI</b></label>
</div>
<div class="col">
<label><b>Agency Name:@RequestItem.AGENCY_NAME</b></label>
</div>
<div class="col">
<label><b>Requestor:@RequestItem.Request_LName, @RequestItem.Request_FName</b></label>
</div>
<div class="col">
<label><b>Date Submitted:@RequestItem.AddWhen</b></label>
</div>
<div class="col">
@if (RequestItem.Priority.Equals("Urgent"))
{
<label><b>Priority:
<span class="badge badge-danger">
<span class="oi oi-warning"></span> @RequestItem.Priority
</span>
</b></label>
}
else
{
<label>
<b>
Priority:
<span class="badge badge-success">
<span class="oi oi-bell"></span> @RequestItem.Priority
</span>
</b>
</label>
}
</div>
@if (RequestItem.Completed == 0)
{
<div class="col">
<span class="badge badge-warning">
<span class="oi oi-plus"></span> New Logscan
</span>
</div>
}
else
{
<div class="col">
<span class="badge badge-success">
<span class="oi oi-check"></span> Completed
</span>
</div>
}
</div>
</div>
<div class="card p-3 shadow @collapsed">
<div class="card p-3 shadow">
<div class="card-header bg-dark">
<label class="text-white">Agency Information</label>
</div>
<div class="card-body border-light">
<div class="row">
<div class="col">
<label>Agency Name: </label>
<p>@RequestItem.AGENCY_NAME</p>
</div>
<div class="col">
<label>ORI:</label>
<p>@RequestItem.ORI</p>
</div>
<div class="col">
<label>Address:</label>
<p>@RequestItem.ADDRESS</p>
</div>
</div>
</div>
</div>
<br />
<div class="card p-3 shadow">
<div class="card-header bg-dark">
<label class="text-white">Supervisor Information</label>
</div>
<div class="card-body">
<div class="row">
@if (string.IsNullOrEmpty(RequestItem.Supervisor_FName) && string.IsNullOrEmpty(RequestItem.Supervisor_LName))
{
}
else
{
<div class="col">
<label>Name: </label>
<p>@RequestItem.Supervisor_LName, @RequestItem.Supervisor_FName</p>
</div>
}
<div class="col">
<label>Phone:</label>
<p>@RequestItem.Supervisor_Phone</p>
</div>
<div class="col">
<label>Cell Phone:</label>
<p>@RequestItem.Cell_Phone</p>
</div>
@if (String.IsNullOrEmpty(RequestItem.Fax_Number))
{
}
else
{
<div class="col">
<label>Fax:</label>
<p>@RequestItem.Fax_Number</p>
</div>
}
</div>
</div>
</div>
<br />
<div class="card p-3 shadow">
<div class="card-header bg-dark">
<label class="text-white">Requestor Information</label>
</div>
<div class="card-body">
<div class="row">
<div class="col">
<label>Title:</label>
<p>@RequestItem.Request_Title</p>
</div>
<div class="col">
<label>Name:</label>
<p>@RequestItem.Request_LName, @RequestItem.Request_FName</p>
</div>
<div class="col">
<label>Email:</label>
<p>@RequestItem.Email</p>
</div>
<div class="col">
<label>Phone/Ext:</label>
@if (String.IsNullOrEmpty(RequestItem.Extension))
{
string NoExtension = RequestItem.Phone_number;
<p>@NoExtension</p>
}
else
{
string AddExtension = RequestItem.Phone_number + " / " + RequestItem.Extension;
<p>@AddExtension</p>
}
</div>
</div>
</div>
</div>
<br />
<div class="card p-3 shadow">
<div class="card-header bg-dark">
<label class="text-white">Logscan Information</label>
</div>
<div class="card-body">
<div class="row">
<div class="col">
<label>Time to be searched:</label>
<p>@RequestItem.Timeframe_To_Be_Searched</p>
</div>
<div class="col">
<label>Request Reason:</label>
<p>@RequestItem.Request_Reason</p>
</div>
<div class="col">
<label>Request Type:</label>
<p>@RequestItem.SearchType</p>
</div>
<div class="col">
<label>Criteria:</label>
<p>@RequestItem.Criteria</p>
</div>
</div>
</div>
</div>
<br />
<div class="row">
<div class="col-2 justify-content-start">
<button class="btn btn-secondary" @onclick="OpenReportDialog">View Report</button>
<button class="btn btn-secondary" @onclick="OpenAssignReport">Assign</button>
<ViewReportDialog @ref="ViewReportDialog" OnPrint="Print" OnClose="CloseDialog" RequestedItem="RequestItem" />
<PrintDialog @ref="PrintDialog" OnPrint="Print" OnClose="CloseDialog" />
@if (clicked == true)
{
<CascadingValue Value="RequestItem">
<Assign_Report inModel="RequestItem"></Assign_Report>
</CascadingValue>
}
</div>
</div>
</div>
Code Behind page
using Blazored.Modal.Services;
using Logscan_Request.Pages.Modal;
using LogscanRequest.Shared.Domain;
using Microsoft.AspNetCore.Components;
using System;
using System.Collections.Generic;
using System.Linq;
using System.Threading.Tasks;
namespace Logscan_Request.Pages
{
public partial class LogscanRequestItem
{
[CascadingParameter] public IModalService Modal { get; set; }
[Parameter] public LogscanRequestModel RequestItem { get; set; }
public ViewReportDialog ViewReportDialog { get; set; }
public PrintDialog PrintDialog { get; set; }
public Assign_Report Assign_Report { get; set; } = new Assign_Report();
protected string collapsed { get; set; } = "collapse";
protected bool Expanded;
protected void Expand()
{
if (!Expanded)
{
Expanded = true;
collapsed = string.Empty;
}
else
{
Expanded = false;
collapsed = "collapse";
}
}
private void OpenReportDialog()
{
ViewReportDialog.Show();
}
async Task OpenAssignReport()
{
Assign_Report.Show();
}
private void CloseDialog()
{
StateHasChanged();
}
public void Print()
{
ViewReportDialog.Close();
PrintDialog.Show();
StateHasChanged();
}
}
}
Modal page code behind
using Blazored.Modal;
using Blazored.Modal.Services;
using LogscanRequest.Shared.Domain;
using Microsoft.AspNetCore.Components;
using Microsoft.AspNetCore.Components.Forms;
using Microsoft.AspNetCore.Http;
using System;
using System.Collections.Generic;
using System.Linq;
using System.Threading.Tasks;
namespace Logscan_Request.Pages.Modal
{
public partial class Assign_Report
{
//[Inject] IHttpContextAccessor HttpContext { get; set; }
[Parameter] public LogscanRequestModel requestMod { get; set; }
[CascadingParameter] public IModalService Modal { get; set; }
[CascadingParameter] BlazoredModalInstance BlazoredModal { get; set; }
private EditContext EditContext;
private bool ShowDialog { get; set; }
async Task Close()
{
ShowDialog = false;
StateHasChanged();
await BlazoredModal.CloseAsync(ModalResult.Ok(true));
}
async Task Cancel() => await BlazoredModal.CancelAsync();
protected override void OnInitialized()
{
ShowDialog = false;
//EditContext = new EditContext(RequestMod);
//RequestMod.ModifyBy = HttpContext.HttpContext.User.Identity.Name;
}
private async Task HandleValidSubmit()
{
}
public void Show()
{
Modal.Show<Assign_Report>();
}
}
}
Error: System.InvalidOperationException: Object of type 'Logscan_Request.Pages.Modal.Assign_Report' does not have a property matching the name 'Assign_Report'. at Microsoft.AspNetCore.Components.Reflection.ComponentProperties.ThrowForUnknownIncomingParameterName(Type targetType, String parameterName) at Microsoft.AspNetCore.Components.Reflection.ComponentProperties.SetProperties(ParameterView& parameters, Object target) at Microsoft.AspNetCore.Components.ComponentBase.SetParametersAsync(ParameterView parameters) at Microsoft.AspNetCore.Components.Rendering.ComponentState.SetDirectParameters(ParameterView parameters) at Microsoft.AspNetCore.Components.RenderTree.RenderTreeDiffBuilder.InitializeNewComponentFrame(DiffContext& diffContext, Int32 frameIndex) at Microsoft.AspNetCore.Components.RenderTree.RenderTreeDiffBuilder.InitializeNewSubtree(DiffContext& diffContext, Int32 frameIndex) at Microsoft.AspNetCore.Components.RenderTree.RenderTreeDiffBuilder.InsertNewFrame(DiffContext& diffContext, Int32 newFrameIndex) at Microsoft.AspNetCore.Components.RenderTree.RenderTreeDiffBuilder.InsertNewFrame(DiffContext& diffContext, Int32 newFrameIndex) at Microsoft.AspNetCore.Components.RenderTree.RenderTreeDiffBuilder.InsertNewFrame(DiffContext& diffContext, Int32 newFrameIndex) at Microsoft.AspNetCore.Components.RenderTree.RenderTreeDiffBuilder.AppendDiffEntriesForRange(DiffContext& diffContext, Int32 oldStartIndex, Int32 oldEndIndexExcl, Int32 newStartIndex, Int32 newEndIndexExcl) at Microsoft.AspNetCore.Components.RenderTree.RenderTreeDiffBuilder.ComputeDiff(Renderer renderer, RenderBatchBuilder batchBuilder, Int32 componentId, ArrayRange
1 oldTree, ArrayRange
1 newTree) at Microsoft.AspNetCore.Components.Rendering.ComponentState.RenderIntoBatch(RenderBatchBuilder batchBuilder, RenderFragment renderFragment) at Microsoft.AspNetCore.Components.RenderTree.Renderer.RenderInExistingBatch(RenderQueueEntry renderQueueEntry) at Microsoft.AspNetCore.Components.RenderTree.Renderer.ProcessRenderQueue()