flexigrid简单使用

AILIKES

浏览: 186292 次
性别:
来自: 北京

最近访客更多访客>>

strawmanTao

ggj2010

shandongwill

ldjdezh

博主相关

博客

微博

相册

留言

关于我

文章分类

社区版块

存档分类

博客分类：

技术分享

json xml

<html>中有<tableid="flexi1"></table>

<script>中代码：
$("#flex1").flexigrid({
width: w,
height: h,
method:'Post', //或者'get'
url: 'FlexiGridServlet.do', //返回数据源的后台处理程序地址，也可以是xml文件的地址
dataType: 'json', //数据源类型，可谓 xml 和 json
colModel : [ //要显示的列，这里定义了数据表的l列
{display: '编号', name : 'ID', width : 50, sortable : true, align:'center',hide: false},
{display: '工作名称', name : 'JOB_NAME', width : 250, sortable : false, align:'center'},
{display: '工作地址', name : 'WORK_ADDRESS', width : 100, sortable : true, align:'center'},
],
buttons : [ //需要的操作按钮
{name: '添加', bclass: 'add', onpress : toolbar},
{name: '删除', bclass: 'delete', onpress : toolbar},
{name: '修改', bclass: 'modify', onpress : toolbar},
{separator: true}
],
searchitems : [ //可使用的查询条件
{display: '编号', name : 'ID', isdefault: true},
{display: '工作名称', name : 'JOB_NAME'},
{display: '工作地址', name : 'WORK_ADDRESS'},
{display: '语言', name : 'LANGUAGE'}
],
errormsg: '发生异常',
title: '信息发布管理',
pagestat: '显示记录从{from}到{to}，总数 {total} 条',
//。。。。还有其他可以设置的属,及colModel、button属性见 http://blog.csdn.net/windxxf/article/details/7287997
});

后台：
response.setContentType("text/xml");
//response.setheader("Content-type: text/x-json"); //数据源为json时
request.setCharacterEncoding("utf-8");
response.setCharacterEncoding("utf-8");
String xml="";
//String JSON="";
//这里动态获取XML或json格式的字符串（格式如下）
response.getWriter().write(xml); //返回XML数据源
//response.getWriter().write(JSON);
response.getWriter().flush();
response.getWriter().close();

xml数据源格式：
String xml="<?xml version="1.0" encoding="UTF-8"?>
< rows>
< page>1</page><total>2</total> //绿色为要显示的数据页和数据总量，及数据，可循环用相应变量代替
<row id=1>
< cell><![CDATA[111]]></cell><cell><![CDATA[1]]></cell><row>
< row id=2>
< cell><![CDATA[2222]]></cell><cell><![CDATA[1]]></cell><row></rows>"
JSON数据源格式：
String json =" {\n page: 1,\n total: 7,\n rows: [\n{id:'1',cell:['yy','rrr','uu']},id:'2',cell:['yy','rrr','uu']} ]} "

一般的json：
{ "people": [
{ "firstName": "Brett", "lastName":"McLaughlin", "email": "aaaa" },
{ "firstName": "Jason", "lastName":"Hunter", "email": "bbbb"},
{ "firstName": "Elliotte", "lastName":"Harold", "email": "cccc" }
]}

动态改变flexigrid属性：
var option={
method : 'POST',
url : "/toolManagement1/servlet/ToolEditServlet",
datatype : "xml",
colModel : [{
display : '刀具编码',
name : 'tModelCode',
width : 50,
sortable : true,
align : 'center',
hide : false
} ],
errormsg : '发生异常',
.......
query : '',//搜索查询的tiaojian
qtype : '',//搜索查询的类别
procmsg : '加载中, 请稍等 ...',
hideOnSubmit : true, //是否在回调时显示遮盖
blockOpacity : 0.8,//透明度设置
rowbinddata : true,
showcheckbox : true
};
$(document).ready(function() {

$("#zhquery").click(function() {
option.url="/toolManagement1/servlet/ToolEditServlet?toolmodelcode="+"111";
option.newp = 1;
$("#queryresult").flexigrid(option);
$("#queryresult").flexOptions(option).flexReload(); }

分享到：

Highcharts主要组成 | Git 指令集

2014-04-24 09:50
浏览 1124
评论(0)
分类:编程语言
查看更多

发表评论

您还没有登录,请您登录后再发表评论

最近访客更多访客>>

博主相关

文章分类

社区版块

存档分类

最新评论