Question

我有一个充满服务器名称的表。当我点击链接时，它会转到包含有关所述服务器的各种信息的页面。我正在使用SSO来确定用户是否能够通过带有可选项的Dropbox框更改某些字段。这一切都很有效....作为一个页面

但是，我想将该页面转换为模态。我有模态工作，它提取所有信息...但是，下拉框只能每隔一段时间工作。毫不夸张，每隔一段时间。我单击一个服务器，模式出现，下拉列表中没有值。我可以用firebug检查它，并看到它在下拉列表中有值但没有任何反应。我关闭模态，点击一个链接（相同或不同），下拉列表工作正常

这是我的HTML

<td><a href="{{ url_for('vm', vm=vm.GuestName) }}" data-keyboard="false" data-target="#vmModal" data-toggle="modal"> {{ vm.GuestName }}</a></td>

这是我的模态

<div class="modal hide fade in" id="vmModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-header">
      <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
      <h3 id="myModalLabel">Virtual Machine Info</h3>
    </div>
    <div class="modal-body" style="height: 600px; right: 12px">
    </div>
    <div class="modal-footer">
      <button type="button" class="btn btn-default" data-dismiss="modal" aria-hidden="true">Close</button>
    </div>
</div><!-- /.modal -->

这是我的下拉列表

{% if access %}
        <div class="dropdown">
            <li>
                <strong>Service:</strong>
                <a class="btn dropdown-toggle" data-toggle="dropdown" href="#"> {{ item.Service }} <b
                        class="caret"></b></a>
                <ul class="dropdown-menu" role="menu">
                    {% for service in service_data %}
                        <li><a tabindex="-1"
                               href="/api?name={{ item.GuestName }}&service={{ service.name }}"> {{ service.name }}</a>
                        </li>
                    {% endfor %}
                </ul>
            </li>
        </div>

Answer 1

我刚解决了一个非常类似的问题，我的模态对话框导致下拉菜单只在我打开模态对话框的每一次工作。下拉菜单最初会起作用。但如果我打开并关闭模态，它将停止工作。然后，如果我打开模态并再次关闭它，下拉菜单将再次起作用。问题只是我的目标url包含模态内容时引用了bootstrap.js文件，当它已在父页面中引用时。因此，我所要做的就是从模态内容页面中删除以下内容：

<script src="../js/bootstrap.min.js"></script>

编辑：实际上，当我从模态内容页面中删除它时，其他元素停止工作，所以我将其添加回来。相反，我将它添加到两次，一次在页面顶部，再次在标签之前的页面底部。现在它每次都有效。我不明白。有没有人知道为什么会这样？

Fabrice G，我尝试过你推荐的东西，但我无法以这种方式工作。我必须有一个不同的问题。

Answer 2

嗨，我有同样的问题; 经过长时间分析，我找到了解决方案添加“style =”display：none;“在div模式上。我不知道为什么但是当你加载页面时隐藏了模态，但如果你用firebug检查模态恢复下拉列表。显示模态后隐藏它; js添加“style =”display：none;“和dropdown工作。

bootstrap下拉部分工作模态

2 个答案: