Question

我正在使用twitter bootstrap模型在asp.net mvc中加载我的不同视图，但模态只加载一次，所以如果我点击一个链接，bootstrap模式显示正确的视图，但如果我那么点击另一个链接，模态仍显示上一个视图，我必须重新加载页面再次单击以显示不同的内容。

这些是来电者页面中的链接：

 <a href="/Categorias/Details/@item.IdCategoria" data-toggle="modal" data-target="#pageModal"><span class="glyphicon glyphicon-list-alt"></span>&nbsp;Detalle</a>
 <a href="/Categorias/Edit/@item.IdCategoria" data-toggle="modal" data-target="#pageModal"><span class="glyphicon glyphicon-pencil"></span>&nbsp;Editar</a>

这是来电者页面中的模式：

    <!-- Start - Modal -->
    <div class="modal fade" id="pageModal" tabindex="-1" role="dialog" aria-labelledby="pageModalLabel" aria-hidden="true">
      <div class="modal-dialog">
        <div class="modal-content">
        </div>
      </div>
    </div>
    <!-- End - Modal -->

这是链接调用的其中一个视图：

<div class="modal-header">
    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;   </button>
    <h4 class="modal-title" id="imageModalLabel">@ViewBag.Title</h4>
</div>
<div class="modal-body">
    <ul class="list-group">
        <li class="list-group-item">@Html.LabelFor(model => model.NombreCategoria)<span class="badge">@Html.DisplayFor(model => model.NombreCategoria)</span>
        </li>
    </ul>
</div>
<div class="modal-footer">
    <button type="button" class="btn btn-default" data-dismiss="modal">Cerrar</button>
</div>

希望有人可以帮助我。谢谢！：）

Answer 1

我用来获取每个链接的数据，并在iFrame

的帮助下将其加载到模型中

 <a href="#" onclick="javascript:GetMyPageData('+ @Model.Id+')" > Link 1</a>

JS

  function GetMyPageData(Id) {
        var url = '@Url.Action("Action", "Controller")' + '?id=' + Id
        $('#pageModal').on('show', function () {
            $('#page_model_data').attr("src", url);
        });
        $('#pageModal').modal({ show: true });

    }

主视图。型号持有人

<div id="pageModal" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="pageModalLabel"
    aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-body container-fluid" style="height: 450px; overflow: hidden;">
                <iframe id="page_model_data" src="" scrolling="no" style="zoom: 0.60; position: relative;"
                    frameborder="0" width="100%" height="100%"></iframe>
            </div>
        </div>
    </div>
</div>

加载到iFrame src的部分视图

<div class="modal-header">
    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;   </button>
    <h4 class="modal-title" id="imageModalLabel">@ViewBag.Title</h4>
</div>
<div class="modal-body">
    <ul class="list-group">
        <li class="list-group-item">@Html.LabelFor(model => model.NombreCategoria)<span class="badge">@Html.DisplayFor(model => model.NombreCategoria)</span>
        </li>
    </ul>
</div>
<div class="modal-footer">
    <button type="button" class="btn btn-default" data-dismiss="modal">Cerrar</button>
</div>

Twitter Bootstrap Modal只加载一次内容

1 个答案: