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')
目录
打赏
0
0
0
0
6
分享
相关文章
Python自动化测试与单元测试框架:提升代码质量与效率
【9月更文挑战第3天】随着软件行业的迅速发展,代码质量和开发效率变得至关重要。本文探讨了Python在自动化及单元测试中的应用,介绍了Selenium、Appium、pytest等自动化测试框架,以及Python标准库中的unittest单元测试框架。通过详细阐述各框架的特点与使用方法,本文旨在帮助开发者掌握编写高效测试用例的技巧,提升代码质量与开发效率。同时,文章还提出了制定测试计划、持续集成与测试等实践建议,助力项目成功。
173 5
前端安全防护:XSS、CSRF攻防策略与实战
【4月更文挑战第13天】本文探讨了XSS和CSRF攻击的类型、危害及防御方法。XSS攻击通过注入恶意脚本威胁用户安全,分为存储型、反射型和DOM型。CSRF攻击利用用户已登录状态发起恶意请求,可能导致账户状态改变和数据泄露。防御XSS包括输入验证、输出编码和启用Content Security Policy(CSP)。针对CSRF,可使用Anti-CSRF Tokens、设置SameSite Cookie属性和启用HTTPS。开发者应采取这些策略保护用户数据和网站稳定性。
1479 0
深入剖析 Qt QMap:原理、应用与技巧
深入剖析 Qt QMap:原理、应用与技巧
2067 0
Go语言性能对比:超乎想象
Go语言性能对比:超乎想象
1694 0
亿级别大表拆分 —— 记一次分表工作的心路历程
亿级别大表拆分 —— 记一次分表工作的心路历程
三项第一,阿里云连续4年领跑游戏云市场
国际数据公司(IDC)最新发布《中国游戏云市场跟踪》报告显示,2024年阿里云在游戏云基础设施(IaaS)+ 云解决方案(Cloud Solution)、云基础设施(IaaS)、云解决方案(Cloud Solution)三个市场均取得第一。这已经是阿里云连续4年稳居游戏云整体市场份额第一。

热门文章

最新文章

登录插画

登录以查看您的控制台资源

管理云资源
状态一览
快捷访问