Is It Possible To Call A Modal Popup (javascript) In MVC Controller Return

I am wondering if it is possible to call a JavaScript method (which displays a Modal as a popup) in the return method of a controller. string name = home.entityDetails.Name; if (na

Solution 1:

Best way to handle this is using Bootstrap modals and javascript inside your view.

Since you're using Partial view, I assume that you have another parent view such as Index View. You can attach html for your modals using javascript inside parent view, and then open your Partial view from Parent view. Here is an example of the same.

Index.cshtml

<div class="container">
        <a href="@Url.Action("NotFound", "Name")" id="NotFound" class="btn btn-primary">
</div>

    <div class="modal fade" id="NotFound-Model" tabindex="-1" role="dialog" aria-    labelledby="myModalLabel" aria-hidden="true">
        <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>
                    <h4 class="modal-title">Add Holiday</h4>
                </div>
                <div class="divForNotFound">
                </div>
            </div>
        </div>
    </div>

JAVASCRIPT to handle Bootstrap Modal

    $(document).ready(function () {
            $('#NotFound').click(function (event) {
                event.preventDefault();
                $.get(this.href, function (response) {
                   $('.divForNotFound').html(response);
               });
                $('#Add-NotFound').modal({
                    backdrop: 'static',
                }, 'show');
            });
    }

Assuming you have a partial view NotFound.cshtml

@model Name.NotFoundModel
using (Ajax.BeginForm("NotFound", "Name", new AjaxOptions { HttpMethod = "POST", UpdateTargetId = "div-record", OnSuccess = "$('.close').click()" }))
{
    <div class="modal-body">
        <table class="table-bordered table-responsive table table-striped">
            <tr class="col-lg-12">
                <th class="label-primary">
                    @Html.Label("NotFoundLabel")
                </th>
            </tr>
        </table>
    </div>
}

Hope that helps!