不能在Django模板中使用多个引导程序模态

Question

我正在写一个模板视图，在该视图上我需要打开几种不同的模态-一次只能打开一个。该模板具有选项卡，模态的触发按钮位于选项卡导航和选项卡内容之间。之前，我在类似的视图中使用了多个模式，除了选项卡导航之外，在不同的视图中使用了完全相同的代码，它的工作原理与假设的相同。但是在此模板中，我的模式div嵌套在一起，因此无法进行数据切换。我确定我错过了一些东西，但我不知道是什么

我试图将模态放在所包含的html（noteTable.html）的末尾以分隔模态，但这破坏了我的标签导航-每个标签中的所有内容都会显示在每个标签中

<UsingForm onChangeValue = 
     {this.handleChangeValue} handleSubmit = {this.handleSubmit} name={this.state.name} id={this.state.id}> 
</UsingForm>

<button type="button" class="btn btn-primary" data-toggle="modal" data-target="#newKNAModal">Kosten-Nutzen-Analyse</button>
<button type="button" class="btn btn-secondary" data-toggle="modal" data-target="#newNote"><i class="fas fa-plus"></i> Neue Notiz</button>

<div class="tab-content">
    <div class="tab-pane active" id="details" role="tabpanel">
       {% include 'detailForm.html' %}
    </div>
    <div class="tab-pane" id="notes" role="tabpanel">
       {% include 'noteTable.html' %}
    </div>
    <div class="tab-pane" id="dokumente" role="tabpanel">
       {% include 'documentTable.html' %}
    </div>
</div>

我希望如果我单击按钮，将打开正确的Modal。但是只有第一个打开，第二个只有淡入淡出动画，但没有显示html

Answer 1

最后，我找出了错误所在。它不是模板中的代码，也不是模态的启动。在我的一个模态内容中，这简直是一个缺少的</div>，我在{% include 'newKNA.html' %}中包含了一个。这样，浏览器将所有<div>嵌套在第一个中。