jquery easyui datagrid 远程加载数据----把主键渲染为值遇到的问题及解决方案
起因:数据库中一些字段存的是代表具体值的数字,需要渲染为具体值
monggodb中的字典

mysql中存放的值为:expertin代表教练擅长的搏击技能

jquery easyui中的相关代码如下:用于加载字典中的数据,注意:这一ajax请求必须设置为同步(async:false),否则,异步操作带来的问题是,还未取到值,就返回了结果,返回值一律是undefined 切记切记切记!!!
而且需要特别注意的是最终的结果变量ret不能在回调函数中返回!!!,因为下面的功能是调用函数loaddict(tblname,myid),如果在回调函数中返回,那么整个函数中返回的仍旧是undefined!!!
function loaddict(tblname,myid)
{
var ret;
$.ajax({
url:'http://www.cpcandcj.com/returntxt/'+tblname+"/"+myid,
method:'get',
async:false,
success:function (data) {
console.log(data);
ret = data;
}
});
if(ret)
{
return ret;
}
}
代码---把多个键组成的字符串拆为数组并循环遍历,分别返回对应的文本值
function returntext(tblname,mystr)
{
var retstr = "";
var myobj = mystr.split(',');
console.log(myobj);
var startfrom =;
//retstr+=loaddict(tblname,0,startfrom,retstr,myobj.length);
$.each(myobj,function(k,v){
retstr+=loaddict(tblname,myobj[k])+",";
});
retstr = retstr.substring(,retstr.lastIndexOf(","));
console.log(retstr);
return retstr;
}
加载jquery easy ui datagrid数据源
function duwa()
{
var xhr = new XMLHttpRequest();
xhr.onreadystatechange = function () {
if(xhr.readyState==)
{
//console.log(xhr.responseText);
return xhr.responseText;
}
};
xhr.open('get','querycpc');
xhr.send(null);
}
var mystr="";
jquery easy ui中调用
$('#dg').datagrid({
width:,
scrollbarSize:,
fitColumns:true,
url:'http://www.cpcandcj.com/querycpc',
columns:[[
{field:'id',title:'主键',width:''},
{field:'name',title:'教练姓名',width:''},
{field:'age',title:'年龄',width:''},
{field:'birthday',title:'出生日期',width:''},
{field:'expertin',title:'专业擅长',width:''},
]],
loadMsg:'数据加载,请稍等.....',
data:duwa(),
loadFilter:function (data) {
for(var i=;i<data.length;i++)
{
data[i]['expertin'] =returntext('coach_expert',data[i]['expertin'])
}
return data;
}
});
后来执行结果

不过这一设计带来的问题是,同步无刷新请求带来的是阻塞,和请求页面时的等待。可能带来的体验更糟糕,倒不如直接把文本值存入数据库,在做整体设计时还需见仁见智
jquery easyui datagrid 远程加载数据----把主键渲染为值遇到的问题及解决方案的更多相关文章
- jquery easyui datagrid 远程加载数据----javascript法
jquery easyui有三种办法生成datagrid(数据网格),本篇专门讨论javascript借助jquey easy ui实现的方式 html部分 <main role="m ...
- easyui datagrid 异步加载数据时滚动条有时会自动滚到最底部的问题
在使用easyui 的datagrid异步加载数据时发现滚动条有时会自动滚到最底部.经测试发现,如果加载数据前没有选中行则不会出现这个问题.这样我们可以在重新异步加载数据前取消选中行就可以避免这个问题 ...
- easyui datagrid 动态加载数据 渲染问题,表格错位问题
$('#dg').datagrid({ url:'datagrid_data.json', columns:[[ {field:'code',title:'Code',width:100}, {fie ...
- jquery easyui datagrid 动态 加载列
实现方式: 首先根据输入的sql语句获得相关的列名称返回给前台,然后在datagrid中动态加载列,接着根据查询条件(包括sql语句)获取相关的记录返回给前台用于填充datagrid.从而实现类似or ...
- js/jquery控制页面动态加载数据 滑动滚动条自动加载事件--转他人的
js/jquery控制页面动态加载数据 滑动滚动条自动加载事件--转他人的 相信很多人都见过瀑布流图片布局,那些图片是动态加载出来的,效果很好,对服务器的压力相对来说也小了很多 有手机的相信都见过这样 ...
- (转帖)关于easyui中的datagrid在加载数据时候报错:无法获取属性"Length"的值,对象为null或未定义
结贴说明: 很感谢sp1234等人的热心帮忙和提醒,现在我主要说明下问题所在: 首先我在独立的js文件中,直接把测试数据loaddata进去datagrid是没有问题的.var kk = {" ...
- EasyUI datagrid 动态加载表头和数据
首先返回到页面的需要是JSON数据: 第一步: 遍历表头,插入到array中 for (var i = 0; i < jsonObj.title.length; i++) { //把返回的数据封 ...
- [JS前端开发] js/jquery控制页面动态加载数据 滑动滚动条自动加载事件
页面滚动动态加载数据,页面下拉自动加载内容 相信很多人都见过瀑布流图片布局,那些图片是动态加载出来的,效果很好,对服务器的压力相对来说也小了很多 有手机的相信都见过这样的效果:进入qq空间,向下拉动空 ...
- DataGrid缓冲加载数据
当datagrid的滚动条拉到4/3的时候去加载数据.. public MainWindow() { InitializeComponent(); ; i <= ; i++) { Class1 ...
随机推荐
- C# Selenium FireFox 接入阿布云
业务需要购买http隧道,发现阿布云还行,使用Selenium本来想要用谷歌浏览器的,但是发现不能直接设置账号,所以选用火狐. 按照官方JAVA示例的改编,其中WebDriver实例化不能直接添加Fi ...
- 如何修改eclipse中的maven的仓库地址
最近的有一个朋友问我如何修改eclipse的maven的本地仓库,我想了一下,这个玩意一般是不用修改的,主要是你本地安装的maven在哪个位置,一般的本地仓库位置在 C:\Users\username ...
- django 生成后台管理
在应用下的admin.py中注册模型类.告诉djang框架根据注册的模型类来生成对应表管理页面. 1) 注册管理数据表 from django.contrib import admin from us ...
- 用roles部署nginx
1.初始化一个role [root@bogon ~]# ansible-galaxy init /etc/ansible/roles/websrvs 查看已经创建的role [root@bogon ~ ...
- 本地虚拟机部署线上php程序---不需要修改数据库信息
1.特别注意:拿来线上php程序后一般是不需要修改config.php里面的数据库连接信息的,如果修改了会报错:站点已关闭.所以 2.5 步骤是需要省略的.如果拿来的是最开始的php源码,需要配置原始 ...
- C#代码获取另一程序的错误提示,并关闭窗口。
A程序报错弹框如下: B程序捕捉到此错误消息,并关闭.B程序核心代码如下. private void timer_Click(object sender, EventArgs e) { //查找Mes ...
- python的类属性、实例属性、类方法、静态方法
类属性 就像如下代码: class Person: name = "张三" # 共有类属性 __age = 18 # 私有类属性 在类中直接定义的属性就是类属性,它被所有的实例对象 ...
- C#获取主机信息
获取主机信息 最近需要做一个配合集控系统收集各个终端设备的一些信息,大致需要收集终端设备的硬件信息,CPU.内存以及硬盘使用率等信息.网上查看了一番,使用WMI来获取这些信息是最方便的.实现代码如下: ...
- Linux Firewalld 简明介绍
防火墙作为保护服务器不受外部网络流量影响的一种方式.可以让用户定义一系列规则来控制外部网络中流入的流量,从而达到允许或阻塞的效果.firewalld 是防火墙服务的一个守护程序,实现了动态修改拥有 D ...
- 用python 获取照片的Exif 信息(获取拍摄设备,时间,地点等信息)
第一步:先安装 pip install exifread 第二部:上代码 import exifread import requests class PhotoExifInfo(): def __in ...