easyui dataGrid与后台交互传递数据

实现Web交互:Struts2、Ajax、EasyUI、JSON和DataGrid组合 Struts2是一个强大的、可扩展的MVC(Model-View-Controller)框架,它允许开发者创建高度交互的Web应用程序。Struts2基于拦截器的栈式架构和OGNL(Object-Graph Navigation Language)使得处理用户请求和响应变得更加灵活和高效。Ajax(Asynchronous JavaScript and XML)是一种在无需重新加载整个页面的情况下,能够更新部分网页的技术。 阅读详情

1.前台向后台传递数据

属性queryParams,传递json类型的参数给后台

除了queryParams指定参数外,dataGrid默认传递page rows两个参数给后台。

属性url:指定后台数据接口地址

pageSize:指定每页显示数据量

$('#sourceDG').datagrid({
        url:"data.json",
	pageSize:10,
	queryParams: {
        	source_type: "",
	        province_load: "",
	        city_load: "",
	        county_load: "",
	        province_delivery: "",
	        city_delivery: "",
	        county_delivery: "",
	        limited: 10,
	        offset: (curr-1)*10           
          },
          onBeforeLoad:function(param){
        	  console.log(param);
          },
          onLoadSuccess:function(data){
        	  console.log(data);
          },
          onLoadError:function(){
        	  console.log(1);
          }
        }); 

 

 

2.后台向dataGrid传递数据

 

封装jsonobject

dataGrid能够接受的key只有下面两个

total:数据总数

rows:返回的数据

封装返回数据类,向其中传参数据总数

totalCount:数据总数

obj:显示数据的list,后面dataGrid中显示的数据就封装在这里,每一个td的name就是list中的key

 

toGridJson(int totalCount, Object obj)

 

package com.melon.haul.dto;

import java.sql.Date;
import java.text.SimpleDateFormat;
import java.util.Collection;

import net.sf.json.JSONArray;
import net.sf.json.JSONObject;
import net.sf.json.JsonConfig;
import net.sf.json.processors.JsonValueProcessor;

public class GridJsonUtil {
	
	public static JSONObject toGridJson(int totalCount, Object obj) {  
        // 如果数据集对象为null做个特殊处理  
        if(null == obj) {  
            JSONObject jsonResult = new JSONObject();  
            jsonResult.put("total", totalCount);  
            jsonResult.put("rows", new JSONArray());  
            return jsonResult;  
        }   
        JsonConfig config = new JsonConfig();
        config.registerJsonValueProcessor(java.sql.Date.class, new JsonValueProcessor() {
        private SimpleDateFormat sd = new SimpleDateFormat("yyyy-MM-dd");

        @Override
        public Object processArrayValue(Object arg0, JsonConfig arg1) {
        return null;
        }

        @Override
        public Object processObjectValue(String arg0, Object arg1, JsonConfig arg2) {
        return arg1 == null ? "" : sd.format(arg1);
        }
        });
        JSONArray jsonArray = JSONArray.fromObject(obj,config);  
        JSONObject jsonResult = new JSONObject();  
        jsonResult.put("total", totalCount);  
        jsonResult.put("rows", jsonArray);  
        return jsonResult;  
    }  
}

 

 

 

 

 

 

 

 

零基础玩转华为AP 4050DN-HD:FAT模式家庭无线网络配置实战 本文为零基础用户提供华为AP 4050DN-HD从FIT模式转换为FAT模式的完整实战教程。详细介绍了固件升级、模式转换以及配置家庭无线网络(包括路由、DHCP、Wi-Fi和NAT)的每一步操作,帮助用户将企业级瘦AP改造为高性能家庭胖AP,打造稳定可靠的家庭网络环境。 阅读详情

相关推荐

NXP S32K3 Safety软件生态全解析:RTD、SPD、SAF、SCST到底怎么选?

本文深入解析NXP S32K3系列MCU的安全软件生态,详细对比RTD、SPD、SAF和SCST四大组件的功能定位与选型策略。针对不同ASIL等级需求,提供从架构设计到工程实践的完整解决方案,帮助开发者高效实现功能安全认证,优化汽车电子系统的安全性与可靠性。

weixin_42524226的博客 323

easyui datagrid的加载过程

onBeforeLoad事件发生在ajax请求之前的,这个事件函数如果返回false的话,将直接结束,不会请求数据。 onLoadError事件是当ajax请求出现故障时触发,开发者可以在此事件中自定义提示信息等。 onBeforeRender事件是view属性的,该事件发生在把ajax请求到的数据填充到表格内容中之前。 红色部分的rend数据行,就是把ajax请求到的数据填充到表格内容里,

zcbyzcb的专栏 840

从零到一:KUKA机械臂与ROS的工业级通讯协议深度解析

本文深度解析KUKA机械臂与ROS的工业级通讯协议,重点对比EKI与RSI两种核心接口的技术特点与应用场景。详细介绍了网络架构设计、数据包解析机制及ROS-I集成方法,并提供实时性能优化与故障排除策略,为工程师实现高可靠性工业自动化集成提供完整解决方案。

2a4s6d8f0g的博客 296

easy ui datagrid 首次进入页面时,不加载任何数据

onBeforeLoad: function (param) {                  var firstLoad = $(this).attr("firstLoad");                  if (firstLoad == "false" || typeof (firstLoad) == "undefined")                  {         ...

书写人生 4054

WD西部数据2TB,2.5寸移动硬盘,因为磁头坏了,长时间通电导致划片划伤,维修过程通过反复更换磁头

WD西部数据2TB,2.5寸移动硬盘,因为磁头坏了,长时间通电导致划片划伤,维修过程通过反复更换磁头,才能利用专业设备,里面找到,镜像,把内容数据恢复出来。 1.说一下经历,借用的别人移动硬盘,去帮别人维修,拷数据出来,别人的文件,数据比较多,且复杂,而且是在PE系统,接口什么的是2.0,没有很好的思考就全选复制拷贝了; 2,拷贝的过程,极其慢,文件多,且文件有损坏,移动硬盘一直处于通电的状态,大概从下午,两点多开始100多G的数据,一直卡住,到,晚上7 。8点拷完还是没拷完。打开的时候就已经,就一直

weixin_43766920的博客 4303

配置思科交换机冗余链路汇聚

本文对交换机端口汇聚配置进行说明

istrangeboy&begin zero的博客 6684

easyui中 form combobox datagrid 等有回显功能的对象方法 onBeforeLoad 获取当前对象

<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Validate Form on Submit - jQuery EasyUI Demo</title> <link rel=&qu

mrfly的博客 4976

图信号处理中的多尺度分析:图小波变换与图傅里叶变换的对比与应用

本文深入探讨了图信号处理中的多尺度分析方法,重点对比了图小波变换(GWT)与图傅里叶变换(GFT)的技术特点与应用场景。通过分析图的拓扑结构,GWT展现出强大的局部洞察力,适用于异常检测和社区发现;而GFT则擅长全局频率分析,适合趋势分析和信号去噪。文章结合实战案例,为读者提供了方法选型指南和前沿进展,帮助开发者在生物信息学、社交网络分析等领域高效应用这些技术。

weixin_30369041的博客 406

LayUI自定义分页插件,仿EasyUI的DataGrid

layUI分页列表,自定义插件

gao1122334的博客 4029

逆向解析喜马拉雅新版xm-sign算法:从dws.1.6.8.js到签名生成

本文详细解析了喜马拉雅新版xm-sign算法的逆向破解方法。通过定位核心JS文件dws.1.6.8.js,构建本地Node.js模拟执行环境,并解密关键参数cid与appKey,最终实现签名算法的本地化稳定生成,为数据采集提供可靠解决方案。

weixin_29250403的博客 214

OPCUA二(通过OPCUA服务器访问CPU)

摘要:本文介绍了使用UaExpert软件连接西门子PLC的OPC UA配置方法,包括IP地址设置(默认端口4840)、安全认证和证书信任流程。详细说明了数据访问操作,如变量拖拽监控和属性解读(NodeId、Value、状态码等)。特别强调连接仿真Advance7时需先启动实例。最后预告下章将讲解通过KerServer访问CPU。文章涵盖配置步骤、常见问题处理及实用技巧,适合工业自动化开发者参考。

欢迎来到RaymondLeigh的知识共享基地 1340

easyui datagrid json 格式

{                                                          "total":239,                                                          "rows":[                                                         

baidu_16597357的专栏 958

英飞凌TC3xx--深度手撕HSM安全启动(三)--TC3xx HSM系统架构

TC3xx的HSM内核是一颗32位的ARM Cortex M3,主频可达100MHz,支持对称算法AES128、非对称算法PKC(Public Key Crypto) ECC256、Hash SHA2,以及TRNG(真随机数生成)。

认真搞搞汽车MCU 5746

easyui框架前后端交互_easyui dataGrid与后台交互传递数据

1.前台向后台传递数据属性queryParams,传递json类型的参数给后台除了queryParams指定参数外,dataGrid默认传递page rows两个参数给后台。属性url:指定后台数据接口地址pageSize:指定每页显示数据量$('#sourceDG').datagrid({url:"data.json",pageSize:10,queryParams: {source_type:...

weixin_39622562的博客 1398

ssm框架搭建

这个是一个在idea上成功跑起来的ssm框架项目,保存在这里方便以后使用直接下载

Devexpress16.2.6破解工具

Devexpress16.2.6破解工具Devexpress16.2.6破解工具Devexpress16.2.6破解工具Devexpress16.2.6破解工具

ajax 提交数组 泛型集合

转载:http://blog.youkuaiyun.com/lingxyd_0/article/details/10428785 在项目上用到了批量删除与批量更改状态,前台使用了EasyUI的DataGrid,用到了批量更改数据状态功能。 在前台可以获取每条数据的ID,但是如何通过数组方式传递给后台? 通过昨晚的各种方式的调试,终于得出了答案! 在此作为备忘...

weixin_30467087的博客 80

C# WinForm 基于DirectShow.dll编写的程序,可边预览边保存视频,音频和图片

基于微软的DirectShow.dll的二次开发1.自动识别连接的摄像头跟麦克风且可以对其进行选择(默认选中第一个)2.可录制wmv和avi两种格式的视频并且都带有音频,avi可以录制的分辨率和帧数进行选择,wmv默认进行了淸晰度优化如不喜欢可去除代码中有相关提示3.可在预览点开之后进行拍照,也可边录制视频边拍照4.添加了视频和音频的压缩功能(酌情使用)这次二次开发发现C#对DirectShow的相关信息太少,这次做完也不敢藏私共享出来,还望大家指正

html向easyui传递数据,springmvc 后台向页面EasyUI的Datagrid传递数据(JSon格式)

===============EasyUIDatagrid分页====================EasyUIDatagrid 需要提供的JSon格式为:total和rows,所以我们只需要在后台中返回一个JSon格式为total和rows//定义一个EasyUIDatagridResult 类来包装JSon数据public class EasyUIDatagridResult {priva...

weixin_31138555的博客 390

文档:亲测可用解决vnc灰屏,黑屏,鼠标大黑叉情况

主要解决vnc-viewer灰屏,黑屏,鼠标大黑叉等现象,详细见文档。

springmvc 后台向页面EasyUI的Datagrid传递数据(JSon格式)

===============EasyUIDatagrid分页==================== EasyUIDatagrid 需要提供的JSon格式为:total和rows,所以我们只需要在后台中返回一个JSon格式为total和rows //定义一个EasyUIDatagridResult 类来包装JSon数据 public class EasyUIDa...

awqw2435的博客 359

EasyUI-datagrid可编辑

记录第一次使用EasyUI可编辑输入框 1.HTML中table <td class="panel-body" align="left"> <table id="tt" style="width: 100%;"> <div id="tb" style="height:auto">

Jason_ss的博客 3372

SpringMVC与JQuery EasyUI DataGrid传递JSON数据

本文默认您会使用EasyUI, 仅仅讲解如何通过SpringMVC与EasyUI DataGrid传递数据。 思路是:Handler Method返回JSONObject对象,SpringMVC对此对象进行转换。Jar包以下所有Jar包,均可以在我的优快云资源里下载首先是Java操作json的类的相关jar包: commons-beanutils-1.9.2.jar commons-collec

Myth' s Blog 1928

EasyUI 之 DataGrid的两种赋值方法

上一篇博客《EasyUI 之 DataGrid分页组件中文显示的两种方法》中我们使用EasyUI-DataGrid在前台添加了一个表格,并且让表格的分页控件显示为中文。现在我们有了DataGrid,我们怎么让它显示我们想要的数据呢?今天就跟大家聊一聊在MVC中怎么给DataGrid传值。 方法一:使用ViewData赋值         首先,我们创建一个User的实体类 p

等一个故事 2万+

EasyUI使用DataGrid数据表格实现增删改查

目录前言增加、修改功能的实现步骤三级目录 前言 接前文,已经用EasyUI的DataGrid组件实现了查询数据渲染的功能,这篇博文给大家分享下增删改的实现 增加、修改功能的实现步骤 先介绍一下增加功能的实现: 利用dialog组件进行同一页面增加,这个组件和模态框一个道理,只不过EasyUI的样式不太美观,引用: 要进行动态的页面传递数据到后台,那么给前文的增加按钮绑定事件: // 给新增按钮绑定点击事件 $("#btn-add").click(function() { $("#dd").dia

Dawn.x的博客 1317

easyui的datagrid的使用记录

datagrid是在 table的基础上变化而来的, 而不是在div的基础上来的。 从div来变成 datagrid,样式的设置还是是比较麻烦的。 dg=datagrid 的标题 来源于 columns 属性, 其内容 来源于 url属性。 关键是, 一定要设置这样的属性, 才能给你显示标题和内容, 否则即使你写了 tr等都不会显示 dg的url 最后输出的内容 必须是 json格式: 如果是ph...

weixin_33881050的博客 336

EasyUI-DataGrid之批量删除

简单介绍一下,涉及到的几个知识点:      1.checkbox,多选      2.前台到后台传值,我用的是字符串拼接,到了后台在拆分的方式      3.批量删除的底层实现 效果图                  前台view [html] view plaincopyprint? tabl

xyjikl 820

easyui datagrid纯js版和调用后台java代码(spring mvc)版

先说静态加载:

waiwai4701 1764

easyUi的combotree绑定后台返回的json字符串(EasyUI+spring mvc+mybatis)

1. 先展示图片: 2. json的数据格式,id 和 text ,children是固定的,不能变,还有记得都要用双引号的,你如果觉得你字符串没有问题,但是就是显示不出来,多半就是json格式不对,看着很像,实际是真的不一样。注意几点: ①children后面没有就不要加上,如:[{"id":"LT3aKRZkU41jWkSUCQe2jG","text":"发发呆"}] ②

zhaoyingjiao的专栏 5650

springmvc 后台向页面EasyUI的tree传递数据(JSon格式)

EasyUI的Tree需要提供的JSon格式为:id,text,state 请求的参数:id(当前节点的id) 响应的结果:json数据。 [{ "id": 1, "text": "Node 1", "state": "closed" } { "id": 2, "text": "Node 2",...

awqw2435的博客 311
上一篇: 吴恩达的机器学习编程作业6:costFunctionReg正则化代价函数
下一篇: easyui 获取datagrid当前页码跟页面记录数
蜗牛专注学习
博客等级 码龄15年 127粉丝 58原创
评论 3
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付:10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值