Python Flask Web应用程序-多行输入选项

Question

I am building a Flask application that has a text box and allows users to type in a domain name and submit the form with a button (the results of the search appear in HTML below the search box). 我正在构建一个Flask应用程序，该应用程序具有一个文本框，允许用户键入域名并使用按钮提交表单（搜索结果显示在搜索框下方的HTML中）。 I want to support multiple domain entry at once using a textarea input box. 我想使用textarea输入框一次支持多个域输入。 How can I use a button to toggle the form (or use a separate form) between using the text box input and the text area based on the button the user selects? 如何使用按钮根据用户选择的按钮在使用文本框输入和文本区域之间切换表单（或使用单独的表单）？ And how can I take the input from the related box and process it in python? 我如何从相关框中获取输入并在python中进行处理？

Answer 1

You can rely on a single line of input and use jquery to keep adding new domains as needed: 您可以依靠单行输入并使用jquery继续根据需要添加新域：

app.py : app.py ：

import flask
app = flask.Flask(__name__)

@app.route('/', methods=['GET', 'POST'])
def home():
  return flask.render_template('get_domains.html')

@app.route('/add_domain')
def add_domain():
  _domains = flask.request.args.getlist('domains[]') 
  return flask.jsonify({"success":"true"})
  #do something with domains

In get_domains.html , use jquery to get all entries and ajax to communicate with the /add_domain route: 在get_domains.html ，使用jquery获取所有条目，并使用ajax与/add_domain路由进行通信：

<html>
 <header>
   <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
 </header>
 <body>
   <div class='outer'> <!--Used to anchor jquery updates -->
     <div class='input_section'></div>
     <button class='add_domain'>Add domain</button>
   </div>
 </body>
 <script>
  $(document).ready(function(){
   var count = 1;
   var button_count = 0;
   $('.outer').on('click', '.add_domain', function(){
    var new_html = `
    <input type='text' name='domain' id='domain${count}'>
    <div class='spacer' style='height:10px;'></div>
    `
    $('.input_section').append(new_html);
     count += 1;
     if(button_count == 0){
       $('.outer').append('<button class="submit_data" id="submit_stuff">Add all</button>')
       button_count += 1;
     }
    });
     $('.outer').on('click', '.submit_data', function(){
      var results = [];
      for (var i = 1; i < count; i++){
       results.push($('#domain'+i.toString()).val());
      }
      $('.input_section').html('');
      $('#submit_stuff').remove();
      count = 1;
      button_count = 0;
      $.ajax({
      url: "/add_domain",
      type: "get",
      data: {domains: results},
       success: function(response) {
       //pass
      },
       error: function(xhr) {
      //pass
     }
   });
    });
  });
 </script>
</html>

Result: 结果：

Python Flask Web应用程序-多行输入选项

问题描述

1 个解决方案

解决方案1
0 2018-08-01 16:55:48

Python Flask Web应用程序-多行输入选项

问题描述

1 个解决方案

解决方案1 0 2018-08-01 16:55:48

解决方案1
0 2018-08-01 16:55:48