从父视图调用时，模态弹出窗口未在部分视图中加载

Question

I am trying to call a modal on a partial view from a view but am not getting ajax success call, but dont know how to do it:

Here is what i have, javascript ajax code on my page:

var TeamDetailPostBackURL = '/BMApproval/GetMeetingApprovalData';
$(function () {
    $(document).on('click','.LeadCode', function () {
    //$(".LeadCode").click(function () {
        debugger;

        var $buttonClicked = $(this);
        var id = $buttonClicked.attr('data-id');
        var options = { "backdrop": "static", keyboard: true };
        alert("load");

        $.ajax({
            type: "GET",

            url: TeamDetailPostBackURL,
            contentType: "application/json; charset=utf-8",
            data: { "dataValue": id },
            datatype: "json",
            success: function (data) {
                debugger;
                $('#myModalContent').html(data);
                $('#myModal').modal(options);

                $('#myModal').modal('show');

            },
            error: function () {
                alert("Dynamic content load failed.");
            }
        });
    });

And parameters I am passing in ajax call

<td><a href="javascript:void(0);" class="LeadCode" data-id="@LPOPoint.LeadCode|@LPOPoint.ApprovalType">@LPOPoint.LeadCode</a></td>

Also calling modal popup in the same javascript page which will popup on the partial view.

<div id='myModal' class='modal' style="overflow-y:hidden;">
<div class="modal-dialog" style="overflow-y: scroll; max-height:85%;  margin-top: 20px; margin-bottom:20px;">
    <div class="modal-content">
        <div id='myModalContent'></div>
    </div>
</div></div>

I searched a lot in various forums but couldn't get any solution. When am clicking on html link the popup doesn't load in the partial view. And ("Dynamic content load failed."); is displayed as it doesn't get to success. Basically I want to view data in modal popup in partial view based on the parameters from parent view. Any help would be appreciated.

Answer 1

1. At the first sight looks like you need TeamDetailPostBackURL variable to contain a proper URL including scheme, host (and port if needed) like 'http://example.com/BMApproval/GetMeetingApprovalData'

2. You can specify error parameter in the error callback to see what exactly is wrong

     error: function (error) { console.error(error) alert("Dynamic content load failed."); }