引言:想使用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. java zip 压缩文件

    zip压缩:ZipOutputStream.ZipFile.ZipInputStream 三个类的作用 一段 java  zip  压缩的代码: File dir = new File("C ...

  2. Zookeeper权限acl,acl的构成 scheme与id

    一.ACl(accerss control  lists)权限控制 1 针对节点可以设置相关读写权限,目的为了保障数据安全性 2.权限permissions可以指定不同的权限范围以及角色 二.ACL命 ...

  3. Hive HiveServer2+beeline+jdbc客户端访问操作

    HiveServer 查看/home/hadoop/bigdatasoftware/apache-hive-0.13.1-bin/bin目录文件,其中有hiveserver2 启动hiveserver ...

  4. C#:memcached安装及.NET中的Memcached.ClientLibrary使用详解

    memcached分布式缓存的负载均衡配置比例,数据压缩,socket的详细配置等,以及在.net中的常用方法. 下载地址:http://pan.baidu.com/s/1yVILw       提取 ...

  5. Linux Shell脚本中获取本机ip地址方法

    ifconfig -a|grep inet|grep -v 127.0.0.1|grep -v inet6|awk '{print $2}'|tr -d "addr:"​ 命令解释 ...

  6. Java消息机制 ActiveMQ入门实例

    转载自:http://www.cnblogs.com/wyh3721/p/5917316.html 1.下载ActiveMQ 去官方网站下载:http://activemq.apache.org/  ...

  7. jquery.form插件中动态修改表单数据

    jquery.form jquery.form插件(http://malsup.com/jquery/form/)是大家经常会用到的一个jQuery插件,它可以很方便将表单转换为ajax的方式进行提交 ...

  8. spring boot 整合dubbo

    dubbo与springboot的集成和使用dubbo-spring-boot-starter SpringBoot整合Dubbo2.5.10(官方的spring-boot-starter0.1.0) ...

  9. Elasticsearch的脚本化数据导入导出

    我用的ES的版本是2.4.1,由于没有相应的命令实现数据的导入和导出,就是像mysql的那种mysqldump类似的指令. 更苦逼的是,我们的生产和测试环境,还不能联网,连ES的第三方的插件都没有办法 ...

  10. java线程之间的通信

    1.常用的方法 sleep() 该线程进入等待状态,不释放锁 wait() 该线程进入等待状态,释放锁 notify() 随机唤醒一个线程 notifyAll() 唤醒全部线程 getName() 获 ...