Ext.grid.Panel綜合示例
包括
1、添加數據
2、簡單搜索
3、編輯數據
4、刪除數據
5、Ext 佈局
其中用到了comboBox的二級、三級聯動和默認值的設定,以及datefield的使用和numberfield的使用,現將代碼提供如下:
HTML頁面代碼
<pre name="code" class="html"><!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>Ext.datagrid遠程加載數據(添加、刪除和修改)</title>
<!--<link rel="Stylesheet" type="text/css" href="ext-4.0.7-gpl/resources/css/ext-all.css" />-->
<!--引入icon樣式-->
<!--<script type="text/javascript" src="ext-4.0.7-gpl/ext-all.js"></script>
<script type="text/javascript" src="ext-4.0.7-gpl/bootstrap.js"></script>
<script type="text/javascript" src="ext-4.0.7-gpl/ext-all-debug.js"></script>
<script type="text/javascript" src="ext-4.0.7-gpl/locale/ext-lang-zh_CN.js"></script>
<script type="text/javascript" src="js/Ext.data.grid CRUD.js"></script>-->
<link rel="stylesheet" type="text/css" href="ext-4.2.1/resources/css/ext-all-neptune.css" />
<link rel="Stylesheet" type="text/css" href="ext-4.0.7-gpl/resources/css/icon.css" />
<script type="text/javascript" src="ext-4.2.1/bootstrap.js"></script>
<script type="text/javascript" src="ext-4.2.1/locale/ext-lang-zh_CN.js"></script>
<script type="text/javascript" src="js/Ext4.2.1.data.grid.CRUD.js"></script>
</head>
<body>
</body>
</html>
javascript(Ext4.2.1.data.grid CRUD.js)代碼:註釋比較詳細
///<reference path="/ext-4.0.7-gpl/ext/ext-all.js"/>
///<reference path="/ext-4.0.7-gpl/ext-all-debug.js"/>
///<reference path="/ext-4.0.7-gpl/ext-all-dev.js"/>
///<reference path="/ext-4.2.1/bootstrap.js/>
Ext.onReady(function ()
{
Ext.QuickTips.init();
Ext.Loader.setConfig({
enable: true
});
Ext.ClassManager.setAlias("Ext.selection.CheckboxModel", "selection.checkboxmodel"); //註冊複選框選擇模式別名爲selection.checkboxmodel
Ext.form.Field.prototype.msgTarget = "side"; //提示的方式
//定義分頁變量
var pageSize = 20;
//定義數據模型
var myModel = Ext.define("news", {
extend: "Ext.data.Model",
fields: [{
name: "ID",
type: "int"
},
{
name: "Title",
type: "Title"
},
{
name: "Comment",
type: "Comment"
},
{
name: "Addtime",
type: "string"
},
{
name: "Upptime",
type: "string"
},
{
name: "Author",
type: "string"
},
{
name: "TradeName",
type: "string"
},
{
name: "isScrool",
type: "int"
},
{
name: "Count",
type: "int"
},
{
name: "Image",
type: "string"
},
{
name: "UserName",
type: "string"
},
{
name: "AreaName",
type: "string"
}]
});
//定義Ext.data.Store對象
var newsStore = Ext.create("Ext.data.Store", {
//指定數據記錄
model: "news",
//設置分頁大小
pageSize: pageSize,
//使用Proxy指定加載數據
proxy: {
type: "ajax",
url: "/AjaxHandler/newsOperate.ashx?action=search",
reader: {
type: "json",
root: "data",
//獲取數據總是
totalProperty: "totalCount"
}
},
autoLoad: true
});
//定義newsType數據模型
Ext.define("NewsType", {
extend: "Ext.data.Model",
fields: [
{ name: "TypeName", type: "string" },
{ name: "ID", type: "int" }
]
});
//定義NewsType數據存儲
var newsTypeStore = Ext.create("Ext.data.Store", {
autoLoad: true,
model: "NewsType",
proxy: {
type: "ajax",
url: "/AjaxHandler/newsTypeOpearte.ashx?type=newstype",
reader: {
type: "json",
root: "data"
}
}
});
//定義新聞二級分類(SecondNewsType)數據模型
Ext.define("SecondNewsType", {
extend: "Ext.data.Model",
fields: [
{ name: "TradeName", type: "string" },
{ name: "ID", type: "int" },
{ name: "NewsTypeID", type: "int" }
]
});
var newsSecondTypeStore = Ext.create("Ext.data.Store", {
autoLoad: false,
model: "SecondNewsType",
proxy: {
type: "ajax",
url: "/AjaxHandler/newsTypeOpearte.ashx?type=secondnewstype",
reader: {
type: "json",
root: "data"
}
}
});
//定義省份、地市、區縣數據模型
Ext.define("Area", {
extend: "Ext.data.Model",
fields: [
{ name: "AreaID", type: "int" },
{ name: "LevelID", type: "string" },
{ name: "AreaName", type: "string" },
{ name: "gps_W", type: "float" },
{ name: "gps_L", type: "float" }
]
});
var provinceStore = Ext.create("Ext.data.Store", {
autoLoad: true,
model: "Area",
proxy: {
type: "ajax",
url: "/AjaxHandler/AreaOperate.ashx?action=province",
reader: {
type: "json",
root: "data"
}
}
});
//地市comboBox
var cityStore = Ext.create("Ext.data.Store", {
autoLoad: true,
model: "Area",
proxy: {
type: "ajax",
url: "/AjaxHandler/AreaOperate.ashx?action=city",
reader: {
type: "json",
root: "data"
}
}
});
//區縣comboBox
var regionStore = Ext.create("Ext.data.Store", {
autoLoad: true,
model: "Area",
proxy: {
type: "ajax",
url: "/AjaxHandler/AreaOperate.ashx?action=region",
reader: {
type: "json",
root: "data"
}
}
});
//擴展Ext.toolbar.Paging中的刷新
//定義分頁
var pagebar = Ext.create("Ext.toolbar.Paging", {
store: newsStore,
displayInfo: true,
displayMsg: "顯示{0}-{1}條,共計{2}條",
emptyMsg: "沒有數據"
});
//定義Ext.grid.Panel組件
var grid = Ext.create("Ext.grid.Panel", {
title: "Ext.grid.Panel使用Ajax方式加載遠程數據",
width: "100%",
store: newsStore,
columnLines: true,
rowLines: true,
selType: "checkboxmodel",
//設置單元格選中模式爲Ext.selection.CheckboxModel
// simpleSelect: true,
multiSelect: true,
viewConfig: {
forceFit: true,
stripeRows: true //在表格中顯示斑馬線
},
//啓用簡單選擇功能
renderTo: Ext.getBody(),
iconCls: "icon-grid",
tbar: [{
xtype: "button",
frame: true,
text: "添加",
scale: "small",
tooltip: "添加新聞",
iconCls: "Add",
handler: AddNewsFn
},
{
xtype: "button",
frame: true,
text: "搜索",
scale: "small",
tooltip: "搜索",
iconCls: "Magnifier",
handler: SearchNewsFn
},
{
xtype: "button",
frame: true,
text: "編輯",
scale: "small",
tooltip: "編輯",
iconCls: "Applicationformedit",
handler: EditNewsFn
},
{
xtype: "button",
frame: true,
text: "刪除",
scale: "small",
tooltip: "刪除",
iconCls: "Applicationformdelete",
handler: DeleteNewsFn
},
{
xtype: "button",
frame: true,
text: "查看",
scale: "small",
tooltip: "查看",
iconCls: "Diskmultiple",
handler: LookNewsFn
},
{
xtype: "button",
frame: true,
text: "刷新",
scale: "small",
tooltip: "刷新",
iconCls: "Tablerefresh",
handler: RefreshNewsFn
}],
//分頁功能
bbar: pagebar,
//定義grid包含的所有數據列
columns: [{
text: "編號",
dataIndex: "ID",
align: "center",
width: 50
},
{
text: "新聞標題",
dataIndex: "Title",
align: "center",
width: 230,
renderer: rendererTitle
},
{
text: "新聞內容",
dataIndex: "Comment",
align: "center",
width: 600,
renderer: rendererComment
},
{
text: "添加時間",
dataIndex: "Addtime",
align: "center",
width: 140,
renderer: Ext.util.Format.dateRenderer('Y-m-d H:i:s')
},
{
text: "修改時間",
dataIndex: "Upptime",
align: "center",
width: 140,
renderer: Ext.util.Format.dateRenderer('Y-m-d H:i:s')
},
{
text: "新聞來源",
dataIndex: "Author",
align: "center",
width: 80
},
{
text: "新聞分類",
dataIndex: "TradeName",
align: "center",
width: 80
},
{
text: "是否焦點",
dataIndex: "isScrool",
align: "center",
width: 60,
renderer: scroolRenderer
},
{
text: "閱讀次數",
dataIndex: "Count",
align: "center",
width: 60
},
{
text: "新聞圖片",
dataIndex: "Image",
align: "center",
width: 60
},
{
text: "用戶名稱",
dataIndex: "UserName",
align: "center",
width: 60
},
{
text: "所屬區域",
dataIndex: "AreaName",
align: "center",
width: 60
}
]
});
//搜索
function SearchNewsFn()
{
var win = Ext.create("Ext.window.Window", {
title: "簡單搜索",
layout: {
type: "vbox",
align: "left"
},
modal: true,
//開啓遮罩功能
items: [{
xtype: "textfield",
fieldLabel: "新聞標題",
name: "Title",
id: "Title"
},
{
xtype: "textfield",
fieldLabel: "新聞內容",
name: "Comment",
id: "Comment"
},
{
xtype: "datefield",
fieldLabel: "開始時間(From)",
name: "Addtimestart",
format: "Y-m-d",
id: "Addtimestart"
},
{
xtype: "datefield",
fieldLabel: "開始時間(End)",
name: "Addtimeend",
id: "Addtimeend"
}],
buttons: [{
xtype: "button",
frame: true,
text: "搜索",
scale: "small",
tooltip: "搜索",
iconCls: "Magnifier",
handler: function ()
{
//以Ajax方式發送請求
Ext.Ajax.request({
url: "/AjaxHandler/newsOperate.ashx?action=search",
params: {
Title: Ext.htmlEncode(Ext.getCmp("Title").getValue()),
Comment: Ext.htmlEncode(Ext.getCmp("Comment").getValue()),
start: 0,
limit: 20
},
success: function (data)
{
//加載Ext.grid.Panel
var respText = Ext.decode(data.responseText);
//隱藏當前的窗口對象
win.setVisible(false);
//搜索後重新加載newsStore
var title = Ext.getCmp("Title").getValue();
var comment = Ext.getCmp("Comment").getValue();
newsStore.on("beforeload",
function (store, options)
{
Ext.apply(store.proxy.extraParams, {
Title: title,
Comment: comment
});
});
newsStore.load({
url: "/AjaxHandler/newsOperate.ashx?action=search",
params: {
start: 0,
limit: 20,
Title: title,
Comment: comment
}
});
}
})
}
}]
}).show();
win.setPagePosition(200, 100);
win.setSize(300, 200);
}
function rendererTitle(title)
{
if (title != "" && Ext.getCmp("Title") != null && Ext.getCmp("Title").getValue() != "")
{
title = title.replace(Ext.getCmp("Title").getValue(), "<font color=\"red\"><b>" + Ext.getCmp("Title").getValue() + "</b></font>");
}
return title;
}
function rendererComment(comment)
{
comment = setContent(comment);
if (comment != "" && comment.length > 0)
{
return comment.substring(0, 70) + "……";
} else
{
return comment;
}
return comment;
}
function scroolRenderer(isscrool)
{
var result;
if (isscrool == 1)
{
result = "<font color=\"red\">是</font>";
}
if (isscrool == 0)
{
result = "<font color=\"blue\">否</font>";
}
return result;
}
function dateformatter(datetime)
{
if (datetime != null)
{
var date = new Date(datetime);
return date.getFullYear() + '-' + (date.getMonth() + 1) + '-' + date.getDate();
}
}
function setContent(str)
{
str = str.replace(/<\/?[^>]*>/g, ''); //去除HTML tag
str.value = str.replace(/[ | ]*\n/g, '\n'); //去除行尾空白
//str = str.replace(/\n[\s| | ]*\r/g,'\n'); //去除多餘空行
return str;
}
//添加功能
function AddNewsFn()
{
var winAdd = Ext.create("Ext.window.Window", {
title: "添加新聞",
modal: true,
//resizable: false,
items: [{
autoHeight: true,
layout: "column",
border: false,
items: [{
columnWidth: .50,
xtype: "fieldset",
layout: "form",
border: false,
style: "margin-left:2px;padding-left:5px",
fieldDefaults: {
labelWidth: 70,
labelAlign: "left"
},
items: [{
xtype: "textfield",
fieldLabel: "新聞標題",
name: "Title",
id: "Title",
width: 400,
emptyText: "請輸入新聞標題",
allowBlank: false,
//不允許爲空
blankText: "不能爲空" //錯誤提示信息,默認爲This field is required!
},
{
xtype: "datefield",
fieldLabel: "添加時間",
name: "Addtime",
format: "Y-m-d",
id: "Addtime",
width: 400,
emptyText: "請點擊右側的按鈕選擇時間",
allowBlank: false,
//不允許爲空
blankText: "不能爲空" //錯誤提示信息,默認爲This field is required!
},
{
xtype: "datefield",
fieldLabel: "更新時間",
name: "Upptime",
id: "Upptime",
format: "Y-m-d",
width: 400,
emptyText: "請點擊右側的按鈕選擇時間",
allowBlank: false,
//不允許爲空
blankText: "不能爲空" //錯誤提示信息,默認爲This field is required!
},
{
xtype: "textfield",
fieldLabel: "新聞來源",
name: "Author",
id: "Author",
width: 400,
emptyText: "請輸入該新聞的來源",
allowBlank: false,
//不允許爲空
blankText: "不能爲空" //錯誤提示信息,默認爲This field is required!
},
{
xtype: "radiogroup",
fieldLabel: "是否熱點",
columns: 2,
items: [{
boxLabel: "是",
name: "isScrool",
inputValue: "1"
},
{
boxLabel: "否",
name: "isScrool",
inputValue: "0",
checked: true
}]
},
{
xtype: "numberfield",
fieldLabel: "閱讀次數",
name: "Count",
id: "Count",
width: 300,
emptyText: "請輸入新聞的閱讀次數",
maxValue: 1000,
minValue: 1,
allowBlank: false,
//不允許爲空
blankText: "不能爲空" //錯誤提示信息,默認爲This field is required!
}
]
},
{
columnWidth: 0.50,
xtype: "fieldset",
layout: "form",
border: false,
style: "margin-left:5px;padding-left:5px",
fieldDefaults: {
labelWidth: 70,
labelAlign: "left"
},
items: [
{
xtype: "combo",
name: "TypeName",
fieldLabel: "一級分類",
displayField: "TypeName",
valueField: "ID",
forceSelection: true,
//要求輸入值必須在列表中存在
id: "typeName",
queryMode: "local",
width: 200,
store: newsTypeStore,
emptyText: "請選擇一級分類",
triggerAction: "all",
selectOnFocus: true,
listeners: {
"select": function ()
{
var getCombo = Ext.getCmp("typeName");
newsSecondTypeStore.load({
params: {
newsTypeID: getCombo.getValue()
}
});
}
},
allowBlank: false,
//不允許爲空
blankText: "不能爲空" //錯誤提示信息,默認爲This field is required!
},
{
xtype: "combo",
name: "TypeID",
fieldLabel: "二級分類",
displayField: "TradeName",
valueField: "ID",
forceSelection: true,
//要求輸入值必須在列表中存在
id: "tradeName",
queryMode: "local",
emptyText: "請選擇二級分類",
width: 200,
store: newsSecondTypeStore,
defaultListConfig: {
loadMask: false
},
//如果不設置LoadMask,數據已經取出,但是總顯示加載中……(鬱悶ing)
allowBlank: false,
//不允許爲空
blankText: "不能爲空" //錯誤提示信息,默認爲This field is required!
},
{
xtype: "combo",
name: "AreaName",
fieldLabel: "省份",
displayField: "AreaName",
valueField: "LevelID",
forceSelection: true,
//要求輸入值必須在列表中存在
emptyText: "請選擇省份",
id: "province",
queryMode: "local",
store: provinceStore,
listeners: {
"select": function ()
{
cityStore.load({
params: {
levelID: Ext.getCmp("province").getValue()
}
});
}
},
allowBlank: false,
//不允許爲空
blankText: "不能爲空" //錯誤提示信息,默認爲This field is required!
},
{
xtype: "combo",
name: "AreaName",
fieldLabel: "城市",
displayField: "AreaName",
valueField: "LevelID",
forceSelection: true,
//要求輸入值必須在列表中存在
id: "city",
emptyText: "請選擇城市",
queryMode: "local",
triggerAction: "all",
store: cityStore,
defaultListConfig: {
loadMask: false
},
listeners: {
"select": function ()
{
regionStore.load({
params: {
levelID: Ext.getCmp("city").getValue()
}
});
}
},
allowBlank: false,
//不允許爲空
blankText: "不能爲空" //錯誤提示信息,默認爲This field is required!
},
{
xtype: "combo",
name: "AreaName",
fieldLabel: "區縣",
displayField: "AreaName",
valueField: "LevelID",
forceSelection: true,
id: "region",
emptyText: "請選擇區縣",
queryMode: "local",
triggerAction: "all",
store: regionStore,
defaultListConfig: {
loadMask: false
},
allowBlank: false,
//不允許爲空
blankText: "不能爲空",
//錯誤提示信息,默認爲This field is required!
listeners: {
"select": function ()
{
Ext.Ajax.request({
url: "/AjaxHandler/AreaOperate.ashx",
params: {
action: "read",
levelID: Ext.getCmp("region").getValue()
},
success: function (data)
{
//給隱藏的控件賦值
var data = eval("(" + data.responseText + ")");
Ext.getCmp("CityID").setValue(data[0].AreaID);
}
});
}
}
},
{
xtype: "textfield",
fieldLabel: "添加人",
name: "UserID",
id: "UserID",
allowBlank: false,
//不允許爲空
blankText: "不能爲空" //錯誤提示信息,默認爲This field is required!
}
]
}]
},
{
xtype: "fieldset",
title: "新聞內容",
border: false,
style: "margin-left:2px;padding-left:5px",
layout: "form",
width: 688,
items: [
{
xtype: "htmleditor",
style: "margin-left:2px;padding-left:5px",
name: "Comment",
id: "Comment",
height: 180,
emptyText: "請輸入新聞來源",
allowBlank: false,
//不允許爲空
blankText: "不能爲空" //錯誤提示信息,默認爲This field is required!
}
]
},
],
buttonAlign: "center",
buttons: [{
text: "確定",
handler: function ()
{
var form = winAdd.items.get(0).getForm();
if (form.isValid())
{
//以Ajax方式發送請求
Ext.Ajax.request({
url: "/AjaxHandler/newsOperate.ashx",
params: {
data: Ext.JSON.encode(form.getValues()),
action: "add"
},
success: function (resp, opts)
{
var respText = Ext.JSON.decode(resp.responseText);
if (respText.success)
{
Ext.MessageBox.alert("提示", "添加成功",
function ()
{
winAdd.close();
newsStore.load({
params: {
start: 0,
limit: pageSize
}
});
});
} else
{
Ext.MessageBox.alert("提示", "添加失敗");
}
}
});
}
}
},
{
text: "重置",
handler: function ()
{
winAdd.items.get(0).getForm().reset();
}
},
{
text: "取消",
handler: function ()
{
winAdd.close();
}
}]
}).show();
winAdd.setPagePosition(200, 100);
winAdd.setSize(700, 450);
}
//編輯功能
function EditNewsFn()
{
var rows = grid.getSelectionModel().getSelection();
if (rows.length == 0)
{
Ext.Msg.alert("提示", "請選擇一行");
} else
{
var winEdit = Ext.create("Ext.window.Window", {
title: "編輯標題爲:\"" + rows[0].get("Title") + "\"信息",
modal: true,
resizable: false,
items: [{
xtype: "form",
bodyPadding: 10,
id: "editform",
items: [{
xtype: "textfield",
fieldLabel: "ID",
name: "ID",
id: "ID",
width: 400,
emptyText: "請輸入ID",
allowBlank: false,
//不允許爲空
blankText: "不能爲空",
//錯誤提示信息,默認爲This field is required!
readOnly: true,
value: rows[0].get("ID") //給文本框內容賦值
},
{
xtype: "textfield",
fieldLabel: "新聞標題",
name: "Title",
id: "Title",
width: 400,
emptyText: "請輸入新聞標題",
allowBlank: false,
//不允許爲空
blankText: "不能爲空",
//錯誤提示信息,默認爲This field is required!
value: rows[0].get("Title")
},
{
xtype: "datefield",
fieldLabel: "添加時間",
name: "Addtime",
format: "Y-m-d H:i:s",
id: "Addtime",
width: 400,
emptyText: "請點擊右側的按鈕選擇時間",
allowBlank: false,
//不允許爲空
blankText: "不能爲空",
//錯誤提示信息,默認爲This field is required!
value: Ext.util.Format.date(rows[0].get("Addtime"), "Y-m-d H:i:s") //datefield類型賦值
},
{
xtype: "datefield",
fieldLabel: "更新時間",
name: "Upptime",
id: "Upptime",
format: "Y-m-d H:i:s",
width: 400,
emptyText: "請點擊右側的按鈕選擇時間",
allowBlank: false,
//不允許爲空
blankText: "不能爲空",
//錯誤提示信息,默認爲This field is required!
value: Ext.util.Format.date(rows[0].get("Upptime"), "Y-m-d H:i:s") //datefield類型賦值
},
{
xtype: "textfield",
fieldLabel: "新聞來源",
name: "Author",
id: "Author",
width: 400,
emptyText: "請輸入該新聞的來源",
allowBlank: false,
//不允許爲空
blankText: "不能爲空",
//錯誤提示信息,默認爲This field is required!
value: rows[0].get("Author")
},
{
xtype: "radiogroup",
fieldLabel: "是否熱點",
id: "isScrool",
columns: 1,
items: [{
boxLabel: "是",
name: "isScrool",
inputValue: "1"
},
{
boxLabel: "否",
name: "isScrool",
inputValue: "0"
}]
},
{
xtype: "numberfield",
fieldLabel: "閱讀次數",
name: "Count",
id: "Count",
width: 300,
emptyText: "請輸入新聞的閱讀次數",
maxValue: 1000,
minValue: 1,
allowBlank: false,
//不允許爲空
blankText: "不能爲空",
//錯誤提示信息,默認爲This field is required!
value: rows[0].get("Count")
},
{
xtype: "textfield",
fieldLabel: "添加人",
name: "UserID",
id: "UserID",
allowBlank: false,
//不允許爲空
blankText: "不能爲空",
//錯誤提示信息,默認爲This field is required!
value: rows[0].get("UserName")
},
{
xtype: "combo",
name: "TypeName",
fieldLabel: "一級分類",
displayField: "TypeName",
valueField: "ID",
forceSelection: true,
//要求輸入值必須在列表中存在
id: "typeName",
queryMode: "local",
store: newsTypeStore,
emptyText: "請選擇一級分類",
triggerAction: "all",
selectOnFocus: true,
allowBlank: false,
//不允許爲空
blankText: "不能爲空" //錯誤提示信息,默認爲This field is required!
},
{
xtype: "combo",
name: "TypeID",
fieldLabel: "二級分類",
displayField: "TradeName",
valueField: "ID",
forceSelection: true,
//要求輸入值必須在列表中存在
id: "tradeName",
queryMode: "local",
emptyText: "請選擇二級分類",
store: newsSecondTypeStore,
defaultListConfig: {
loadMask: false
},
//如果不設置LoadMask,數據已經取出,但是總顯示加載中……(鬱悶ing)
allowBlank: false,
//不允許爲空
blankText: "不能爲空" //錯誤提示信息,默認爲This field is required!
},
{
xtype: "combo",
name: "AreaName",
fieldLabel: "省份",
displayField: "AreaName",
valueField: "LevelID",
forceSelection: true,
//要求輸入值必須在列表中存在
emptyText: "請選擇省份",
id: "province",
queryMode: "local",
store: provinceStore,
allowBlank: false,
//不允許爲空
blankText: "不能爲空" //錯誤提示信息,默認爲This field is required!
},
{
xtype: "combo",
name: "AreaName",
fieldLabel: "城市",
displayField: "AreaName",
valueField: "LevelID",
forceSelection: true,
//要求輸入值必須在列表中存在
id: "city",
emptyText: "請選擇城市",
queryMode: "local",
triggerAction: "all",
store: cityStore,
defaultListConfig: {
loadMask: false
},
allowBlank: false,
//不允許爲空
blankText: "不能爲空" //錯誤提示信息,默認爲This field is required!
},
{
xtype: "combo",
name: "AreaName",
fieldLabel: "區縣",
displayField: "AreaName",
valueField: "LevelID",
forceSelection: true,
id: "region",
emptyText: "請選擇區縣",
queryMode: "local",
triggerAction: "all",
store: regionStore,
defaultListConfig: {
loadMask: false
},
allowBlank: false,
//不允許爲空
blankText: "不能爲空" //錯誤提示信息,默認爲This field is required!
},
{
xtype: "hiddenfield",
name: "CityID",
id: "CityID"
},
{
xtype: "htmleditor",
fieldLabel: "新聞內容",
name: "Comment",
id: "Comment",
height: 180,
emptyText: "請輸入新聞來源",
allowBlank: false,
//不允許爲空
blankText: "不能爲空",
//錯誤提示信息,默認爲This field is required!
value: rows[0].get("Comment")
}],
buttonAlign: "center",
buttons: [{
text: "確定",
handler: function ()
{
var form = winEdit.items.get(0).getForm();
if (form.isValid())
{
//以Ajax方式發送請求
Ext.Ajax.request({
url: "/AjaxHandler/newsOperate.ashx",
params: {
data: Ext.JSON.encode(form.getValues()),
action: "edit"
},
success: function (resp, opts)
{
var respText = Ext.JSON.decode(resp.responseText);
if (respText.success)
{
Ext.MessageBox.alert("提示", "保存成功",
function ()
{
winEdit.close();
newsStore.load({
params: {
start: 0,
limit: pageSize
}
});
});
} else
{
Ext.MessageBox.alert("提示", "保存失敗");
}
}
});
}
}
},
{
text: "取消",
handler: function ()
{
winEdit.close();
}
}]
}]
}).show();
//綁定radiogroup
var radioGroupitems = Ext.getCmp("isScrool").items;
for (var i = 0; i < radioGroupitems.items.length; i++)
{
if (radioGroupitems.items[i].inputValue == rows[0].get("isScrool").toString())
{
//radioGroupitems.items[i].checked = true; //此種方式不行,必須用以下賦值的方式賦值
radioGroupitems.items[i].setValue(rows[0].get("isScrool").toString());
}
}
//綁定comboBox
//獲取市級的數據
Ext.Ajax.request({
url: "/AjaxHandler/AreaOperate.ashx",
params: {
action: "readLevel",
AreaName: rows[0].get("AreaName")
},
success: function (data)
{
var data = eval("(" + data.responseText + ")");
var sLevelID = data[0].LevelID.substring(0, 6);
//加載、綁定區縣級別comboBox
regionStore.load({
params: {
levelID: sLevelID
}
});
Ext.getCmp("region").setValue(data[0].LevelID); //以賦值的方式綁定comboBox
//加載、綁定地市級別comboBox
cityStore.load({
params: {
levelID: sLevelID.substring(0, 3)
}
});
Ext.getCmp("city").setValue(sLevelID);
//綁定省份
Ext.getCmp("province").setValue(sLevelID.substring(0, 3));
//添加省份comboBox select事件
Ext.getCmp("province").on("select",
function ()
{
cityStore.load({
params: {
levelID: Ext.getCmp("province").getValue()
}
});
});
//添加市級comboBo select事件
Ext.getCmp("city").on("select",
function ()
{
regionStore.load({
params: {
levelID: Ext.getCmp("city").getValue()
}
});
});
//給隱藏的控件賦值
//Ext.getCmp("CityID").setValue(Ext.getCmp("region").getValue());
Ext.getCmp("region").on("select",
function ()
{
Ext.Ajax.request({
url: "/AjaxHandler/AreaOperate.ashx",
params: {
action: "read",
levelID: Ext.getCmp("region").getValue()
},
success: function (data)
{
//給隱藏的控件賦值
var data = eval("(" + data.responseText + ")");
Ext.getCmp("CityID").setValue(data[0].AreaID);
}
});
});
}
});
//綁定新聞分類comboBox
//獲取新聞一級分類comboBox
Ext.Ajax.request({
url: "/AjaxHandler/newsTypeOpearte.ashx",
params: {
type: "read",
tradeName: rows[0].get("TradeName")
},
success: function (data)
{
var data = eval("(" + data.responseText + ")");
//加載新聞二級分類comboBox
newsSecondTypeStore.load({
params: {
newsTypeID: data[0].NewsTypeID
}
});
//綁定新聞二級分類comboBox
Ext.getCmp("tradeName").setValue(data[0].ID);
//綁定新聞一級分類comboBox
Ext.getCmp("typeName").setValue(data[0].NewsTypeID);
//新聞一級分類comboBox添加select事件
Ext.getCmp("typeName").on("select",
function ()
{
newsSecondTypeStore.load({
params: {
newsTypeID: Ext.getCmp("typeName").getValue()
}
});
});
}
});
winEdit.setPagePosition(200, 100);
winEdit.setSize(700, 650);
}
}
/*#region刪除新聞*/
function DeleteNewsFn()
{
/*#region 格式化相關列 */
Ext.window.MessageBox.prototype.buttonText = {
ok: "確定",
cancel: "取消",
yes: "是",
no: "否"
};
Ext.MessageBox = Ext.Msg = new Ext.window.MessageBox();
//endregion
var rows = grid.getSelectionModel().getSelection();
if (rows.length == 0)
{
Ext.Msg.alert("確認", "請選擇一行");
} else
{
Ext.MessageBox.confirm(" 確認", "確定要刪除嗎?",
function (btn)
{
if (btn == "yes")
{
Ext.Ajax.request({
url: "/AjaxHandler/newsOperate.ashx",
params: {
data: rows[0].get("ID"),
action: "del"
},
success: function (resp, opts)
{
var respText = Ext.JSON.decode(resp.responseText);
if (respText.success)
{
Ext.MessageBox.alert("提示", "刪除成功",
function ()
{
newsStore.load({
params: {
start: 0,
limit: pageSize
}
});
});
} else
{
Ext.MessageBox.alert("提示", "刪除失敗");
}
}
});
}
})
//以Ajax方式發送請求
}
}
//查看功能
function LookNewsFn()
{
var rows = grid.getSelectionModel().getSelection();
if (rows.length == 0)
{
Ext.Msg.alert("提示", "請選擇一行");
} else
{
var winLook = Ext.create("Ext.window.Window", {
title: "查看標題爲:\"" + rows[0].get("Title") + "\"詳細",
modal: true,
resizable: false,
items: [{
xtype: "form",
bodyPadding: 10,
id: "editform",
items: [{
xtype: "textfield",
fieldLabel: "ID",
name: "ID",
id: "ID",
width: 400,
emptyText: "請輸入ID",
allowBlank: false,
//不允許爲空
blankText: "不能爲空",
//錯誤提示信息,默認爲This field is required!
readOnly: true,
value: rows[0].get("ID") //給文本框內容賦值
},
{
xtype: "textfield",
fieldLabel: "新聞標題",
name: "Title",
id: "Title",
width: 400,
readOnly: true,
emptyText: "請輸入新聞標題",
allowBlank: false,
//不允許爲空
blankText: "不能爲空",
//錯誤提示信息,默認爲This field is required!
value: rows[0].get("Title")
},
{
xtype: "datefield",
fieldLabel: "添加時間",
name: "Addtime",
format: "Y-m-d H:i:s",
id: "Addtime",
readOnly: true,
width: 400,
emptyText: "請點擊右側的按鈕選擇時間",
allowBlank: false,
//不允許爲空
blankText: "不能爲空",
//錯誤提示信息,默認爲This field is required!
value: Ext.util.Format.date(rows[0].get("Addtime"), "Y-m-d H:i:s") //datefield類型賦值
},
{
xtype: "datefield",
fieldLabel: "更新時間",
name: "Upptime",
id: "Upptime",
readOnly: true,
format: "Y-m-d H:i:s",
width: 400,
emptyText: "請點擊右側的按鈕選擇時間",
allowBlank: false,
//不允許爲空
blankText: "不能爲空",
//錯誤提示信息,默認爲This field is required!
value: Ext.util.Format.date(rows[0].get("Upptime"), "Y-m-d H:i:s") //datefield類型賦值
},
{
xtype: "textfield",
fieldLabel: "新聞來源",
name: "Author",
id: "Author",
readOnly: true,
width: 400,
emptyText: "請輸入該新聞的來源",
allowBlank: false,
//不允許爲空
blankText: "不能爲空",
//錯誤提示信息,默認爲This field is required!
value: rows[0].get("Author")
},
{
xtype: "radiogroup",
fieldLabel: "是否熱點",
id: "isScrool",
readOnly: true,
columns: 1,
items: [{
boxLabel: "是",
name: "isScrool",
inputValue: "1"
},
{
boxLabel: "否",
name: "isScrool",
inputValue: "0"
}]
},
{
xtype: "numberfield",
fieldLabel: "閱讀次數",
name: "Count",
id: "Count",
readOnly: true,
width: 300,
emptyText: "請輸入新聞的閱讀次數",
maxValue: 1000,
minValue: 1,
allowBlank: false,
//不允許爲空
blankText: "不能爲空",
//錯誤提示信息,默認爲This field is required!
value: rows[0].get("Count")
},
{
xtype: "textfield",
fieldLabel: "添加人",
name: "UserID",
readOnly: true,
id: "UserID",
allowBlank: false,
//不允許爲空
blankText: "不能爲空",
//錯誤提示信息,默認爲This field is required!
value: rows[0].get("UserName")
},
{
xtype: "combo",
name: "TypeName",
fieldLabel: "一級分類",
displayField: "TypeName",
valueField: "ID",
forceSelection: true,
//要求輸入值必須在列表中存在
id: "typeName",
queryMode: "local",
readOnly: true,
store: newsTypeStore,
emptyText: "請選擇一級分類",
triggerAction: "all",
selectOnFocus: true,
allowBlank: false,
//不允許爲空
blankText: "不能爲空" //錯誤提示信息,默認爲This field is required!
},
{
xtype: "combo",
name: "TypeID",
fieldLabel: "二級分類",
displayField: "TradeName",
valueField: "ID",
forceSelection: true,
//要求輸入值必須在列表中存在
id: "tradeName",
queryMode: "local",
readOnly: true,
emptyText: "請選擇二級分類",
store: newsSecondTypeStore,
defaultListConfig: {
loadMask: false
},
//如果不設置LoadMask,數據已經取出,但是總顯示加載中……(鬱悶ing)
allowBlank: false,
//不允許爲空
blankText: "不能爲空" //錯誤提示信息,默認爲This field is required!
},
{
xtype: "combo",
name: "AreaName",
fieldLabel: "省份",
readOnly: true,
displayField: "AreaName",
valueField: "LevelID",
forceSelection: true,
//要求輸入值必須在列表中存在
emptyText: "請選擇省份",
id: "province",
queryMode: "local",
store: provinceStore,
allowBlank: false,
//不允許爲空
blankText: "不能爲空" //錯誤提示信息,默認爲This field is required!
},
{
xtype: "combo",
name: "AreaName",
readOnly: true,
fieldLabel: "城市",
displayField: "AreaName",
valueField: "LevelID",
forceSelection: true,
//要求輸入值必須在列表中存在
id: "city",
emptyText: "請選擇城市",
queryMode: "local",
triggerAction: "all",
store: cityStore,
defaultListConfig: {
loadMask: false
},
allowBlank: false,
//不允許爲空
blankText: "不能爲空" //錯誤提示信息,默認爲This field is required!
},
{
xtype: "combo",
name: "AreaName",
fieldLabel: "區縣",
readOnly: true,
displayField: "AreaName",
valueField: "LevelID",
forceSelection: true,
id: "region",
emptyText: "請選擇區縣",
queryMode: "local",
triggerAction: "all",
store: regionStore,
defaultListConfig: {
loadMask: false
},
allowBlank: false,
//不允許爲空
blankText: "不能爲空" //錯誤提示信息,默認爲This field is required!
},
{
xtype: "htmleditor",
fieldLabel: "新聞內容",
name: "Comment",
id: "Comment",
readOnly: true,
height: 180,
emptyText: "請輸入新聞來源",
allowBlank: false,
//不允許爲空
blankText: "不能爲空",
//錯誤提示信息,默認爲This field is required!
value: rows[0].get("Comment")
}]
}]
}).show();
//綁定radiogroup
var radioGroupitems = Ext.getCmp("isScrool").items;
for (var i = 0; i < radioGroupitems.items.length; i++)
{
if (radioGroupitems.items[i].inputValue == rows[0].get("isScrool").toString())
{
//radioGroupitems.items[i].checked = true; //此種方式不行,必須用以下賦值的方式賦值
radioGroupitems.items[i].setValue(rows[0].get("isScrool").toString());
}
}
//綁定comboBox
//獲取市級的數據
Ext.Ajax.request({
url: "/AjaxHandler/AreaOperate.ashx",
params: {
action: "readLevel",
AreaName: rows[0].get("AreaName")
},
success: function (data)
{
var data = eval("(" + data.responseText + ")");
var sLevelID = data[0].LevelID.substring(0, 6);
//加載、綁定區縣級別comboBox
regionStore.load({
params: {
levelID: sLevelID
}
});
Ext.getCmp("region").setValue(data[0].LevelID); //以賦值的方式綁定comboBox
//加載、綁定地市級別comboBox
cityStore.load({
params: {
levelID: sLevelID.substring(0, 3)
}
});
Ext.getCmp("city").setValue(sLevelID);
//綁定省份
Ext.getCmp("province").setValue(sLevelID.substring(0, 3));
}
});
//綁定新聞分類comboBox
//獲取新聞一級分類comboBox
Ext.Ajax.request({
url: "/AjaxHandler/newsTypeOpearte.ashx",
params: {
type: "read",
tradeName: rows[0].get("TradeName")
},
success: function (data)
{
var data = eval("(" + data.responseText + ")");
//加載新聞二級分類comboBox
newsSecondTypeStore.load({
params: {
newsTypeID: data[0].NewsTypeID
}
});
//綁定新聞二級分類comboBox
Ext.getCmp("tradeName").setValue(data[0].ID);
//綁定新聞一級分類comboBox
Ext.getCmp("typeName").setValue(data[0].NewsTypeID);
}
});
winEwinLookdit.setPagePosition(200, 100);
winLook.setSize(700, 650);
}
}
//刷新(重新加載)
function RefreshNewsFn()
{
newsStore.load({
url: "/AjaxHandler/newsOperate.ashx?action=search",
params: {
start: 0,
limit: 20
}
});
}
})
newsTypeOpearte.ashx代碼如下:
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using Newtonsoft.Json;
namespace Ext.AjaxHandler
{
/// <summary>
/// newsTypeOpearte 的摘要說明
/// </summary>
public class newsTypeOpearte : IHttpHandler
{
public void ProcessRequest(HttpContext context)
{
context.Response.ContentType = "text/json";
//context.Response.Write("Hello World");
string type = context.Request.Params["type"];
switch (type)
{
case "newstype":
ReaderNewsType(context);
break;
case "secondnewstype":
ReaderSecondNewsType(context);
break;
case "read":
ReadTypeIDByName(context);
break;
default:
ReaderNewsType(context);
break;
}
}
protected void ReadTypeIDByName(HttpContext context)
{
string result = string.Empty;
string TradeName = context.Request.Params["tradeName"];
using (Entities db = new Entities())
{
List<SecondNewsType> secondNewsTypeList = new List<SecondNewsType>();
var query = (from s in db.SecondNewsType where s.TradeName == TradeName select s).OrderByDescending(t => t.ID);
foreach (var item in query)
{
secondNewsTypeList.Add(new SecondNewsType()
{
ID = item.ID,
NewsTypeID = item.NewsTypeID,
TradeName = item.TradeName
});
result = JsonConvert.SerializeObject(secondNewsTypeList);
}
}
context.Response.Write(result);
}
protected void ReaderNewsType(HttpContext context)
{
string result = string.Empty;
using(Entities db=new Entities ())
{
List<NewsType> newsTypeList = new List<NewsType>();
var query = db.NewsType.OrderByDescending(t => t.ID);
foreach (var item in query)
{
newsTypeList.Add(new NewsType()
{
CityID = item.CityID,
ID = item.ID,
Orders = item.Orders,
TypeName = item.TypeName,
Url = item.Url
});
result = "{\"data\":" + JsonConvert.SerializeObject(newsTypeList) + "}";
}
}
context.Response.Write(result);
}
protected void ReaderSecondNewsType(HttpContext context)
{
string result = string.Empty;
int typeID = context.Request.Params["newsTypeID"] == null ? 0 : int.Parse(context.Request.Params["newsTypeID"]);
using (Entities db = new Entities())
{
List<SecondNewsType> secondNewsTypeList = new List<SecondNewsType>();
var query = (from s in db.SecondNewsType where s.NewsTypeID == typeID select s).OrderByDescending(t => t.ID);
foreach (var item in query)
{
secondNewsTypeList.Add(new SecondNewsType()
{
ID = item.ID,
NewsTypeID = item.NewsTypeID,
TradeName = item.TradeName
});
result = "{\"data\":" + JsonConvert.SerializeObject(secondNewsTypeList) + "}";
}
}
context.Response.Write(result);
}
public bool IsReusable {
get
{
return false;
}
}
}
}
AreaOperate.ashx代碼如下:
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using Newtonsoft.Json;
namespace Ext.AjaxHandler
{
/// <summary>
/// AreaOperate 的摘要說明
/// </summary>
public class AreaOperate : IHttpHandler
{
public void ProcessRequest(HttpContext context)
{
context.Response.ContentType = "text/json";
string action = context.Request.Params["action"];
switch(action)
{
case "province":
ReadProvince(context);
break;
case "city":
ReadCity(context);
break;
case "region":
ReadRegion(context);
break;
case "read":
ReaderAreaIDByLevelID(context);
break;
case "readLevel":
ReadLevelIDByName(context);
break;
default:
ReadProvince(context);
break;
}
}
protected void ReaderAreaIDByLevelID(HttpContext context)
{
string result = string.Empty;
string levelID = context.Request.Params["levelID"];
using (Entities db = new Entities())
{
List<Aera> areaLists = new List<Aera>();
var query = from a in db.Aera
where a.LevelID == levelID
select a;
foreach (var item in query)
{
areaLists.Add(new Aera()
{
AreaID = item.AreaID,
AreaName = item.AreaName,
gps_L = item.gps_L,
gps_W = item.gps_W,
LevelID = item.LevelID
});
}
result = JsonConvert.SerializeObject(areaLists);
}
context.Response.Write(result);
}
protected void ReadProvince(HttpContext context)
{
string result = string.Empty;
using (Entities db = new Entities())
{
List<Aera> areaLists = new List<Aera>();
var query = from a in db.Aera
where a.LevelID.Length == 3
select a;
foreach (var item in query)
{
areaLists.Add(new Aera()
{
AreaID = item.AreaID,
AreaName = item.AreaName,
gps_L = item.gps_L,
gps_W = item.gps_W,
LevelID = item.LevelID
});
}
result = "{\"data\":" + JsonConvert.SerializeObject(areaLists) + " }";
}
context.Response.Write(result);
}
protected void ReadCity(HttpContext context)
{
string levelID = context.Request.Params["levelID"];
string result = string.Empty;
using (Entities db = new Entities())
{
List<Aera> areaLists = new List<Aera>();
var query = from a in db.Aera
where a.LevelID.Length == 6 && a.LevelID.StartsWith(levelID)
select a;
foreach (var item in query)
{
areaLists.Add(new Aera()
{
AreaID = item.AreaID,
AreaName = item.AreaName,
gps_L = item.gps_L,
gps_W = item.gps_W,
LevelID = item.LevelID
});
}
result = "{\"data\":" + JsonConvert.SerializeObject(areaLists) + " }";
}
context.Response.Write(result);
}
protected void ReadRegion(HttpContext context)
{
string levelID = context.Request.Params["levelID"];
string result = string.Empty;
using (Entities db = new Entities())
{
List<Aera> areaLists = new List<Aera>();
var query = from a in db.Aera
where a.LevelID.Length ==9 && a.LevelID.StartsWith(levelID.Trim())
select a;
foreach (var item in query)
{
areaLists.Add(new Aera()
{
AreaID = item.AreaID,
AreaName = item.AreaName,
gps_L = item.gps_L,
gps_W = item.gps_W,
LevelID = item.LevelID
});
}
result = "{\"data\":" + JsonConvert.SerializeObject(areaLists) + " }";
}
context.Response.Write(result);
}
protected void ReadLevelIDByName(HttpContext context)
{
string AreaName = context.Request.Params["AreaName"];
string result = string.Empty;
using (Entities db = new Entities())
{
List<Aera> areaLists = new List<Aera>();
var query = from a in db.Aera
where a.AreaName==AreaName
select a;
foreach (var item in query)
{
areaLists.Add(new Aera()
{
AreaID = item.AreaID,
AreaName = item.AreaName,
gps_L = item.gps_L,
gps_W = item.gps_W,
LevelID = item.LevelID
});
}
result = JsonConvert.SerializeObject(areaLists);
}
context.Response.Write(result);
}
public bool IsReusable
{
get
{
return false;
}
}
}
}
newsOperate.ashx代碼如下:
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using Newtonsoft.Json;
namespace Ext.AjaxHandler
{
public class NewsView
{
public int ID { get; set; }
public string Title { get; set; }
public string Comment { get; set; }
public DateTime Addtime { get; set; }
public DateTime Upptime { get; set; }
public string Author { get; set; }
public string TradeName { get; set; }
public int isScrool { get; set; }
public int Count { get; set; }
public string UserName { get; set; }
public string AreaName { get; set; }
public int CityID { get; set; }
}
/// <summary>
/// newsOperate 的摘要說明
/// </summary>
public class newsOperate : IHttpHandler
{
public void ProcessRequest(HttpContext context)
{
context.Response.ContentType = "text/json";
//context.Response.Write("Hello World");
string action = context.Request.Params["action"];
switch(action)
{
case "load":
loadNews(context);
break;
case "search":
SearchNews(context);
break;
case "add":
AddNews(context);
break;
case "edit":
EditNews(context);
break;
case "del":
DeleteNews(context);
break;
default :
loadNews(context);
break;
}
}
protected void loadNews(HttpContext context)
{
int start = Convert.ToInt32(context.Request.Params["start"]); //起始第一頁
int limit = Convert.ToInt32(context.Request.Params["limit"]); //每頁顯示的記錄數
int pageNum = Convert.ToInt32(context.Request.Params["page"].ToString()); //當前頁
string result = string.Empty;
var total = 0;
using (Entities db = new Entities())
{
total = (from n in db.News
join s in db.SecondNewsType on n.TypeID equals s.ID
join u in db.Users on n.UserID equals u.ID
join a in db.Aera on n.CityID equals a.AreaID
select new
{
ID = n.ID,
Title = n.Title,
Comment = n.Comment,
Addtime = n.Addtime,
Upptime = n.Upptime,
Author = n.Author,
TradeName = s.TradeName,
isScrool = n.isScrool,
Count = n.Count,
Image = n.Image,
UserName = u.UserName,
AreaName = a.AreaName
}).OrderByDescending(n => n.ID).Count();
if((pageNum-1)*limit<total)
{
var query = (from n in db.News
join s in db.SecondNewsType on n.TypeID equals s.ID
join u in db.Users on n.UserID equals u.ID
join a in db.Aera on n.CityID equals a.AreaID
select new
{
ID = n.ID,
Title = n.Title,
Comment = n.Comment,
Addtime = n.Addtime,
Upptime = n.Upptime,
Author = n.Author,
TradeName = s.TradeName,
isScrool = n.isScrool,
Count = n.Count,
Image = n.Image,
UserName = u.UserName,
AreaName = a.AreaName,
CityID = a.AreaID
}).OrderByDescending(n => n.ID).Skip((pageNum - 1) * limit).Take(limit);
List<NewsView> newsList = new List<NewsView>();
foreach (var item in query)
{
newsList.Add(new NewsView()
{
Addtime = item.Addtime,
AreaName = item.AreaName,
Author = item.Author,
Comment = item.Comment,
Count = item.Count,
ID = item.ID,
isScrool = item.isScrool,
Title = item.Title,
TradeName = item.TradeName,
Upptime = item.Upptime,
UserName = item.UserName,
CityID = item.CityID
});
}
result = "{\"totalCount\":" + total + ",\"data\":" + JsonConvert.SerializeObject(newsList) + "}";
context.Response.Write(result);
}
}
}
protected void SearchNews(HttpContext context)
{
int start = Convert.ToInt32(context.Request.Params["start"]); //起始第一頁
int limit = Convert.ToInt32(context.Request.Params["limit"]); //每頁顯示的記錄數
int pageNum = context.Request.Params["page"] == null ? 1 : Convert.ToInt32(context.Request.Params["page"]); //當前頁
string result = string.Empty;
//獲取查詢參數
string title = context.Request.Params["Title"] == null ? " " : context.Request.Params["Title"];
string comment = context.Request.Params["Comment"] == null ? " " : context.Request.Params["Comment"];
var total = 0;
using (Entities db = new Entities())
{
total = (from n in db.News
where n.Title.Contains(title) && n.Comment.Contains(comment)
join s in db.SecondNewsType on n.TypeID equals s.ID
join u in db.Users on n.UserID equals u.ID
join a in db.Aera on n.CityID equals a.AreaID
select new
{
ID = n.ID,
Title = n.Title,
Comment = n.Comment,
Addtime = n.Addtime,
Upptime = n.Upptime,
Author = n.Author,
TradeName = s.TradeName,
isScrool = n.isScrool,
Count = n.Count,
Image = n.Image,
UserName = u.UserName,
AreaName = a.AreaName
}).OrderByDescending(n => n.ID).Count();
if ((pageNum - 1) * limit < total)
{
var query = (from n in db.News
where n.Title.Contains(title) && n.Comment.Contains(comment)
join s in db.SecondNewsType on n.TypeID equals s.ID
join u in db.Users on n.UserID equals u.ID
join a in db.Aera on n.CityID equals a.AreaID
select new
{
ID = n.ID,
Title = n.Title,
Comment = n.Comment,
Addtime = n.Addtime,
Upptime = n.Upptime,
Author = n.Author,
TradeName = s.TradeName,
isScrool = n.isScrool,
Count = n.Count,
Image = n.Image,
UserName = u.UserName,
AreaName = a.AreaName
}).OrderByDescending(n => n.ID).Skip((pageNum - 1) * limit).Take(limit);
List<NewsView> newsList = new List<NewsView>();
foreach (var item in query)
{
newsList.Add(new NewsView()
{
Addtime = item.Addtime,
AreaName = item.AreaName,
Author = item.Author,
Comment = item.Comment,
Count = item.Count,
ID = item.ID,
isScrool = item.isScrool,
Title = item.Title,
TradeName = item.TradeName,
Upptime = item.Upptime,
UserName = item.UserName
});
}
result = "{\"totalCount\":" + total + ",\"data\":" + JsonConvert.SerializeObject(newsList) + "}";
context.Response.Write(result);
}
}
}
protected void AddNews(HttpContext context)
{
string data = HttpUtility.UrlDecode(context.Request["data"]);
string result = string.Empty;
News news = JsonConvert.DeserializeObject<News>(data);
//string jsonData = JsonConvert.DeserializeObject(data).ToString();
using (Entities db = new Entities())
{
News addnews = new News()
{
Addtime = news.Addtime,
Author = news.Author,
CityID = news.CityID,
Comment = news.Comment,
Count = news.Count,
Image = news.Image,
isScrool = news.isScrool,
Title = news.Title,
TypeID = news.TypeID,
Upptime = news.Upptime,
UserID = news.UserID
};
db.News.Add(addnews);
int temp = db.SaveChanges();
result = "{ \"success\":true,\"data\":" + temp + " }";
}
context.Response.Write(result);
}
protected void EditNews(HttpContext context)
{
string data = HttpUtility.UrlDecode(context.Request["data"]);
string result = string.Empty;
News news = JsonConvert.DeserializeObject<News>(data);
using (Entities db = new Entities())
{
News editnews = db.News.FirstOrDefault(n => n.ID == news.ID);
editnews.Image = news.Image;
editnews.isScrool = news.isScrool;
editnews.Title = news.Title;
editnews.TypeID = news.TypeID;
editnews.Upptime = news.Upptime;
editnews.UserID = news.UserID;
editnews.Count = news.Count;
editnews.Comment = news.Comment;
editnews.CityID = news.CityID;
editnews.Author = news.Author;
editnews.Addtime = news.Addtime;
int temp = db.SaveChanges();
result = "{ \"success\":true,\"data\":" + temp + " }";
}
context.Response.Write(result);
}
protected void DeleteNews(HttpContext context)
{
int ID =int.Parse(HttpUtility.UrlDecode(context.Request["data"]));
string result = string.Empty;
// News news = JsonConvert.DeserializeObject<News>(data);
using (Entities db = new Entities())
{
News delnews = db.News.FirstOrDefault(n => n.ID == ID);
db.News.Remove(delnews);
int temp = db.SaveChanges();
result = "{ \"success\":true,\"data\":" + temp + " }";
}
context.Response.Write(result);
}
public bool IsReusable
{
get
{
return false;
}
}
}
}
頁面效果如下:
1、grid.Panel加載
2、搜索效果
3、添加
4、編輯頁面,其中comboBox加載時候自動綁定
5、查看