getJSON调用后输入表单未提交

时间:2016-11-02 04:36:10

标签: javascript jquery ajax forms getjson

我一直在尝试创建一个提交表单,它既可以调用getJSON,也可以在html模板上显示响应并提交输入。但我只能提交输入或显示从getJSON调用收到的响应。我已经尝试删除preventDefault方法并将其添加到我的函数但它仍然无法正常工作。 提前感谢您的任何建议!

<form method="post" id="form">
    <div>
        <input type="text" name="newpost" style="width:300px;" placeholder="post here...">
        {% if user %}
            <input type="hidden" name="user_id" value="{{ user.key.id() }}">
            <input id="inputButton" type="submit" value="Done">
            <div id="jsonInfo"></div>
            <script>
                $(document).ready(function (){

                                $('#inputButton').click(function (e) {
                                    var URL = 'URLEXAMPLE';
                                    $.getJSON(URL, function(data){

                                    for (var i = 0; i < data.length; i++){
                                        var info = data[i].content;
                                        $("#jsonInfo").append(info);
                                    };
                                });
                            e.preventDefault();


                        });


                });

            </script>
        {% else %}
            <input type="button" class="button_active" onclick="location.href='/login'" value="Done">
        {% endif %}
    </div>
</form> 

1 个答案:

答案 0 :(得分:0)

在做完之后

$('#form').submit();提交表单,e.preventDefault();目前正在阻止默认表单提交,因此您可以发送ajax请求