1 基本要点

　　1.1 Grid后台分页

　　1.2 Form表单提交

　　1.3 前台更新、删除(store.remove)、增加(store.insert)

　　1.4 有webService、aspx、Handler三种方法，此处使用Handler

　　1.5 使用Linq to SQL进行读取数据和 SQL储存过程的操作

　　1.6 文件结构

2 数据库文件

代码

3 建立Linq to SQL类

4 建立Json序列化的类库(JsonHelper.cs)

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;

using System.Web.Script.Serialization;//添加Json序列化的引用

namespace Service
{
publicstaticclass JsonHelper
{
publicstaticstring Jso_ToJSON(thisobject tem_obj)
{
JavaScriptSerializer tem_serializer =new JavaScriptSerializer();
return tem_serializer.Serialize(tem_obj);
}

publicstaticstring Jso_ToJSON(thisobject tem_obj, int tem_recursionDepth)
{
JavaScriptSerializer tem_serializer =new JavaScriptSerializer();
tem_serializer.RecursionLimit = tem_recursionDepth;
return tem_serializer.Serialize(tem_obj);
}
}
}

5 建立ashx文件，即使用handler传送

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;

using Service;

using System.Web.Services;
namespace ExtJs_ASP_Insert_Delete_Modify_Update
{
///<summary>
/// $codebehindclassname$ 的摘要说明
///</summary>
[WebService(Namespace ="http://tempuri.org/")]
[WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
publicclass Handler1 : IHttpHandler
{
private DataClasses1DataContext db=new DataClasses1DataContext();

publicvoid ProcessRequest(HttpContext context)
{
string tem_response =string.Empty;
string tem_str = context.Request.QueryString["parm"];
if (string.IsNullOrEmpty(tem_str))
{
context.Response.Write("error!");
return;
}

context.Response.ContentType ="text/json";

if (tem_str =="Get")
{
context.Response.Write(Get(context));
}
elseif (tem_str =="Insert")
{
context.Response.Write(Insert(context));
}
elseif (tem_str =="Update")
{
context.Response.Write(Update(context));
}
elseif (tem_str =="Delete")
{
context.Response.Write(Delete(context));
}

return;
}

publicstring Get(HttpContext context)
{
int tem_start =int.Parse(context.Request.Form["start"] +""); //分页需要limit,start是mysql里用的（或取当页开始的记录标识编号）
int tem_limit =int.Parse(context.Request.Form["limit"] +""); //或取每页记录数

var tem_query = from a in db.tb_user
from b in db.tb_score
where a.use_id == b.use_id
orderby a.use_id descending
select new { a.use_id, a.use_name, a.use_sex, a.use_address, b.sco_subject, b.sco_score };

int tem_Count = tem_query.Count(); //所要记录数
int tem_PageNum = tem_start / tem_limit; //共有页数
int tem_PageSize = tem_limit;
tem_query = tem_query.Skip(tem_PageSize * tem_PageNum).Take(tem_PageSize); //当前页记录

string JsonSource = JsonHelper.Jso_ToJSON(tem_query); //当前页记录转成JSON格式
string strJsonSource =@"{""totalCount"":"""+ tem_Count +"";
strJsonSource = strJsonSource +@""",""data"":"+ JsonSource +"}"; //Grid的分页区显示所有记录数增加totalCount信息
return strJsonSource;
}

publicstring Insert(HttpContext context)
{

string tem_out_message =null;
try
{
db.pro_Insert_values(int.Parse(context.Request.QueryString["use_id"]), context.Request.QueryString["use_name"].ToString(), context.Request.QueryString["use_sex"].ToString(),
context.Request.QueryString["use_address"].ToString(), context.Request.QueryString["sco_subject"].ToString(),short.Parse(context.Request.QueryString["sco_score"]), ref tem_out_message);
}
catch
{
tem_out_message ="-1";
}
if (tem_out_message =="1")
{
return"{success:true}";
}
elseif (tem_out_message =="-1")
{
return"{ success: false, errors:{info: '输入类型不匹配'} }";
}
else
{
return"{ success: false, errors:{info: '插入失败'} }";
}
}

publicstring Update(HttpContext context)
{

string tem_out_message=null;
try
{
db.pro_Update_values(int.Parse(context.Request.QueryString["use_id"]), context.Request.QueryString["use_name"].ToString(), context.Request.QueryString["use_sex"].ToString(),
context.Request.QueryString["use_address"].ToString(), context.Request.QueryString["sco_subject"].ToString(),short.Parse(context.Request.QueryString["sco_score"]), ref tem_out_message);
}
catch
{
tem_out_message ="-1";
}
if (tem_out_message=="1")
{
return"{success:true}";
}
elseif (tem_out_message =="-1")
{
return"{ success: false, errors:{info: '输入类型不匹配'} }";
}
else
{
return"{ success: false, errors:{info: '更新失败'} }";
}
}

publicstring Delete(HttpContext context)
{
string tem_out_message =null;
db.pro_Delete_values(int.Parse(context.Request.Form["use_id"]),ref tem_out_message);

if (tem_out_message =="1")
{
return"{success:true}";
}
else
{
return"{ success: false, errors:{info: '删除失败'} }";
}

}

publicbool IsReusable
{
get
{
returnfalse;
}
}
}
}

6 建立Gri_datagrid.js文件

var _start =0
var _limit =5

/**********/
/* 增加 */
/*********/
var formpanel_add =new Ext.FormPanel({
labelWidth: 75,
bodyStyle: 'padding: 10px',
baseCls: 'x-plain',
defauls: { width: 200 },
defaultType: 'textfield',
autoHeight: true,
items: [
{
fieldLabel: '用户帐户',
name: 'use_id',
blankText: '用户帐户不能为空!',
allowBlank: false,
regex: /^[1-9]\d*|0$/,
regexText: '必须为有效的整数!'
}, {
fieldLabel: '用户姓名',
name: 'use_name',
blankText: '用户姓名不能为空!',
maxLength: '10',
maxLengthText:'最大不超过10个字符',
allowBlank: false
}, {
xtype: "panel",
layout: "column",
baseCls: 'x-plain',
fieldLabel: '用户性别',
isFormField: true,
items: [{
columnWidth: .5,
xtype: "radio",
boxLabel: "男",
name: "use_sex",
inputValue: "男",
checked:true,
id: "boy"
}, {
columnWidth: .5,
xtype: "radio",
boxLabel: "女",
name: "use_sex",
inputValue: "女",
id: "girl"
}]
}, {
fieldLabel: '用户地址',
name: 'use_address',
blankText: '用户地址不能为空!',
maxLength: '25',
maxLength:'最大不超过25个字符!',
allowBlank: false
}, {
fieldLabel: '考试科目',
name: 'sco_subject',
blankText: '考试科目不能为空!',
maxLength: '25',
maxLength: '最大不超过25个字符!',
allowBlank: false
}, {
fieldLabel: '考试分数',
name: 'sco_score',
blankText: '考试分数不能为空!',
allowBlank: false,
regex: /^[1-9]\d*|0$/,
regexText:'必须为有效的整数!'
}
]
});

var TopicRecord = Ext.data.Record.create([
{ name: 'use_id', mapping: 'use_id' },
{ name: 'use_name', mapping: 'use_name' },
{ name: 'use_sex'},
{ name: 'use_address', mapping: 'use_address'},
{ name: 'sco_subject', mapping: 'sco_subject' },
{ name: 'sco_score', mapping: 'sco_score' }
]);

function submit() {
if (!formpanel_add.getForm().isValid()) return;
formpanel_add.getForm().submit({
waitMsg: '正在提交数据',
waitTitle: '提示',
url: 'Handler1.ashx?parm=Insert',
method: 'get',
success: function(form, action) {
var sex ="男";
if (Ext.getCmp("girl").checked ==true)
sex ="女";
var p =new TopicRecord({//创建一个记录源
use_id: formpanel_add.getForm().findField('use_id').getValue(),
use_name: formpanel_add.getForm().findField('use_name').getValue(),
use_sex: sex,
use_address: formpanel_add.getForm().findField('use_address').getValue(),
sco_subject: formpanel_add.getForm().findField('sco_subject').getValue(),
sco_score: formpanel_add.getForm().findField('sco_score').getValue()
});
store.insert(0, p);
Ext.Msg.alert('提示', '保存成功');

},
failure: function(form, action) {
Ext.Msg.alert('错误', '<font color=red>失败：'+ action.result.errors.info +'</font>');
}
});
}

/**********/
/* 更新 */
/*********/
var formpanel_page_edit =new Ext.FormPanel({
labelWidth: 75,
bodyStyle: 'padding: 10px',
baseCls: 'x-plain',
defauls: { width: 200 },
defaultType: 'textfield',
autoHeight: true,
items: [
{
fieldLabel: '<font color=blue>用户帐户</font>',
name: 'use_id',
blankText: '用户帐户不能为空!',
allowBlank: false,
regex: /^[1-9]\d*|0$/,
regexText: '必须为有效的整数!',
readOnly:true
}, {
fieldLabel: '用户姓名',
name: 'use_name',
blankText: '用户姓名不能为空!',
maxLength: '10',
maxLengthText:'最大不超过10个字符!',
allowBlank: false
}, {
xtype: "panel",
layout: "column",
baseCls: 'x-plain',
fieldLabel: '用户性别',
isFormField: true,
items: [{
columnWidth: .5,
xtype: "radio",
boxLabel: "男",
name: "use_sex",
inputValue: "男",
id:"_boy"
}, {
columnWidth: .5,
xtype: "radio",
boxLabel: "女",
name: "use_sex",
inputValue:"女",
id:"_girl"
}]
}, {
fieldLabel: '用户地址',
name: 'use_address',
blankText: '用户地址不能为空!',
maxLength: '25',
maxLengthText: '最大不超过25个字符!',
allowBlank: false
}, {
fieldLabel: '考试科目',
name: 'sco_subject',
blankText: '考试科目不能为空!',
maxLength: '25',
maxLengthText: '最大不超过25个字符!',
allowBlank: false
}, {
fieldLabel: '考试分数',
name: 'sco_score',
blankText: '考试分数不能为空!',
allowBlank: false,
regex: /^[1-9]\d*|0$/,
regexText: '必须为有效的整数!'
}
]
})

Ext.Msg.alert('提示', '保存成功');
},
failure: function(form, action) {
Ext.Msg.alert('错误', '<font color=red>失败：'+ action.result.errors.info +'</font>');
}
});
}

/**********/
/* 删除 */
/*********/
function showResult(btn) {
if (btn =='yes') {
Ext.Msg.wait("请等候", "删除中", "操作进行中......");
var row = Ext.getCmp("grid").getSelectionModel().getSelections();
var jsonData ="";
for (var i =0, len = row.length; i < len; i++) {
var ss = row[i].get("use_id");
if (i ==0)
jsonData = jsonData + ss; //这样处理是为了删除的Lambda语句方便
else
jsonData = jsonData +","+ ss; //这样处理是为了删除的Lambda语句方便
}
//alert(jsonData);
var conn =new Ext.data.Connection();
conn.request({
url: "Handler1.ashx?parm=Delete", //请注意引用的路径
params: { use_id: jsonData },
method: 'post',
scope: this,
callback: function(options, success, response) {
if (success) {
Ext.MessageBox.alert("提示", "所选记录成功删除！");
var row = Ext.getCmp("grid").getSelectionModel().getSelections();
store.remove(row);
}
else
{ Ext.MessageBox.alert("提示", "所选记录删除失败！"); }
}
})
}
};

Ext.onReady(function() {
Ext.QuickTips.init();
store =new Ext.data.JsonStore({
root: 'data',
totalProperty: 'totalCount',
url: 'Handler1.ashx?parm=Get',
fields: [
{ name: 'use_id', type: 'int' },
{ name: 'use_name' },
{ name: 'use_sex' },
{ name: 'use_address' },
{ name: 'sco_subject' },
{ name: 'sco_score' }
]
});
var grid =new Ext.grid.GridPanel({
frame: true,
title: '学生各科成绩表',
stripeRows: true, //斑马线
store: store,
id: 'grid',
applyTo: 'app_grid',
trackMouseOver: true,
height: 300,
width: 500,
loadMask: { msg: '正在加载数据，请稍侯……' },
viewConfig: {
forceFit: true
},
columns: [
new Ext.grid.RowNumberer(), //行号
new Ext.grid.CheckboxSelectionModel({ singleSelect: true }),
{ header: '<font size=2>用户帐户</font>', dataIndex: 'use_id', sortable: true },
{ header: '<font size=2>用户姓名</font>', dataIndex: 'use_name', sortable: true },
{ header: '<font size=2>用户性别</font>', dataIndex: 'use_sex', sortable: true },
{ header: '<font size=2>用户地址</font>', dataIndex: 'use_address', sortable: true },
{ header: '<font size=2>考试科目</font>', dataIndex: 'sco_subject', sortable: true },
{ header: '<font size=2>考试分数</font>', dataIndex: 'sco_score', sortable: true }
],
tbar: new Ext.Toolbar([
'-',
{
text: '<font size=2>增加数据</font>',
iconCls: 'add',
handler: function() {
window_add.show();
}
},
'-',
{
text: '<font size=2>删除数据</font>',
iconCls: 'delete',
handler: function() {
var s = grid.getSelectionModel().getSelections();
if (s.length ==0) {//判断有没有选中行
Ext.Msg.alert('提示', '你还没有选择要操作的记录!');
} elseif (s.length >1) {
Ext.Msg.alert('提示', '不能删除多个操作记录!');
} else {
Ext.MessageBox.confirm('提示', '您确认要删除当前记录吗?', showResult);
};
}
},
'-',
{
text: '<font size=2>更新数据</font>',
iconCls: 'page_edit',
handler: function() {
var s = grid.getSelectionModel().getSelections();
if (s.length ==0) {//判断有没有选中行
Ext.Msg.alert('提示', '你还没有选择要操作的记录!');
} elseif (s.length >1) {
Ext.Msg.alert('提示', '不能更新多个操作记录!');
} else {
window_page_edit.show();
};
}
},
'-'
]),
bbar: new Ext.PagingToolbar({//分页
pageSize: _limit,
store: store,
displayInfo: true, //非要为true，不然不会显示下面的分页按钮
displayMsg: '<font size=2>第 {0} 条到 {1} 条，一共 {2} 条记录</font>',
emptyMsg: "没有记录"
})
})
store.load({ params: { start: _start, limit: _limit} });
})

7 前台aspx文件

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Grid_Operating.aspx.cs"Inherits="ExtJs_ASP_Insert_Delete_Modify_Update._Default"%>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

8 运行结果

===========================================================================

9 总结

　　9.1 Linq to SQL序列化过程

　　9.2 储存过程创建有利于数据的传送和维护

/*********************/
/* 插入 */
/********************/

--drop PROCEDURE pro_Insert_values
CREATEPROCEDURE pro_Insert_values
@inp_use_idint,
@inp_use_namenvarchar(20),
@inp_use_sexnvarchar(2),
@inp_use_addressnvarchar(50),
@inp_sco_subjectnvarchar(20),
@inp_sco_scoresmallint,
@out_messagenvarchar(2) output
AS
BEGINTRAN
SET@out_message=''
BEGIN TRY
INSERTINTO tb_user VALUES(@inp_use_id,@inp_use_name,@inp_use_sex,@inp_use_address)
IF@@rowcount=0
SET@out_message='0'
INSERTINTO tb_score VALUES(@inp_use_id,@inp_sco_subject,@inp_sco_score)
IF@@rowcount=0
SET@out_message='0'
END TRY
BEGIN CATCH
SET@out_message='0'
END CATCH
IF@@ERROR<>0
ROLLBACKTRAN A
ELSE
if@out_message=''SET@out_message='1'
COMMITTRAN A
go

　　9.3 进行后台分页有利于数据加载和单位时间内数据传送的合理性(凑成Json的字符串进行数据传送)

　　9.4 用Linq to SQL调用SQL的储存过程更有利于程序的正常情况下的执行

publicstring Insert(HttpContext context)
{

　　9.5 相当资料帮助

　　中文：http://msdn.microsoft.com/zh-cn/library

　　英文：http://msdn.microsoft.com/en-us/library

10 下载

http://files.cnblogs.com/yongfeng/ExtJs_ASP_Insert_Delete_Modify_Update.rar

from: http://www.cnblogs.com/yongfeng/archive/2010/07/29/1787458.html

ExtJs、ASP.net运用Linq to SQL与SQL储存过程交互相关推荐

数据库操作 linq php,.NET_asp.net使用LINQ to SQL连接数据库及SQL操作语句用法分析，本文实例讲述了asp.net使用LINQ t - phpStudy...
asp.net使用LINQ to SQL连接数据库及SQL操作语句用法分析本文实例讲述了asp.net使用LINQ to SQL连接数据库及SQL操作语句用法.分享给大家供大家参考,具体如下: LI ...
采用Opserver来监控你的ASP.NET项目系列(二、监控SQL Server与Asp.Net项目)
前言之前有过2篇关于如何监控ASP.NET core项目的文章,有兴趣的也可以看看. ASP.NET Core之跨平台的实时性能监控 ASP.NET Core之跨平台的实时性能监控(2.健康检查) ...
ASP.NET MVC+LINQ开发一个图书销售站点
园子里已经有很多人讲解了其理论知识,网上也有不少示例,但是很多示例都是Prieview1的,写这篇blog的目的是想用ASP.NET MVC+LINQ做一个示例项目,主要是为了演示ASP.NET MV ...
SQL注入——SQL注入漏洞利用（零）（值得收藏）
一.什么是SQL注入漏洞攻击者利用Web应用程序对用户输入验证上的疏忽,在输入的数据中包含对某些数据库系统有特殊意义的符号或命令,让攻击者有机会直接对后台数据库系统下达指令,进而实现对后台数据库 ...
linux启动sql server数据库,SQL Server数据库启动过程详解及启动不起来的问题分析及解决方法...
第五步.启动系统数据库model model系统数据库同样也是SQL Server启动过程中用到的一个非常关键的数据库,如果这个库损坏,SQL Server启动也会失败,关于model数据不能启动的原 ...
oracle中的sql%rowcount,sql%found、sql%notfound、sql%rowcount和sql%isopen
Oracle 存储过程删除表记录时删除不存在的记录也是显示删除成功 create or replace procedure delDept(p_deptno in dept.deptno%type) ...
PL/SQL -- 动态SQL调用包中函数或过程
动态SQL主要是用于针对不同的条件或查询任务来生成不同的SQL语句.最常用的方法是直接使用EXECUTE IMMEDIATE来执行动态SQL语句字符串或字符串变量.但是对于系统自定义的包或用户自定的包 ...
PL/SQL -- 动态SQL
--==================== -- PL/SQL --> 动态SQL --==================== 使用动态SQL是在编写PL/SQL过程时经常使用的方法之一.很 ...
你所不知道的SQL Server数据库启动过程，以及启动不起来的各种问题的分析及解决技巧(转)...
目前SQL Server数据库作为微软一款优秀的RDBMS,其本身启动的时候是很少出问题的,我们在平时用的时候,很少关注起启动过程,或者很少了解其底层运行过程,大部分的过程只关注其内部的表.存储过程. ...

ExtJs、ASP.net运用Linq to SQL与SQL储存过程交互