Extjs-lesson7

简介: Extjs-lesson7


1.1 展示

Ajax

1.2 代码

前端 js 代码

Ext.onReady(function () {
    //创建panel
    var panel = new Ext.Panel({
        title: 'Ajax与数据显示',
        width: 476,
        height: 374,
        resizable: true,
        frame: true
    });
    //创建数据显示模板
    var template = new Ext.XTemplate(
                '<table  id="template">',
                   '<tr><td>编号:</td><td>{id}</td></tr>',
                   '<tr><td>姓名:</td><td>{name}</td></tr>',
                   '<tr><td>生日:</td><td>{brithday}</td></tr>',
                   '<tr><td>身高:</td><td>{height}</td></tr>',
                   '<tr><td>性别:</td><td>{sex}</td></tr>',
                   '<tr><td valign="top">描述:</td><td>{discribe}</td></tr>',
                '</table>'
            );
    //获取数据
    Ext.Ajax.request({
        url: '/demo/people/',
        method: 'post',
        params: { id: 1 },
        success: function (response, options) {
            for (i in options) {
                alert('options参数名称:' + i);
                alert('options参数[' + i + ']的值:' + options[i]);
            }
            var responseJson = Ext.util.JSON.decode(response.responseText);
            template.compile();
            template.overwrite(panel.body, responseJson);
        },
        failure: function () {
            alert('系统出错,请联系管理人员!');
        }
    });
    //创建窗体
    var win = new Ext.Window({
        title: '窗口',
        id: 'window',
        width: 476,
        height: 374,
        resizable: true,
        modal: true,
        closable: true,
        maximizable: true,
        minimizable: true,
        items: [panel]
    });
    win.show();
});

后端 python 代码:更多精彩文章请关注公众号『Pythonnote』或者『全栈技术精选』

from django.http import JsonResponse
from django.shortcuts import render
from django.shortcuts import render_to_response
# url:/demo/people/
def getPeople(request):
    id = request.POST.get('id')
    if id == 1:
        return JsonResponse({"id": 1, "name": '小闫同学', "brithday": "2001-05-21", "height": 180, "sex": '0', "discribe": '小闫同学是一名全栈开发工程师<br>欢迎关注公众号:全栈技术精选。'})
# url:/demo/index
def index(request):
    return render_to_response('test_ajax/index.html')
相关文章
|
机器学习/深度学习 测试技术 Python
【激活函数】基础回顾:带你认识神经网络中常见的激活函数
【激活函数】基础回顾:带你认识神经网络中常见的激活函数
1198 0
【激活函数】基础回顾:带你认识神经网络中常见的激活函数
|
IDE 测试技术 持续交付
Python自动化测试与单元测试框架:提升代码质量与效率
【9月更文挑战第3天】随着软件行业的迅速发展,代码质量和开发效率变得至关重要。本文探讨了Python在自动化及单元测试中的应用,介绍了Selenium、Appium、pytest等自动化测试框架,以及Python标准库中的unittest单元测试框架。通过详细阐述各框架的特点与使用方法,本文旨在帮助开发者掌握编写高效测试用例的技巧,提升代码质量与开发效率。同时,文章还提出了制定测试计划、持续集成与测试等实践建议,助力项目成功。
196 5
|
5月前
|
人工智能 Cloud Native 关系型数据库
三项第一,阿里云连续4年领跑游戏云市场
国际数据公司(IDC)最新发布《中国游戏云市场跟踪》报告显示,2024年阿里云在游戏云基础设施(IaaS)+ 云解决方案(Cloud Solution)、云基础设施(IaaS)、云解决方案(Cloud Solution)三个市场均取得第一。这已经是阿里云连续4年稳居游戏云整体市场份额第一。
|
10月前
|
存储 安全 Java
🌟Java零基础-反序列化:从入门到精通
【10月更文挑战第21天】本文收录于「滚雪球学Java」专栏,专业攻坚指数级提升,希望能够助你一臂之力,帮你早日登顶实现财富自由🚀;同时,欢迎大家关注&&收藏&&订阅!持续更新中,up!up!up!!
239 5
|
数据采集 Web App开发 JavaScript
使用Selenium爬取目标网站被识别的解决之法
使用Selenium爬取目标网站被识别的解决之法
|
安全 架构师 网络安全
|
机器学习/深度学习 人工智能 算法
在 AI Native 环境中实现自动超参数优化的微调方法
【8月更文第1天】随着人工智能技术的不断发展,深度学习模型的训练变得越来越复杂。为了达到最佳性能,需要对模型进行微调,特别是对超参数的选择。本文将探讨如何在 AI Native 环境下使用自动化工具和技术来优化模型的微调过程。
455 5
|
前端开发 安全 JavaScript
前端安全防护:XSS、CSRF攻防策略与实战
【4月更文挑战第13天】本文探讨了XSS和CSRF攻击的类型、危害及防御方法。XSS攻击通过注入恶意脚本威胁用户安全,分为存储型、反射型和DOM型。CSRF攻击利用用户已登录状态发起恶意请求,可能导致账户状态改变和数据泄露。防御XSS包括输入验证、输出编码和启用Content Security Policy(CSP)。针对CSRF,可使用Anti-CSRF Tokens、设置SameSite Cookie属性和启用HTTPS。开发者应采取这些策略保护用户数据和网站稳定性。
1613 0
|
存储 API 开发者
深入剖析 Qt QMap:原理、应用与技巧
深入剖析 Qt QMap:原理、应用与技巧
2184 0
|
Ubuntu 开发工具 git
ubuntu18.04下配置muduoC++11环境
以上步骤将在Ubuntu 18.04下配置C++11环境,并编译安装muduo库。请根据实际情况对配置步骤进行调整。 买CN2云服务器,免备案服务器,高防服务器,就选蓝易云。百度搜索:蓝易云
326 0