来自《sencha touch权威指南》，约198页开始

通过php脚本，可以将mysql数据库的数据作为json数据格式进行读取。

（1）php代码（bookinfo.php)：

<?php

$link = mysql_connect("localhost","root","123456");

mysql_select_db("jiyale");

mysql_query("SET NAMES UTF8");

$result = mysql_query('select * from books',$link);

if(!$result){

    die('{"success":false,"message":"读取数据失败"}');

}

if(mysql_num_rows($result)>0){

    while($obj = mysql_fetch_object($result)){

        $arr[] = $obj;

    }

    echo '{"success": true, "books": '.json_encode($arr).'}';

}else{

    echo '{"success": false,"message":"读取数据失败","books":""}';

}

?>

（2）app.js代码：

Ext.require(['Ext.data.Store','Ext.data.reader.Xml','Ext.dataview.DataView','Ext.MessageBox']);

Ext.application({

    name: 'MyApp',

    icon: 'images/icon.png',

    glossOnIcon: false,

    phoneStartupScreen: 'images/phone_startup.png',

    tabletStartupScreen: 'images/tablet_startup.png',

    launch: function(){

        Ext.define('BookInfo',{

            extend: 'Ext.data.Model',

            config: {

                fields:['image_url','book_name','author','description']

            }

        });

        var bookStore = Ext.create('Ext.data.Store',{

            model: 'BookInfo',

            autoLoad: true,

            proxy: {

                type: 'ajax',

                url: 'bookinfo.php',

                reader: {

                    type: 'json',

                    rootProperty: 'books'

                }

            },

            listeners: {

                load: function(store,records,successful){

                    if(!successful){

                        Ext.Msg.alert(bookStore.getProxy().getReader().rawData.message);

                    }

                }

            }

        });

        var bookTemplate = new Ext.XTemplate(

            '<tpl for=".">',

            '<div class="Book_img"><img src="{image_url}" /></div>',

            '<div class="Book_info">',

            '<h2>{book_name}</h2><br /><h3>作者：{author}</h3>',

            '<p>{description:ellipsis(50)}</p>',

            '</div>',

            '</tpl>'

        );

        var dataview = Ext.create('Ext.DataView',{

            store: bookStore,

            itemTpl: bookTemplate,

            baseCls: 'Book',

        });

        Ext.Viewport.add(dataview);

    }

});

（3）index.html代码：

<!DOCTYPE HTML>

<html>

<head>

<meta charset="utf-8">

<title>sencha touch</title>

<link rel="stylesheet" type="text/css" href="css/sencha-touch.css" />

<script type="text/javascript" src="sencha-touch-debug.js"></script>

<script type="text/javascript" src="app.js"></script>

<style type="text/css">

.Book-item{padding:10px 0 30px 178px;border-top: 1px solid #ccc;}

.Book-item h2{font-weight: bold;}

.Book-item .Book_img{position: absolute;left: 10px;}

.Book-item .Book_img img{max-width: 159px;}

.Book-itme .Book_info{position: absolute;padding-left: 5px;font-size: 12px;}

.x-item-selectex{background-color: blue;color: white;}

</style>

</head>

<body>

</body>

</html>

读取mysq数据库l数据，并使用dataview显示的更多相关文章

  1. 读取mysql数据库的数据，转为json格式

    # coding=utf-8 ''' Created on 2016-10-26 @author: Jennifer Project:读取mysql数据库的数据,转为json格式 ''' import ...

  2. AndroidStudio 中查看获取MD5和SHA1值以及如何查看手机应用信息以及读取*.db数据库里面数据

    查看获取MD5和SHA1值具体操作方式链接 查看获取MD5和SHA1值实际操作命令CMD语句: C:\Users\Administrator>cd .android C:\Users\Admin ...

  3. C# 读取Oracle数据库视图数据异常问题处理

    会出现类似现在这种提示的错误 System.Data.OracleClient 需要 Oracle 客户端软件 version 8.1.7 或更高版本 情况1.开发过程中遇到这种问题解决 由于.net ...

  4. wamp中修改后mysq数据库l闪退无法登陆解决办法

    WampServer安装后密码是空的,   修改一般有三种方式:   一是通过phpMyAdmin直接修改:   二是使用WAMP的MySql控制台修改.     三是重置密码    第一种:   1 ...

  5. Excel2003读取sqlserver数据库表数据(图)

  6. Jmeter接口测试，往MySQL数据库写数据时，中文显示？？？

    调Jmeter接口测试,请求字段输入中文,查看数据库插入情况, 发现数据库显示    ???

  7. 使用python将mysql数据库的数据转换为json数据

    由于产品运营部需要采用第三方个推平台,来推送消息.如果手动一个个键入字段和字段值,容易出错,且非常繁琐,需要将mysql的数据转换为json数据,直接复制即可. 本文将涉及到如何使用Python访问M ...

  8. 利用PHP实现登录与注册功能以及使用PHP读取mysql数据库——以表格形式显示数据

    登录界面 <body><form action="login1.php" method="post"><div>用户名:&l ...

  9. Java读取oracle数据库中blob字段数据文件保存到本地文件(转载)

    转自:https://www.cnblogs.com/forever2698/p/4747349.html package com.bo.test; import java.io.FileOutput ...

随机推荐

  1. socket执行accept函数时没有进入阻塞状态，而是陷入了无限循环

    接着前两天继续看<VC深入详解>的网络编程部分,这次我快速看了遍书上的函数以及套接字C-S模型,然后自己从0开始写了个简单的服务端,结果发现一直在输出 而明明我还没有写客户端程序,由于打印 ...

  2. .NET的URL重写

    [概述] URL重写就是首先获得一个进入的URL请求然后把它重新写成网站可以处理的另一个URL的过程.重写URL是非常有用的一个功能,因为它可以让你提高搜索引擎阅读和索引你的网站的能力:而且在你改变了 ...

  3. Spring Boot Maven 打包可执行Jar文件

    本文转载自:http://blog.csdn.net/smilecall/article/details/56288972 Maven pom.xml 必须包含 <packaging>ja ...

  4. 【学习笔记】dp基础

    知识储备:dp入门. 好了,完成了dp入门,我们可以做一些稍微不是那么裸的题了. dp基础,主要是做题,只有练习才能彻底掌握. 洛谷P1417 烹调方案 分析:由于时间的先后会对结果有影响,所以c[i ...

  5. Centos7 可执行程序自定义为系统服务

    systemctl的使用相比以往系统服务的/etc/init.d的启动脚本的方式变动也比较大,但变的更简单更易用了,同firewalld一样,运行原理一目了然,对于初学者来说,只要做过一两次练习,就能 ...

  6. Windows Azure 应用程序短暂性故障处理

    这两天在做一个Windows Azure blob存储备份的的一个小功能,但是每次使用CloudBlockBlob.UploadFromStream上传本地文件到Blob Storage,总是不成功报 ...

  7. 判断和调整library cache,data dictionary cache,buffer cache性能

    Oracle SGA是oracle的内存结构,存放着oracle通过oracle进程读写的内存数据.sga分为好多组件,比如shared pool,buffer cache,redo log buff ...

  8. 用 Sqlmap 识别 WAF

    命令: ┌─[root@sch01ar]─[~] └──╼ #sqlmap -u "http://www.sch01ar.com/" --identify-waf --batch ...

  9. 1.celery概述

    1. 问题抛出 我们在做网站后端程序开发时,会碰到这样的需求:用户需要在我们的网站填写注册信息,我们发给用户一封注册激活邮件到用户邮箱,如果由于各种原因,这封邮件发送所需时间较长,那么客户端将会等待很 ...

  10. Django的contenttypes应用、缓存相关

    一.django的contenttypes contenttypes 是Django内置的一个应用 , 可以追踪项目中所有app 和 model 的对应关系, 并记录djang_content_typ ...