Question

如何将在Flask中创建的json数据存储到jquery并在其上循环烧瓶。我想将在flask代码中创建的json数据传递给jquery并对其进行循环。给出了flask和jquery。

from flask import Flask, render_template, request, jsonify

app = Flask(__name__)

@app.route('/')
def index():
    return render_template('form.html')

@app.route('/process', methods=['POST'])
def process():

# email = request.form['email'] 
name = request.form['name']
# tmax = 30;
tmax = 30;
tmin = 20;
list2=[]
list2.append([name,tmax,tmin])
for i in range(0,6):
    int(name)=int(name)+1
    tmax=tmax+2
    tmin=tmax-5
    list2.append([name,tmax,tmin])
columns=['DATE','TMAX','TMIN']
df2 = pd.DataFrame(np.array(list2),columns=columns)
#print(df2.to_json(orient = "records", double_precision = 10, force_ascii = True, default_handler = None))
return df2.to_json(orient = "records", double_precision = 10, force_ascii = True, default_handler = None)

# return jsonify({'error' : 'Missing data!'})

if __name__ == '__main__':
   app.run(debug=True)

html代码：

<!DOCTYPE html>
  <html>
    <head>
       <title>AJAX Example</title>

       <script 
src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"> 
      </script>

    </head>
    <body>
      <div class="container">
         <br><br><br><br>
         <form>
            <div>
               <label class="sr-only" for="nameInput">Name</label>
                   <input type="number" class="form-control" 
                        id="nameInput" placeholder="First Name">
            </div>
               <button type="submit" class="btn btn- 
                    default">Submit</button>
          </form>
           <br>
         <div id="successAlert" class="alert alert-success" 
              role="alert" style="display:none;"></div>
         <div id="errorAlert" class="alert alert-danger" role="alert" 
              style="display:none;"></div>
         </div>
        </body>
        <script>
           $(document).ready(function() {

             $('form').on('submit', function(event) {

            $.ajax({
             // data : {
               //   name : $('#nameInput').val(),
               /    // email : $('#emailInput').val()
               // },
                 type : 'POST',
                 url : '/process'
         })
           .done(function(data) {
               console.log('logging');

               if (data.error) {
                 $('#errorAlert').text(data.error).show();
                $('#successAlert').hide();
                }
                 else {
                   $('#successAlert').text('data').show();
                   $('#errorAlert').hide();

              }

           });

           event.preventDefault();

             });

             });



     </script>
      </html>

done中的数据也会捕获在'/ process'中创建的json数据。如果是这样，如何循环和使用它

在flask中创建json并将其传递给jquery

0 个答案: