0

I'm trying to render partial view in parent view by click on the select box option. But when I access parent view the error such InvalidOperationException: The model item passed into the ViewDataDictionary is of type 'System.Collections.Generic.List1[identity_2auth_mvc.Models.Klas.Course]', but this ViewDataDictionary instance requires a model item of type 'identity_2auth_mvc.Models.Klas.NoticeUploadViewModel' is occurred. I've referenced some related threads and tried to avoid the child model is null. However, the error isn't still resolved yet.

This is parent action in Controller

    public async Task<IActionResult> Index()
    {
        var courses = await _context.Course.ToListAsync();
        return View(courses);
    }

This is child action

    public IActionResult NoticePartial()
    {
        var noticeViewModel = LoadFiles();
        if (noticeViewModel != null) 
            return PartialView("_NoticePartail", noticeViewModel);
        return NotFound();
    }

    private async Task<NoticeUploadViewModel> LoadFiles()
    {
        var viewModel = new NoticeUploadViewModel();
        viewModel.NoticesViewModel = await _context.Notice.ToListAsync();
        return viewModel;
    }

The models are

    public class Course
    {
        public int CourseId { get; set; }
        public string CourseName { get; set; }

        public ICollection<NoticeViewModel> Notices { get; set; }
    }

    public class NoticeUploadViewModel 
    {
        public AppUser AppUser { get; set; }
        public List<NoticeViewModel> NoticesViewModel { get; set; }
    }

And finally the views I try to render.

Index.cshtml is parent view

@model IEnumerable<Course> 
@{
    ViewData["Title"] = "Index";
    Layout = "~/Views/Shared/_Layout.cshtml";
}

<div class="container text-center">
    <div class="row">
        <div class="col-sm-4 form-inline">
            <span>Semester</span>
            <select class="custom-select">
                <option>Semester</option>
            </select>
        </div>
        <div class="col-sm-4 offset-4 form-inline">
            <span>Course </span>
            <select class="custom-select">
                @foreach (var course in Model)
                {
                    <option id="course_notice">@course.CourseName</option>
                }     
            </select>
        </div>
    </div>
</div>
<hr />

<section class="text-center">
    <div class="container">
        <div class="row" id="notice_dashboard">
            <partial name="_NoticePartial" />
        </div>
    </div>
</section>


@section Scripts
{
    <script>
        $(document).ready(function () {
            $("#course_notice").click(function () {
                $("notice_dashboard").load("/Notice?handler=Partial");
            });
        });
    </script>
} 

And _NoticePartial.cshtml is the child view

@model NoticeUploadViewModel
@{
    ViewData["Title"] = "Notice Partial";
}

<h4>Child View</h4>
frankiie
  • 456
  • 1
  • 6
  • 19
  • I suspect https://stackoverflow.com/questions/12530016/what-is-an-mvc-child-action may be of value to you. – mjwills Jul 02 '21 at 08:29
  • @mjwills Thank you for comment. Your provided thread didn't help me directly but it made me found some related threads that helped me out! This is https://stackoverflow.com/questions/26916664/html-action-in-asp-net-core. – frankiie Jul 02 '21 at 08:46
  • Awesome to hear. – mjwills Jul 02 '21 at 08:50

0 Answers0