Python Flask JQuery usage instructions, flaskjquery

Source: Internet
Author: User
Tags tojson

Python Flask JQuery usage instructions, flaskjquery
0. PrefaceRecently, for some reason, I have studied the Flask framework again and used blogs to organize relevant content. The Flask framework is slightly different from Apache + PHP. JS and CSS files in the Flask framework are stored in a relatively fixed location. Generally, it is located in the static folder (see Figure 1 directory structure ). This document uses a simple addition example to illustrate the usage of JQuery and Ajax in the Flask framework. This example runs in Raspberry Pi. Note that this example can also be run on windows and linux platforms. python has good cross-platform performance. [Code repository] The code repository is located in a Bitbucket. You can download a zip package or clone the Code through TortoiseHg. [Related blog] [1] python extension library installation use third-party image source [2] python Flask preschool [3] Front-end Learning -- HTML4 and HTML5 set page Language Character Set [4] Front-end Learning -- JQuery Ajax experience
1. Introduce JQueryThe jquery. js file must be stored in the static folder, and the path of the js file must be specified in the Code at the front end. These paths are "relative paths ". We strongly recommend that you save all files in UTF8 format to avoid Chinese garbled characters. [Directory structure] Fig 1 directory structure [static Directory] -- jqury. js templates templates --main.html [flask-jquery.py]
2. Simple Example[1] Front-end templates --main.html

<! DOCTYPE html> [Brief description] [1] <meta charset = "UTF-8"> the webpage code is UTF8, note that the webpage files must also be saved in UTF8 format [2] <script src = "{url_for ('static ', filename = 'jquery. js') }}"> </script> load jquery in the static folder. js file [3] var $ SCRIPT_ROOT = {request. script_root | tojson | safe}; sorry, I have not understood the meaning for the moment. [4] now: new Date (). getTime () is a small trick to prevent browser caching. [2] The back-end part [flask-jquery.py]
#-*-Coding: UTF-8-*-from flask import Flask, jsonify, render_template, requestapp = Flask (_ name _) @ app. route ("/") def index (): # return render_template ("main.html") @ app. route ('/add') def add_numbers (): a = request. args. get ('A', 0, type = int) B = request. args. get ('B', 0, type = int) return jsonify (result = a + B) if _ name __= = "_ main _": app. run (host = "0.0.0.0", port = 8080, debug = True)
[Brief description] [1] The request. args. get ('A', 0, type = int) frontend submits the request by using the GET method and extracts parameters a and B in the URI. The value 0 in the middle is the default value of a and B. When the function fails to be executed, a or B can only be equal to 0. [2] app. run (host = "0.0.0.0", port = 8080, debug = True ). All IP addresses can be accessed. The port number is 8080 instead of the default port 80.
3 run in Raspberry Pi and transfer the folder FTP as shown in figure 1 to Raspberry Pi, execute the flask-jquery.py to get the python flask-jquery.py
Figure 2 front-end page
Figure 3 background debugging output

How to Use ajax in flask in python to automatically refresh the desired webpage without flash

Flask is a good thing. I will try again now. Ajax refresh is simple. You can learn about jquery. The refresh Part of the result you returned is implemented in js. Call the json response of flask.

I just went to the flask tutorial. Here, it has a pattern for flask, which has a chapter that describes how to reference ajax and jquery. You can add the sample code to your program first, and then create a json response result by yourself. Then, you can use js to display the content. I really don't want to construct html and directly return html. It is also possible to use js. writedocument.

Python ImportError: No module named flask

Import flask and add help (flask) below to check whether the system can find the module you have installed. If an error is reported after running, it indicates that the system cannot find where your module is installed. I guess an error may be reported. If you are using windows, make sure that the path of your module is in the path of environment variable. For more questions, see.

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.