❶ 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 這個地址你連接一下，把上面的代碼復制下來就行。然後建上表，配置一下就能啟動項目。