Quantcast
Channel: ASP.NET Core
Viewing all articles
Browse latest Browse all 9386

Using a view component as a modal form

$
0
0

I had created a view component that used a modal container so that a user could click the modal button and launch an edit form for a given page. The view component's Default.cshtml lives in a folder named: "ModalCreateAttempts". The parent form uses a model named "Urodynamics", while the view component uses the model "UrodynamicsAttempt". For several days the modal button worked fine and would display as desired without error. 

Two days ago when running a test, I started getting conflicts between the two models whenever the Modal page was invoked. No changes were made to the View Component itself. No logic in the model controllers refers to the modal view component either,so I am puzzled as to what may be happening here.

I was curious whether someone in the forums has worked with modals and view components and whether they have ever experienced any similar issues?

Any ideas would be welcomed.

Below is some of the code in the view component that I use to generate the form....

@model UrodynamicsAttempt

@{
ViewData["Title"] = "Create";
Layout = "~/Views/Shared/_LayoutVC.cshtml";
}

<a href="#" class="btn btn-primary" data-toggle="modal" data-target="#modal-container">Add An Attempt</a>
<div id="modal-container" class="modal fade" tabindex="-1" role="dialog">
<div class="modal-dialog">
<div class="modal-content">

<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">&times;</span>
</button>
<h2 class="modal-title">Create New Voiding Attempt Record</h2>

<h4>UrodynamicsAttempt Table</h4>
<hr />
</div>
<div class="modal-body">
<div class="col-md-4">
<form id="myform" asp-action="Create">
<div asp-validation-summary="ModelOnly" class="text-danger"></div>
<div class="row">
<div class="form-group">

 assorted controls here....


</form>
</div>
</div>
<div class="modal-footer">
<button type="button" style="width:100px; font-weight:bold;"class="btn btn-default" data-dismiss="modal">Cancel</button>
<button id="btnSubmit" style="background-color:orange; width:100px; font-weight:bold;" type="button" class="btn btn-success" data-dismiss="modal">Submit</button>
</div>

</div>
</div>
</div>


Viewing all articles
Browse latest Browse all 9386

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>