Modal Body内容被取代：Twitter Bootstrap

我正在开发一个网站，通过使用twitter bootstrap，smarty，jquery和php。我对Bootstrap很新。Modal Body内容被取代：Twitter Bootstrap

所以我准备了一个收集申请人数据的页面。

HTML内容：

{include file="admin/admin.header.tpl"} 
<div class="summary"> 
    <table class="table table-striped table-hover"> 
     <thead> 
      <tr> 
       <th>Applicant Name</th> 
       <th>Email</th> 
       <th>Mobile No.</th> 
       <th>Details<th> 
      </tr> 
     </thead> 
     <tbody> 
      {foreach from=$totalApplicantSummary key=key item=value} 
       <tr> 
        <td>{$value.applicant_name}</td> 
        <td>{$value.email}</td> 
        <td>{$value.mobile}</td> 
        <td><a data-toggle="modal" href="?e={$value.email}&fid={$formId}" data-target="#myModal" data-keyboard="false">view more</a></td> 
       </tr> 
      {/foreach} 
     </tbody> 
    </table> 
    <div id="myModal" class="modal hide fade in" aria-hidden="true" style="display: none;"> 
     <div class="modal-header"> 
      <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button> 
      <h3 id="myModalLabel">Modal header</h3> 
     </div> 
     <div class="modal-body" > 
      <h1>Hi</h1> 
     </div> 
     <div class="modal-footer"> 
      <button class="btn btn-primary" data-dismiss="modal" aria-hidden="true">Close</button> 
     </div> 
     <!-- Modal --> 
    </div> 
</div> 
{include file="admin/admin.footer.tpl"}

NB：admin.footer.tpl包含bootstrap.min.js和jquery.min.js。

我想干什么？

要查看总申请人数据我已经给视图更链路将被显示在一个模态。

我已将模式定义为“#myModal”，并将“HI ....”定义为MODAL BODY CONTENT。

我的问题是什么？

查看更多链接显示MODAL其中包含了以前的内容（总页面即申请人的姓名，电子邮件，移动与标题一起，页脚），而不是“HI ......”。

那么如何显示嗨...而不是整个页面的内容。

在此先感谢。

为了更好地提供输出的问题图像。

前查看更多链接被点击：

enter image description here

链接后

莫代尔内容点击：

enter image description here

来源

2013-03-09 Sam

请问您可以参考我们的测试页面......我们会更容易地帮助您。谢谢 – Shail 2013-03-09 11:43:15

@Shail：我需要附加渲染页面的图像吗？ – Sam 2013-03-09 11:49:13

如果您可以创建测试页面将会很好 – Shail 2013-03-09 11:53:22

好像你正在努力使模态抢远程页面的内容。

查看以下page，了解在Bootstrap中使用Modals远程页面的示例。

基本上，如果提供了远程URL，内容将通过jQuery的加载方法加载并注入.modal体。如果您使用的是数据api，则可以使用href标记指定远程源。这方面的一个例子如下所示：

<a data-toggle="modal" href="remote.html" data-target="#modal">click me</a>

如果你是不是想从远程页面发送数据，那么你的问题是，你的href标记需要包含的模式，即的ID：#myModal。

来源

2013-03-09 12:39:55 Kisuka

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

来源

2014-04-16 05:31:49 user3250943

Modal Body内容被取代：Twitter Bootstrap

回答

相关问题