easyui更新表格数据库(easyui datagrid增删改查)

程序开发 11
今天给各位分享easyui更新表格数据库的知识,其中也会对easyui datagrid增删改查进行解释,如果能碰巧解决你现在面临的问题,别忘了关注本站,现在开始吧!我在网上下载了easyui datagrid的一个实例,我换了一个数据库,改了改字段怎么就用不成了?求帮助 涉及到datagrid这种数据表格的使用,必须要更改列名才可以正常显示

今天给各位分享easyui更新表格数据库的知识,其中也会对easyui datagrid增删改查进行解释,如果能碰巧解决你现在面临的问题,别忘了关注本站,现在开始吧!

我在网上下载了easyui datagrid的一个实例,我换了一个数据库,改了改字段怎么就用不成了?求帮助

涉及到datagrid这种数据表格的使用,必须要更改列名才可以正常显示

使用easyUI datagrid的updateRow方法,代码如下: mydata

$('#dg').datagrid('updateRow',{

index: 2,

row: {

name: '新名称',

note: '新消息'

}

}); index:是第几行,row里面的name是这行对应的字段,'新名称'是你需要改变的显示值。

easyui js表单信息添加到数据库怎么写

以下是JS代码:

$("#btnSave").click(function () {

//保存数据

//$.messager.alert("Info", subType, "info");

$("#frmSHCBF").form("submit",{

url: "Handler1.ashx?type=" + subType,

type:"POST",

onsubmit: function () {

return $(this).form("validate");

//if ($(this).form("validate")) {

// $.messager.alert("保存信息", "保存失败,请检查数据格式", "error");

//}

},

java web我的html页面有一个easyUI做的datagrid,当datagrid实现增删改查之后,将数据跟新数据库中。

增删查改都有请求到后台的啊,数据传到后台通过dao就同步到数据库了

在 jquery easyui脚本中怎麼样遍历所有datagrid中的数据并更新到数据库求教有详细的例子更好。是web开发得

function getChanges(){

var s = '';

var rows = $('#tt').datagrid('getChanges');

for(var i=0; irows.length; i++){

s += rows[i].name + ':' + rows[i].value + ',';

}

alert(s)

}

easyUI的表格如何显示数据库里的数据啊

因为EasyUI DataGrid只要取出后台传过来的一定格式的JSON数据,就可以在前台页面数据表格中,以一定形式显示数据库中的数据。此处,我们使用Struts2框架整合DataGrid,实现数据的显示。

一、页面内容

     为了在页面中显示数据库中字段内容,需要定义一个table,通过EasyUI内部设计,自动显示数据,如下:

%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%

%@ taglib prefix="s" uri="/struts-tags" %

%

String path = request.getContextPath();

String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";

%

!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"

html

head

  base href="%=basePath%"

  title房产信息管理/title

meta http-equiv="pragma" content="no-cache"

meta http-equiv="cache-control" content="no-cache"

meta http-equiv="expires" content="0"  

meta http-equiv="keywords" content="keyword1,keyword2,keyword3"

meta http-equiv="description" content="This is my page"

/head

body

table id="housesManage" style="height: 100%"/table

div id="addHouse"/div

div id="updateHouse"/div

script type="text/javascript"

  $(document).ready(function(){

   //datagrid设置

$('#housesManage').datagrid({

title:'房产列表',      //表格标题

       iconCls:'icon-list', //表格图标

nowrap: false,      //是否只显示一行,即文本过多是否省略部分。

striped: true,

fitColumns:true,    //防止水平滚动

scrollbarSize:0,    //去掉右侧滚动条列

url:"houses/showHouses!show", //action地址

idField:'id',

collapsible:false,//是否可折叠的

singleSelect:true,//只能单选

frozenColumns:[[

 {field:'ck',checkbox:true}

]],

       pagination:true, //包含分页

pageSize: 10,

pageList: [10,20,30],//可以设置每页记录条数的列表

rownumbers:true,

singleSelect:true,//只能单选

columns :[[{

 field : 'id',

                title : 'ID',

                align:'center',

                hidden : true

},{

  field : 'unitNum',

                 title : "楼栋号",

                 width : 100,

                 align:'center',

                 sortable : true,

},{

  field : 'doorCard',

                 title : "门牌号",

                 width : 100,

                 align:'center',

                 sortable : true,

},{

  field : 'roomArea',

                 title : "房屋面积(平米)",

                 width : 100,

                 align:'center',

                 sortable : true,

},{

  field : 'buildTime',

                 title : "建筑时间",

                 width : 150,

                 align:'center',

                 sortable : true,

},{

  field : 'isUse',

                 title : "使用状态",

                 width : 80,

                 align:'center',

                 sortable : true,

                 formatter: function(value,row,index){

                 

                   if(value=="0"){

                      return '已使用';

                   }else{

                     return 'font color="red"空置/font';

                   }

                }

}]],

toolbar:[{

text:'添加',

iconCls:'icon-add',

handler:function(){

       //显示上传界面

       $('#addHouse').dialog({  

   title: '房产管理|添加房屋信息',  

   width: 500,

   iconCls:'icon-add',  

   height: 300,  

   closed: false,  

   cache: false,  

   href: 'houses/addHouse.jsp',  

   modal: true

});  

       }

}, '-', {

              text: "删除",

              iconCls: "icon-cut",

              handler: function () {

                  //选中要修改删除的行

                    var rows = $("#housesManage").datagrid('getSelections'); //返回所有选中的行

                 

                    if (rows.length 0) {//选中几行的话触发事件

                      $.messager.confirm("提示", "您确定要重置该用户密码吗?", function (res) {//提示是否删除

                          if (res) {

                             //获得编号

                             var id=rows[0].id;

                             // 获得删除行索引

                             var tableindex = $("#housesManage").datagrid('getRowIndex', id);

                           

                             $.post('houses/delHouse!delete',{

                               "house.id":id

                              },function(data){

                                if(data.message=="2"){

                                   $.messager.alert('温馨提示','删除失败!','error');

                                }else{

                                    //删除选中的行

                                    $("#housesManage").datagrid("deleteRow",tableindex);

                                }

                             });

                          }

                      });

                  }

              }

            },'-',{

                text: "修改",

                iconCls: "icon-edit",

                handler: function (){

           

                  //选中要修改删除的行

                    var rows = $("#housesManage").datagrid('getSelections'); //返回所有选中的行

                 

                    if (rows.length 0) {//选中几行的话触发事件

                   

                     //获得编号

                     var id=rows[0].id;

                     //显示修改界面

       $('#updateHouse').dialog({  

   title: '房产管理|修改房屋信息',  

   width: 500,

   iconCls:'icon-edit',  

   height: 300,  

   closed: false,  

   cache: false,  

   href: 'houses/getHouse!get?house.id='+id,  

   modal: true

});        

                }

              }

            },'-',{

              text: "刷新列表",

              iconCls: "icon-reload",

              handler: function (){

           

                  $("#housesManage").datagrid('reload');

              }

              }] ,onLoadError : function() {

          $.messager.alert('温馨提示','数据加载失败!','error');

       

    }

});

displayMsg();

});

 //改变分页显示

  function displayMsg() {

      $('#housesManage').datagrid('getPager').pagination({

      displayMsg : '当前显示font color="red" {from} - {to} /font条记录   共 font color="red"{total}/font 条记录'

   });

}

/script

/body

/html

二、struts.xml中配置

!-- 显示房产信息 --

    action name="showHouses" class="95a510383fb98bb5 com.wy.action.HouseAction" method="show"

       result type="json" name="success"

         param name="root"result/param

       /result

    /action

三、对应的Action 处理类

      private JSONObject result;       //返回的json

private String rows;             //每页显示的记录数

private String page;             //当前第几页

      //显示房产基本信息

public String show(){

   //当前页

   int intPage = Integer.parseInt((page == null || page == "0") ? "1":page);

   //每页显示条数

   int number = Integer.parseInt((rows == null || rows == "0") ? "10":rows);

 

   //每页的开始记录  第一页为1  第二页为number +1

   int start = (intPage-1)*number;

 

   HouseDao houseDao=new HouseDao();

   ArrayListTHouse listHouses=houseDao.getHouses(start, number); //从数据库中查询数据

 

   MapString, Object jsonMap = new HashMapString, Object();//定义map

   

   int count=houseDao.getHouseCount(); //求出总记录数

 

   //total键 存放总记录数,必须的

   jsonMap.put("total", count);

          jsonMap.put("rows", listHouses);//rows键 存放每页记录 list

   

          result=JSONObject.fromObject(CommonUtil.getJsonNotNull(jsonMap));

 

         return SUCCESS;

}

action 类中,rows,page 是用于EasyUI分页操作的,EasyUI会自动向后台传入参数:当前页及每页显示记录数,以此实现分页功能,此处只需要定义这两个变量即可。

{"total":5,"rows":[{"doorCard":"1-1101","id":22,"roomArea":"140","unitNum":1,"tusers":[],"isUse":"1","buildTime":"2015-04-01"},{"doorCard":"1-1202","id":29,"roomArea":"160","unitNum":1,"tusers":[],"isUse":"0","buildTime":"2015-04-06"},{"doorCard":"2-2202","id":28,"roomArea":"160","unitNum":2,"tusers":[],"isUse":"0","buildTime":"2015-04-06"},{"doorCard":"3-3301","id":26,"roomArea":"150","unitNum":3,"tusers":[],"isUse":"1","buildTime":"2015-04-13"},{"doorCard":"3-2102","id":27,"roomArea":"160","unitNum":3,"tusers":[],"isUse":"1","buildTime":"2015-04-06"}]}

五、效果截图

关于easyui更新表格数据库和easyui datagrid增删改查的介绍到此就结束了,不知道你从中找到你需要的信息了吗 ?如果你还想了解更多这方面的信息,记得收藏关注本站。

easyui更新表格数据库
扫码二维码