Question

我有用于显示弹出窗口的模态，当你点击帖子按钮时它会进行ajax函数调用，我也将它作为模态切换但是它不会在提交时切换模态而我不会我知道如何解决它。

div class

<div class="modal fade bs-example-modal-sm2" tabindex="-1" role="dialog" aria-labelledby="mySmallModalLabel" aria-hidden="true" id='post_modal'>
  <div class="modal-dialog modal-sm2">
    <div class="modal-content">
        {% if is_user_profile %}

        <div id='make_post' styly='padding:7px;'>
                <form method='POST'>
                {% csrf_token %}
                title: <input type ='text' id='post_title'><br>
                post:<textarea id='post_text'></textarea><br>
                <button id='makepost' type="button" class="btn btn-primary" data-dismiss="modal">Post</button>
                {% for user in user_data %}
                <input type='hidden' id='username' value='{{user.username}}' >
                {%endfor%}
                </form>
        </div>      
        {%endif%}   
    </div>
  </div>
</div>

ajax电话

            $("#makepost").click(function() {

                    var post_title = document.getElementById("post_title").value;
                    var post_text = document.getElementById("post_text").value;
                    var username = document.getElementById("username").value;

                    $.ajax({
                        url : "/makepost/", 
                        type : "POST",
                        dataType: "json", 
                        data : {
                            csrfmiddlewaretoken: '{{ csrf_token }}',
                            username: username,
                            post_title: post_title,
                            post_text: post_text,
                            },
                            success : function(json) {
                                document.getElementById('output').innerHTML = (json['message']);
                                updatePostSection(json['user_posts']);
                            },
                            error : function(xhr,errmsg,err) {
                                console.log(xhr.status + ": " + xhr.responseText);
                                document.getElementById('output').innerHTML = "Request Failed.";
                            }

                    });
                    return false;  
            });

Answer 1

我不确定问题是该模式在发布后是否不会消失，但如果是这样的话 - 您可以在最后添加到您的成功/错误函数的下一行：

$("#post_modal").modal('hide');

希望有帮助

干杯！

BootStrap Django Jquery模式未关闭Ajax调用提交

1 个答案: