引言:想使用python的flask框架搭建一个日料网站,主要包含web架构,静态页面,后台系统,交互,今天教大家实现ajax操作,返回json。

本节知识:jquery,json,ajax

python环境:python2.7,flask,以及flask相关的库(没有列完,如果运行manage.py时提示未安装的库安装就ok了。)

----example.html    ajax访问后端 我用的jquery,所以使用时需引入jquery

function show_user_msg(id){
//alert(id);
$.getJSON('/admin/get_user',{id:id}, function(msg){
//获取用户信息
msg = JSON.parse(msg[0]);
console.log(msg);
$('.edit_user input[name="id"]').val(msg.id)
$('.edit_user input[name="username"]').val(msg.username);
$('.edit_user input[name="password"]').val(msg.password);
$('.edit_user input[name="repassword"]').val(msg.password);
$('.edit_user input[name="email"]').val(msg.email);
$('.edit_user input[name="phone"]').val(msg.phone);
//$(".edit_user select[name='power']").find("option:contains("+msg.power+")").attr("selected",true);
$(".edit_user select[name='power']").find("option[value="+msg.power+"]").attr("selected",true);
});
}

定义了一个函数,调用这个函数就会ajax访问/admin/get_user ,传入变量id, msg代表后端返回的信息。

如果对jquery不太了解可以去百度下这个$.getJSON这个函数,先不管这个,先去看试图定义的/admin/get_user

------views.py

###获取编辑用户的数据
@main.route('/admin/get_user', methods=['GET'])
def Get_user():
if request.method =='GET' and request.args:
##获取get参数
id = int(request.args.to_dict().get('id'))
##开始查询数据信息
data = Admin.get_user_info(Admin(),id)

data正是orm获取的数据(<Admin 1>),但是不能直接把数据传到html里面,会报错。

于是我打算将这种类型的数据转换成json数据,我们要用到的库是marshmallow,直接pip安装即可。

先新建一个配置文件serializers.py 和models.py在同一目录。

-----serializers.py

# -*- coding: utf-8 -*-
from marshmallow import Schema, fields ###admin表
class AdminSchema(Schema):
id = fields.Int()
username = fields.Str()
email = fields.Email()
password = fields.Str()
power = fields.Int()
phone = fields.Str()

然后在views.py里面修改下。

##引入文件
from ..serializers import AdminSchema
###获取编辑用户的数据
@main.route('/admin/get_user', methods=['GET'])
def Get_user():
if request.method =='GET' and request.args:
##获取get参数
id = int(request.args.to_dict().get('id'))
##开始查询数据信息
data = Admin.get_user_info(Admin(),id)
schema = AdminSchema()
result = schema.dumps(data)
return jsonify(result)

这样返回的类似json字符串东西,然后在js里面讲json字符串转换称json数组。

返回的数据由msg接住,对msg进行处理。

 msg = JSON.parse(msg[0]);

然后就可以使用msg了。

  

flask-日料网站搭建-ajax传值+返回json字符串的更多相关文章

  1. ajax请求返回json字符串/json对象 处理

    1. 返回json字符串如何处理 $.ajax({ url:xxx, success:function(date){ }, error:function(){ } }); 通过最原始的返回: Prin ...

  2. ajax请求返回Json字符串运用highcharts数据图表展现数据

    [1].[图片] Json字符串和highcharts数据图表展现.jpg 跳至 [1] code=26754#44745" rel="nofollow"> [2] ...

  3. flask-日料网站搭建

    引言:想使用python的flask框架搭建一个日料网站,主要包含web架构,静态页面,后台系统,交互. 本节知识:搭建web目录,目前正在copy网站. python环境:python2.7,fla ...

  4. flask-日料网站搭建-数据库操作

    引言:想使用python的flask框架搭建一个日料网站,主要包含web架构,静态页面,后台系统,交互,目前已经copy完主页,不是前端太慢太慢. 本节知识:数据库的操作,模型建表,更新数据库. py ...

  5. flask-日料网站搭建-后台登录

    引言:想使用python的flask框架搭建一个日料网站,主要包含web架构,静态页面,后台系统,交互,今天教大家实现后台登录功能,比较简单. 本节知识:表单标签,表单验证,数据查询,模板 pytho ...

  6. spring mvc 避免IE执行AJAX时,返回JSON出现下载文件

    <!-- 避免IE执行AJAX时,返回JSON出现下载文件 --> <bean id="mappingJacksonHttpMessageConverter" c ...

  7. SpringMVC 避免IE执行AJAX时,返回JSON出现下载文件

    <?xml version="1.0" encoding="UTF-8"?> <!-- SpringMVC配置文件 --> <be ...

  8. Ajax调用返回json,xml数据类型(0517--pm)

    一.返回Json型数据: 1.主页面 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" " ...

  9. dbda封装类(包括:返回二维数组、Ajax调用返回字符串、Ajax调用返回JSON)

    <?php class DBDA { public $host = "localhost"; public $uid = "root"; public $ ...

随机推荐

  1. 自定义flume的hbase sink 的序列化程序

    package com.hello.hbase; import java.nio.charset.Charset; import java.text.SimpleDateFormat; import ...

  2. “word无法发布此文章”解决

    之前用的好好的word发布文章到cnblogs,但是最近不好用了:报错如题. 解决方案: 选择设置tab,然后拉到最下面: 会看到有一个"MetaWeblog访问地址":拷贝下来: ...

  3. bzoj 2870 最长道路tree——边分治

    题目:https://www.lydsy.com/JudgeOnline/problem.php?id=2870 关于边分治:https://www.cnblogs.com/Khada-Jhin/p/ ...

  4. ajaxFileupload 多文件上传

    ajaxFileupload 多文件上传 修改前的代码: var oldElement = jQuery('#' + fileElementId); var newElement = jQuery(o ...

  5. max_result_window

    PUT http://192.168.1.12:9200/_settings { "index": { "max_result_window": "1 ...

  6. 解决web项目存在多个log4j.properties配置文件,导致日志级别配置不生效问题

    java开启log4j的debug模式 -Dlog4j.debug=true tomcat启动debug模式: linux打开catalina.sh导入: export JAVA_OPTS=" ...

  7. 阅读OReilly.Web.Scraping.with.Python.2015.6笔记---Crawl

    阅读OReilly.Web.Scraping.with.Python.2015.6笔记---Crawl 1.函数调用它自身,这样就形成了一个循环,一环套一环: from urllib.request ...

  8. TCP/UDP端口列表(WIKIpedia)

    计算机之间依照互联网传输层TCP/IP协议不同的协议通信,都有不同的对应端口.所以,利用短信(datagram)的UDP,所采用的端口号码不一定和采用TCP的端口号码一样.以下为两种通信协议的端口列表 ...

  9. mycat 1.6 配置【仅学习测试配置使用】

    jdk 自行配置 mycat 1.6 点击下载 配置文件 schema.xml <?xml version="1.0"?> <!DOCTYPE mycat:sch ...

  10. AES算法在Python中的使用

    Python有很多开源库,使用AES等加密算法时可以找对应的开源库.我记录一下安装方法: (1)下载开源库pycrypto 下载地址:https://pypi.python.org/pypi/pycr ...