easyUI数据表格datagrid之笔记

Posted 日月心诚

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了easyUI数据表格datagrid之笔记相关的知识,希望对你有一定的参考价值。

1.用ajax获取数据库数据

/**=========================================
* 读取数据库信息,使用ajax的load方法
*/
function getMediaInfo(){
var orgInfo=[];

$.ajax({
url:baseCtx+"/media/getMediaInfo.action",
data:{},
type : ‘post‘,
async : false,
dataType : "json",
success: function(data){
orgInfo=data;
// console.log("orgInfo="+orgInfo);
$(‘#dg‘).datagrid(‘loadData‘, orgInfo);
},
});
}

 

2.查询数据库信息,

/**=========================================
*查询数据库信息,传到服务端
*/
function searchButton() {

var mediaId="";
var mediaName="";
var mediaDomain="";
var mediaType="";
if($(‘#mediaId‘).textbox(‘getText‘) != null && $(‘#mediaId‘).textbox(‘getText‘) != "") {
mediaId = $(‘#mediaId‘).textbox(‘getText‘);
}
if($(‘#mediaName‘).textbox(‘getText‘) != null && $(‘#mediaName‘).textbox(‘getText‘) != "") {
mediaName = $(‘#mediaName‘).textbox(‘getText‘);
}
if($(‘#mediaDomain‘).textbox(‘getText‘) != null && $(‘#mediaDomain‘).textbox(‘getText‘) != "") {
mediaDomain = $(‘#mediaDomain‘).textbox(‘getText‘);
}
if($(‘#mediaType‘).textbox(‘getText‘) != null && $(‘#mediaType‘).textbox(‘getText‘) != "") {
mediaType = $(‘#mediaType‘).textbox(‘getText‘);
}

//查询数据
if(mediaId=="" && mediaName==""&& mediaDomain=="")
alert("请输入要查询的媒体数据!");
else
{
$.ajax({
url:baseCtx+"/media/searchMediaInfo.action",
data:{
//MEDIA_ID和mediaId分别指的是什么
MEDIA_ID:mediaId,
MEDIA_NAME:mediaName,
MEDIA_DOMAIN:mediaDomain,
MEDIA_TYPE:mediaType,

},
type : ‘post‘,
async : true,
dataType : "json",
error: function(){ //失败
alert("loading error!");
},
success: function(data){
var currData = "";
$.each(data,function(index,item){
currData="媒体ID是:"+item.MEDIA_ID+"\n媒体名是:"+item.MEDIA_NAME+
"\n媒体网址:"+item.MEDIA_DOMAIN+"\n媒体类型是:"+item.MEDIA_TYPE;
});
if(currData)
{
alert("查询成功!\n"+currData);

}
else
{
alert("查询失败!\n"+currData);
}

},
});
}
}

 

3.添加媒体的窗口确认信息,传到服务端

/**=========================================
*添加媒体的窗口确认信息,传到服务端
*/
function win_confirm(){

var media_id = $(‘#media_id‘).textbox(‘getValue‘);
var media_name = $(‘#media_name‘).textbox(‘getValue‘);
var media_domain = $(‘#media_domain‘).textbox(‘getValue‘);
var media_type = $(‘#media_type‘).textbox(‘getValue‘);

$(‘#win1‘).window(‘close‘);
//要向数据库中添加一条信息,然后更新

$.ajax({
url:baseCtx+"/media/addMediaInfo.action",
data:{
MEDIA_ID:media_id,
MEDIA_NAME:media_name,
MEDIA_DOMAIN:media_domain,
MEDIA_TYPE:media_type,
},
type : ‘post‘,
async : true,
dataType : "text",
success: function(data){
if(data=="SUCCESS")
{
getMediaInfo();
}
},
});
}

4.编辑媒体的窗口确认信息,传到服务端
/**=========================================
*编辑媒体的窗口确认信息,传到服务端
*/
function editButton() {
$(‘#win2‘).window(‘open‘);
//清空
$(‘#media_id2‘).textbox(‘setValue‘,$(‘#dg‘).datagrid(‘getSelected‘).MEDIA_ID);
$(‘#media_name2‘).textbox(‘setValue‘,$(‘#dg‘).datagrid(‘getSelected‘).MEDIA_NAME);
$(‘#media_domain2‘).textbox(‘setValue‘,$(‘#dg‘).datagrid(‘getSelected‘).MEDIA_DOMAIN);
$(‘#media_type2‘).textbox(‘setValue‘,$(‘#dg‘).datagrid(‘getSelected‘).MEDIA_TYPE);
}


/**=========================================
*窗口确认信息,传到服务端用于修改更新数据库
*/
function win2_confirm()
{
var media_id = $(‘#media_id2‘).textbox(‘getValue‘);
var media_name = $(‘#media_name2‘).textbox(‘getValue‘);
var media_domain = $(‘#media_domain2‘).textbox(‘getValue‘);
var media_type = $(‘#media_type2‘).textbox(‘getValue‘);

$(‘#win2‘).window(‘close‘);
//要向数据库中添加一条信息,然后更新

$.ajax({
url:baseCtx+"/media/editMediaInfo.action",
data:{
MEDIA_ID:media_id,
MEDIA_NAME:media_name,
MEDIA_DOMAIN:media_domain,
MEDIA_TYPE:media_type,
},
type : ‘post‘,
async : true,
dataType : "text",
success: function(data){
if(data=="SUCCESS"){
getMediaInfo();
}
},
});
}

5.删除信息
/**=========================================
*删除一条信息
*/
function removeButton() {

if($(‘#dg‘).datagrid(‘getSelected‘)) {
var mediaName =$(‘#dg‘).datagrid(‘getSelected‘).MEDIA_NAME;
$.messager.confirm(‘确认‘, ‘您确认想要删除‘+mediaName+‘吗?‘, function(r) {
if(r)
{
$.ajax({
url:baseCtx+"/media/removeMediaInfo.action",
data:{MEDIA_NAME:mediaName,},
type : ‘post‘,
async : true,
dataType : "text",
success: function(data){
if(data=="SUCCESS")
{
getMediaInfo();
}},

});
}
});
}
else
{alert("请选择要删除的对象!");}

}

 

以上是关于easyUI数据表格datagrid之笔记的主要内容,如果未能解决你的问题,请参考以下文章

easyUI之datagrid绑定后端返回数据的两种方式

EasyUI之数据表格读取

EasyUI datagrid数据表格加载本地数据

EasyUI使用——datagrid数据表格

EasyUI 导出数据表格 (Export DataGrid)

EasyUI 导出数据表格 (Export DataGrid)