Question

修改

我得到了模态弹出（原始问题），但在保存时弹出了一个新问题。点击＆＃34;保存＆＃34;。

时，我一直收到错误消息

Uncaught ReferenceError: csrftoken is not defined
at HTMLButtonElement.<anonymous> (modalShortListDescription.js:7)
at HTMLButtonElement.dispatch (jquery.min.js:3)
at HTMLButtonElement.r.handle (jquery.min.js:3)

这是保存按钮的save.js：

$(document).ready(function() {
$("#description_save").click(function() {
    var description = $("#form.description").val();
  var idList = $("#idList").attr("id_list");
    var url = "/.../update-list-description";
    csrftoken();
    $.ajax({
      type: "POST",
      url: url,
      data: {description : description, idList: idList},
    }).done(function(response){
        $(".modalDescription").modal("hide");
        $(".editDescription").text(description);
    });
  })
})

（已修复）原始问题： 我有一个包含多个标签的页面，需要有可编辑的描述。到目前为止，我可以在第一个选项卡上弹出模式，但是当在另一个选项卡上单击模态的链接时，它不会弹出。如果我可以获得有关在不同选项卡上弹出模式的帮助，那将是非常棒的！

我能找到的最接近的是这个，但他们的修复只是让我的模态根本没有弹出。 Twitter Bootstrap Modal not working in both tabs

这里有list.html：

<div class="tab-content col-xs-12">
{% for list in lists %}
    <input type="hidden" id="idList" id_list="{{list.id}}">
    {% if forloop.first and not createTabActive %}
    <div role="tabpanel" class="tab-pane fade active in" id="list{{list.id}}">
    {% else %}
    <div role="tabpanel" class="tab-pane fade" id="list{{list.id}}">
    {% endif %}
        <div class="content col-xs-12">
            <div class="form-horizontal sort-by col-xs-12">
                <h3>Description</h3>
                    {% if list.description %}
                        <a href="#update-list-description" data-toggle="modal" data-target="#modalDescription" id="editDescription">{{list.description}}</a>
                    {% else %}
                        <a href="#update-list-description" data-toggle="modal" data-target="#modalDescription">None</a>
                    {% endif %}
                {% include "layout/popUp/modal-short-list-description.html" %}
                </div>

这是模态modal-short-list-description.html：

<div class="modal fade" id="modalDescription" role="dialog">
  <div class="modal-dialog">
    <form class="form-horizontal" action="{% url 'update-list-description' %}" method="post">
    {% csrf_token %}
    <!-- Modal content-->
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal">&times;</button>
        <h4 class="modal-title">Description</h4>
      </div>
      <div class="modal-body modal-body-exper modal-body-value modal-body-t">
          <div class="lineEnterValue lineTeamSize lineTitle">
              <div class="form-group {% if form.description.errors %} has-error{% elif form.is_bound %} has-success{% endif %}">
                        <div class="col-sm-10">
                            <textarea name="{{ form.description.html_name }}" class="form-control" id="{{ form.description.id_for_label }}" rows="5" style="margin: 0px; height: 90px; width: 455px;"></textarea>
                        </div>
                        {% if form.description.errors %}
                        <ul class="col-sm-10 col-sm-offset-2 error-list text-danger">
                        {% for error in form.description.errors %}
                            <li>{{ error|escape }}</li>
                        {% endfor %}
                        </ul>
                        {% endif %}
                    </div>
          </div>
      </div>
      <div class="modal-footer modal-footer-value">
        <button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
        <button type="submit" class="btn btn-primary" id="description_save">Save</button>
    </div>
  </div>
</form>
</div>

模态弹出窗口在包含多个选项卡的页面上不起作用

0 个答案: