❶ java web我的html页面有一个easyUI做的datagrid，当datagrid实现增删改查之后，将数据跟新数据库中。
增删查改都有请求到后台的啊，数据传到后台通过就同步到数据库了
❷ easyui datagrid 删除多行 每删一行，行号就会发生变化，如何通过id删除，不通过行号删，该怎么写
做自己做的系统也是通过选择某一行根据这一行信息的id对数据库进行删除操作的，基本代码如下：
function del(){
var row = $('#list').datagrid('getSelected');
if(row){
$.messager.confirm('提示', '你确定删除此条记录吗？', function(r){
if (r){
location.href = '__URL__/del/id/'+row.id;
}
$.messager.show({
title:'信息',
msg:'已经取消了删除操作'
});
});
}else{
$.messager.alert('警告','没有选择任何记录信息！','warning');}
}
❸ 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="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();
ArrayList<THouse> listHouses=houseDao.getHouses(start, number); //从数据库中查询数据
Map<String, Object> jsonMap = new HashMap<String, 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"}]}
五、效果截图
❹ jquery easyui 在线表格增加，修改，删除，保存怎么做，求高手，急急急急急急急急急
新增： (M)appendRow : (A)row{"name":"xiaoming",age:"18" };删除:(M)deleteRow:(A)rowIndex(1);修改：(M) beginEdit，endEdit(这里在OnclickCell事件中调用);M是方法，A是参数
保存数据库中，新增在appendRow之后，调用业务。删除在deleteRow之后，调用业务。修改在OnAfterEdit中，调用业务。
（代码自己写）
❺ 在EasyUI中，下拉列表怎么从数据库中调
用 异步方法 post 只要将你的想要在combobox下拉框里的值 在后台 用list封装 然后 return 到前台 前台用 data 接收 然后 $('#id').combobox('loadDate',data); 就行了
❻ jquery easyui如何获取被选中的checkbox的id然后将其页面包括数据库数据删除，我的前台页面是这样写的
这个复选框是没有id的，如果你要对选中的行进行操作的话，可以通过getSelections方法获取数据，如：
var rows = $("#dbgrid").datagrid("getSelections"); // 获取所有选中的行
for (var i = 0; rows && i < rows.length; i++) {
var row = rows[i];
var index = $("#dbgrid").datagrid("getRowIndex", row); // 获取该行的索引
}
❼ easyui-datagrid 的 load 方法该怎么使用
优酷上有一套关于介绍EasyUI Datagrid用法的视频。你可以借鉴看看。
地址：http://v.youku.com/v_show/id_XMTgzMjMxNzM4MA==.html?from=s1.8-1-1.2&spm=a2h0k.8191407.0.0
大概优酷视频内容如下：
day03_01_easyui_datagrid入门
day03_02_easyui_datagrid中列名宽度自适应
day03_03_easyui_datagrid中toolbar的用法
day03_04_easyui_datagrid分页的用法
day03_05_easyui_datagrid_Ajax数据请求
day03_06_easyui_datagrid_Ajax分页
day03_07_easyui_datagrid_单一数据删除思路
day03_08_easyui_datagrid_单一数据删除的代码实现
day03_09_easyui_datagrid_如何实现多行删除数据的思路
day03_10_easyui_datagrid_实现多行删除数据的完成代码实现
如果上面的优酷连接地址找不到，就在优酷上搜索“刘阳Java”
❽ easyui 懂的进 我要设置easyui-datagrid 如何设置
但可以确保各个版块相互独立，总共4个部分1.数据绑定2.DataGrid的增改删功能3.DataGrid的分页实现4.DataGrid的样式设计先上一张截图，让你大概知道自己需要的功能是否在这张图里有所实现。PS：使用技术：WPF+ADO.NETEntityFramework1.数据绑定（涉及DataGrid绑定和Combox绑定）在DataGrid中同时包含逗自动生成列地与逗用户自定义列地由属性AutoGenerateColumns控制。默认情况下，DataGrid将根据数据源自动生成列。下图列出了生成的列类型。如果AutoGenerateColumns="True"，我们只需要如下几行代码后台dataGrid1.ItemsSource=infoList;//infoList为内容集合（这是我从数据库中获取的记录集合类型为List）PS:因为这里给dataGrid1绑定了数据源，所以下面绑定的字段都是infoList中的字段名称，同样也对应着我数据表中的字段名。里面包含FID,公司名称，职员姓名，性别，年龄，职务。解释下，怕大家无法理解Binding后面的值是如何来的了显然这种数据绑定非常的容易，如果对表格要求不高，这中无疑是最简单方便的。如果AutoGenerateColumns="False"表格字段的显示就要靠我们手动去完成了。这个也是数据绑定的重点，因为实际应用中我们大多都是自定义去完成DataGrid的数据绑定。接下来贴出代码（后面的所有功能都可以在此代码基础上添加和修改）后台namespaceDemo{//////MainWindow.xaml的交互逻辑///publicenumSex{男,女};//注意写在命名空间内，不要写在类里，否则台前local:Sex找不到路径}当我们绑定好数据运行程序的时候，会发现DataGridComboBoxColumn下拉框里虽然绑定了值，但是他不会默认显示出已经设定好的值。所以我们就可以摈弃这种现有的DataGridComboBoxColumn，我们用DataGrid样板标签DataGridTemplateColumn。我们在DataGridTemplateColumn标签里要用到2个控件，一个TextBlock控件来显示内容，另一个ComBox来提供选择。所以我们可以用如下代码替换掉注意CellTemplate和CellEditingTemplate的区别2.DataGrid的增改删功能①添加记录行+编辑记录行由于增加和编辑有一定的联系，所以就放一起来讨论在上面的代码处添加2个Button按钮,DataGrid默认是输入一行记录后自动会生成一个新行（类似MSSQL数据库添加表记录）。由属性CanUserAddRows来控制当CanUserAddRows=false的时候就不会自动生成新行。为了方便我们自己来控制，所以在DataGrid里面设置CanUserAddRows为false.后台事件intjudge=0;//0表示编辑状态，1为添加状态。因为后面的增加和编辑都在同一个事件中，所以建一个变量来区分操作TB_InformationtbInfo=newTB_Information();//这个类可以供我调用里面的方法来进行增删改查的操作privatevoidbtnAdd_Click(objectsender,RoutedEventArgse){judge=1;//现在为添加状态dataGrid1.CanUserAddRows=true;//点击添加后将CanUserAddRows重新设置为True，这样DataGrid就会自动生成新行，我们就能在新行中输入数据了。}//现在我们可以添加新记录了，我们接下来要做的就是获取这些新添加的记录//先声明一个存储新建记录集的List这里的Information是我的数据表实体类里面包含FID，公司名称，职员姓名，性别，年龄，职务ListlstInformation=newList();//我们通过RowEditEnding来获取新增的记录，就是每次编辑完行后，行失去焦点激发该事件。更新记录也是执行该事件privatevoiddataGrid1_RowEditEnding(objectsender,){Informationinfo=newInformation();//我自己的数据表实例类info=e.Row.ItemasInformation;//获取该行的记录if(judge==1)//如果是添加状态就保存该行的值到lstInformation中这样我们就完成了新行值的获取{lstInformation.Add(info);}else{tbInfo.UpdInformation(info);//如果是编辑状态就执行更新操作更新操作最简单，因为你直接可以在DataGrid里面进行编辑，编辑完成后执行这个事件就完成更新操作了}}//获取到记录后，单击保存按钮就可以保存lstInformation中的每一条记录privatevoidbtnSave_Click(objectsender,RoutedEventArgse){foreach(){tbInfo.InsInformation(info);//执行插入方法，将记录保存到数据库}judge=0;//重新回到编辑状态lstInformation.Clear();dataGrid1.CanUserAddRows=false;//因为完成了添加操作所以设置DataGrid不能自动生成新行了Binding(Num,1);}这里又会遇到一个问题。那就是更新数据的时候，发现数据更本就没更新。跟踪代码会发现后台得到的值还是原来的，无法获取编辑后的值。这个问题就是绑定模式的问题，我们只需设置双向绑定就可以了。且作用对象是在属性值更改的情况下进行双向绑定。只要在前面的每个表字段处加上Mode=TwoWay,UpdateSourceTrigger=PropertyChanged问题就解决了例如：②删除记录为了有良好的用户体验，我就做了个可以批量删除的删除功能。就是利用到CheckBox控件来完成。以绑定代码为基础添加代码首先我们要获取CheckBox中的值，有哪些是被选中的。显然CheckBox里面还必须绑定值，并且还需要一个事件。给CheckBox添加的代码如下后台代码//由ChecBox的Click事件来记录被选中行的FIDListselectFID=newList();//保存选中要删除行的FID值privatevoidCheckBox_Click(objectsender,RoutedEventArgse){CheckBoxdg=senderasCheckBox;intFID=int.Parse(dg.Tag.ToString());//获取该行的FIDvarbl=dg.IsChecked;if(bl==true){selectFID.Add(FID);//如果选中就保存FID}else{selectFID.Remove(FID);//如果选中取消就删除里面的FID}}//已经获取到里面的值了，接下来就只要完成删除操作就可以了删除事件如下privatevoidbtnDelete_Click(objectsender,RoutedEventArgse){foreach(intFIDinselectFID){tbInfo.DelInformation(FID);//循环遍历删除里面的记录}//Binding(Num,1);//这个是我绑定的一个方法，作用是删除记录后重新给DataGrid赋新的数据源}3.DataGrid的分页实现原理：其实分页功能的实现大家都清楚，无非就是把一个记录集通过运算来刷选里面对应页码的记录。接来下我们再次添加新的代码首先我们先写个分页的方法，供上面这些事件调用后台代码//number表示每个页面显示的记录数currentSize表示当前显示页数privatevoidBinding(intnumber,intcurrentSize){ListinfoList=newList();infoList=tbInfo.GetInformationList();//获取数据源intcount=infoList.Count;//获取记录总数intpageSize=0;//pageSize表示总页数if(count%number==0){pageSize=count/number;}else{pageSize=count/number+1;}tbkTotal.Text=pageSize.ToString();tbkCurrentsize.Text=currentSize.ToString();infoList=infoList.Take(number*currentSize).Skip(number*(currentSize-1)).ToList();//刷选第currentSize页要显示的记录集dataGrid1.ItemsSource=infoList;//重新绑定dataGrid1}//分页方法写好了接下来就是响应下一页，上一页，和跳转页面的事件了//先定义一个常量constintNum=12;//表示每页显示12条记录//上一页事件privatevoidbtnUp_Click(objectsender,RoutedEventArgse){intcurrentsize=int.Parse(tbkCurrentsize.Text);//获取当前页数if(currentsize>1){Binding(Num,currentsize-1);//调用分页方法}}//下一页事件privatevoidbtnNext_Click(objectsender,RoutedEventArgse){inttotal=int.Parse(tbkTotal.Text);//总页数intcurrentsize=int.Parse(tbkCurrentsize.Text);//当前页数if(currentsize=1&&pageNum(dataGrid_LoadingRow);//自动添加序号的事件调用下面的dataGrid_LoadingRow}publicvoiddataGrid_LoadingRow(objectsender,DataGridRowEventArgse){e.Row.Header=e.Row.GetIndex()+1;//设置行表头的内容值}接下来就可以修改行表头的颜色了②给列表头添加颜色③给行添加颜色+鼠标事件lt;/DataGrid>④给单元格添加颜色⑤让用户在单元格获得焦点时编辑ComboBox其实这不属于样式的范畴了，但我喜欢把改善用户体验归于这一类。当我们的表格里有类似ComboBox的控件时（如：DatePicker控件等）。我们编辑这些控件时，首先第一次单击获取单元格焦点，第二次点击才能获取编辑时的焦点，也就是用户必须单击2次才能进行操作。这种机制其实是适合文本框控件的，但对于其它控件，像ComboBox就显得很不方便了。所以我们要做的就是单击第一次的时候用户就可以编辑ComboBox。接下来我要在DataGrid添加了三个新属性（RowDetailsVisibilityMode、SelectionMode和SelectionUnit）和一个新的事件处理程序(SelectedCellsChanged)前台后台现在就差一个SelectedCellsChanged(选则单元格时出发该事件)事件的后台代码了privatevoiddataGrid1_SelectedCellsChanged(objectsender,)if(e.AddedCells.Count==0)return;varcurrentCell=e.AddedCells[0];if(currentCell.Column==dataGrid1.Columns[3])//Columns[]从0开始我这的ComboBox在第四列所以为3{dataGrid1.BeginEdit();//进入编辑模式这样单击一次就可以选择ComboBox里面的值了}⑥固定列表头这个非常简单只要在DataGrid里添加一个属性即可
❾ 谁有使用jquery easyui实现数据库的增删改的例子，非常感谢
http://www.iteye.com/topic/1069749 这个地址你连接一下，把上面的代码复制下来就行。然后建上表，配置一下就能启动项目。