Flask-动态添加表单节

我试图找出html中的多表单输入

以下是我的问题:

当我点击“添加一个更多的部分”，我想有相同的网页表单输入作为新的部分。请帮我解决这个问题

多谢各位

我用的是flaskhtml

<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/js/bootstrap.min.js"></script>
<script src="//code.jquery.com/jquery-1.11.1.min.js"></script>
<!------ Include the above in your HEAD tag ---------->

<div class="container">
    <div class="row">
      <form role="form">
        <div class="form-group col-xs-10 col-sm-4 col-md-4 col-lg-2">
            <label for="JIRA">JIRA ticket</label>
            <input type="text" class="form-control" id="JIRA" placeholder="JIRA ticket">
        </div>
        <div class="form-group col-xs-8 col-sm-2 col-md-2 col-lg-3">
            <label for="Assignee">Assignee</label>
            <input type="text" class="form-control" id="Assignee" placeholder="Assignee">
        </div>
        <div class="clearfix"></div>
        <div class="form-group col-xs-10 col-sm-4 col-md-4 col-lg-7">
            <label for="Issue">Issue</label>
            <input type="text" class="form-control" id="Issue" placeholder="Issue">
        </div>
        <div class="form-group col-xs-10 col-sm-4 col-md-4 col-lg-9">
            <label for="Description">Description</label>
            <textarea name="Description" rows="5" class="form-control" placeholder="Description" required></textarea>
        </div>
           <div class="form-group col-xs-10 col-sm-4 col-md-4 col-lg-4">
            <label for="Comments">Comments</label>
            <textarea name="Comments" rows="4" class="form-control" placeholder="Comments" required></textarea>
        </div>
             <div class="form-group col-xs-8 col-sm-2 col-md-2 col-lg-3">
            <label for="Status">Status</label>
            <input type="text" class="form-control" id="Status" placeholder="In-progress or Resolved">
        </div>
        <div class="form-group">
            <div class="col-xs-offset-3 col-xs-9">
                <input type="submit" class="btn btn-primary" value="Submit"/>
                <input type="reset" class="btn btn-default" value="Reset"/>
                <input type="button" class="btn btn-default" value="Add one more section"/>
            </div>
    </form>
    <div class="clearfix"></div>

    <br /><br />
    </div>
</div>

吉拉票
受让人
问题
描述
评论
地位

您需要在.js文件中实现一些AJAX。单击“添加”按钮时，另一个表单将附加到现有表单上

function addsectionFunction() {
var csrftoken = $('meta[name=csrf-token]').attr('content')

$.ajaxSetup({
    beforeSend: function(xhr, settings) {
        if (!/^(GET|HEAD|OPTIONS|TRACE)$/i.test(settings.type)) {
            xhr.setRequestHeader("X-CSRFToken", csrftoken)
        }
    }
})

$.ajax({
    url: '/add-section',
    data: JSON.stringify(data),
    method: 'POST',
    contentType: 'application/json',
    success: function(data) {
        $('#the-formdiv-id').append(data);
    }
});
};

添加节HTML按钮。

再添加一节

“/add section”

视图可能类似于：

@app.route('/add-section', methods=['GET', 'POST')
def add_section():
    return render_template('new-section.html')

---

嗨，罗伊，谢谢你对这个请求的意见。正如您所提到的，我已经通过使用jquery创建动态文本框实现了我的请求。但是现在，我无法将动态文本框的输入重定向到另一个html页面。你们能帮我一下吗？我不明白。嗨，罗伊，目前的问题是无法将表单输入重定向到另一个HTML页面。然而，我发现可以将输入重定向到另一个HTML页面，但能够获取第一行输入的值，而不是动态创建的输入值