【问题标题】:Modal Popup not loading in partial view when calling from parent view从父视图调用时,模态弹出窗口未在部分视图中加载
【发布时间】:2019-01-02 14:38:19
【问题描述】:

我正在尝试从视图中调用部分视图的模态,但没有获得 ajax 成功调用,但不知道该怎么做:

这是我的页面上的 javascript ajax 代码:

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.");
            }
        });
    });

以及我在ajax调用中传递的参数

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

还在同一个 javascript 页面中调用模态弹出窗口,该页面将在部分视图上弹出。

<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>

我在各种论坛上搜索了很多,但找不到任何解决方案。 当我点击 html 链接时,弹出窗口不会加载到部分视图中。 And ("动态内容加载失败。");显示,因为它没有成功。 基本上我想根据父视图的参数在部分视图中查看模式弹出窗口中的数据。任何帮助将不胜感激。

【问题讨论】:

  • TeamDetailPostBackURL 是否存在?此外,如果您尝试发送数据,则类型应该是 POST 而不是 GET
  • 如果您向id 发出警报,它会发出什么警报。它是控制器所需的值吗?此外,当您调试代码时,它是否命中了此方法GetMeetingApprovalData?您是否在浏览器控制台中看到任何错误?
  • 是的,它存在,但我想它在测试环境中工作,但在生产环境中它不工作。 .我所做的是将所有参数发送到控制器,然后从那里将值直接发送到局部视图。这对我有用。谢谢你们的意见。

标签: javascript jquery asp.net-mvc


【解决方案1】:
  1. 乍一看,您需要 TeamDetailPostBackURL 变量来包含正确的 URL,包括方案、主机(和端口,如果需要),如 'http://example.com/BMApproval/GetMeetingApprovalData'
  2. 你可以在错误回调中指定error参数看看到底是什么问题

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

【讨论】:

  • 您好,感谢您的回复。对我来说,我尝试使用带有端口的完整 url 传递,但它没有用。我所做的是将所有参数发送到控制器,然后从那里将值直接发送到局部视图。这对我有用。
猜你喜欢
  • 2012-05-30
  • 1970-01-01
  • 1970-01-01
  • 2017-07-07
  • 2014-09-15
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多