Question

我一直在寻找这个问题的答案一段时间没有运气。我遇到过多种解决方案，但它们似乎不适用于我的情况，我无法弄清楚为什么会这样。如果有人能解决这个问题，我将非常感激。我正在使用带有BootStrap 3的VS2013并且有一个索引页面，该索引页面最初在模态视图中准确显示信息，但是当在模态中更新数据时，模式在再次查看时不会刷新。我怀疑这是由于代码中的事物如何分离，但我不确定问题的来源。与我遇到的大多数示例不同，我不得不将我与模态对话框等分开，如下所示，因为我正在学习本教程（http://ericsaupe.com/tag/bootstrap-3-modal-ajax/），以便让bootstrap加载模态。我已尝试使用jquery以及调用hidden.bs.modal函数以重置模式加载的数据，但没有取得任何成功。代码如下（我已经取出了一些毛病）：

_Layout.cshtml：

<!DOCTYPE html>
<html>
<head>
    @Styles.Render("~/Content/css")
    @Scripts.Render("~/bundles/modernizr")

    @Scripts.Render("~/bundles/jquery")
    @Scripts.Render("~/bundles/jqueryval")
    @Scripts.Render("~/bundles/bootstrap")

    @RenderSection("scripts", required: false)

</head>
<body>
    <div class="navbar navbar-inverse navbar-fixed-top"> ... </div>

    <div class="container body-content">
        @RenderBody()
    </div>

    <!-- Modal -->
     <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"></div>
    <!-- /.modal -->


<script type="text/javascript">

    $('a.modalLink').click(function (e) {
        e.preventDefault();

        $('#myModal')
             .removeData('modal')
             .html('loading....')
             .load($(this).attr('href'))
             .modal({ show: true, backdrop: 'static' });

    });

</script>

主/ index.html中：

@model IEnumerable<MyApp.Models.Team>

<ul class="nav nav-tabs">
    @{ var x = 0;}

    @foreach (var team in Model)
    {
        if (x==0)
        {
            <li class="active"><a href="#@team.TeamAbbreviation" data-toggle="tab">@team.TeamName</a></li>   
        }
        else
        {
            <li><a href="#@team.TeamAbbreviation" data-toggle="tab">@team.TeamName</a></li>
        }

        x++;
    }
</ul>

<div class="tab-content">
    @{x = 0;}

    @foreach (var team in Model)
    {
        if (x==0)
        {
            <div id="@team.TeamAbbreviation" class="tab-pane active"><p>@Html.Action("Index", "Person", new{id=@team.TeamID})</p></div>
        }
        else 
        {
            <div id="@team.TeamAbbreviation" class="tab-pane"><p>@Html.Action("Index", "Person", new{id=@team.TeamID})</p></div>
        }

        x++;
    }
</div>

人/ Index.cshtml

@model IEnumerable<MyApp.Models.Person>

@{
    Layout = null;
}

    <table class="table">
        <tr>
            <th>&nbsp;</th>
            <th>
                @Html.DisplayNameFor(model => model.Name)
            </th>
            <th>nbsp;</th>
        </tr>

    @foreach (var item in Model) {
        <tr>
            <td align="right">
                @using (Html.BeginForm("Delete", "Person", new { id = item.PersonID }, FormMethod.Post))
                {
                    @Html.AntiForgeryToken()

                    <div class="form-actions no-color" title="Delete Person">
                        <input type="submit" value="x" class="btnX" onclick="return confirm('Are you sure you want to permanently delete this person from the list?');" /> 
                    </div>
                }
            </td>

            <td style="white-space:nowrap;">
                @Html.DisplayFor(modelItem => item.Name)
            </td>
            <td style="white-space:nowrap">            
                <a href="@Url.Action("Edit", "Person", new { id = item.PersonID })" class="modalLink">&nbsp;Edit Modal</a>
            </td>
        </tr>
    }            
    </table>

人/ Edit.cshtml

@model MyApp.Models.Person

@{
    Layout = null;
}


    <div class="modal-dialog">
        <div class="modal-content">

            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
            </div>

            <div class="modal-body">

                @using (Html.BeginForm())
                {
                    @Html.AntiForgeryToken()

                    <div class="form-horizontal">
                        <center><h4>Edit Information</h4></center>
                        <br />

                        @Html.ValidationSummary(true)
                        @Html.HiddenFor(model => model.PersonID)

                        <div class="form-group">
                            @Html.LabelFor(model => model.TeamID, new { @class = "control-label col-md-3" })
                            <div class="col-md-6">
                                @Html.DropDownList("TeamID")
                                @Html.ValidationMessageFor(model => model.TeamID)
                            </div>
                        </div>

                        <div class="form-group">
                            @Html.LabelFor(model => model.PersonName, new { @class = "control-label col-md-3", @style = "white-space:nowrap" })
                            <div class="col-md-6">
                                @Html.EditorFor(model => model.PersonName)
                                @Html.ValidationMessageFor(model => model.PersonName)
                            </div>
                        </div>
                        <div class="form-group">
                            <div class="col-md-offset-3 col-md-9">
                                <input type="submit" value="Update" class="btn btn-default" />
                            </div>
                        </div>

                    </div>
                }

            </div>
        </div><!-- /.modal-content -->
    </div><!-- /.modal-dialog -->

Answer 1

我知道你说你曾尝试使用hidden.bs.modal重置模态，但不是你在该函数中实际执行的操作。

这对我有用：

$(document.body).on('hidden.bs.modal', function () {
    $('#myModal').removeData('bs.modal')
});

Answer 2

所以，在意识到它没有通过多次点击调用控制器之后，我添加了以下代码来实现这一诀窍：

$.ajaxSetup({
    cache: false
})

有没有更好的方法来实现这个jquery调用而不是全局？

模态数据不刷新（ASP.NET MVC VS2013 / BootStrap3）

2 个答案: