ExtJS与.NET结合开发实例(Grid之批量删除篇)

上接ExtJS与.NET结合开发实例(Grid之数据显示、分页、排序篇)，在此基础上实现批量删除功能。
实现的步骤如下：
1. 用WebService实现删除的功能(上篇有一园友提出用WebService实现，这里顺便说一下，取数据源也可以用WebService，大家可以参考删除的WebService自行实现，我这里就不在累述了)
新建一WebService文件，命名为:DeleteProject.asmx
代码如下：

DeleteProject.asmx.cs
<!--<br /><br /> <br /><br /> Code highlighting produced by Actipro CodeHighlighter (freeware)<br /><br /> <a href="http://www.CodeHighlighter.com/" title="http://www.CodeHighlighter.com/">http://www.CodeHighlighter.com/</a><br /><br /> <br /><br /> -->1usingSystem;
2usingSystem.Data;
3usingSystem.Linq;
4usingSystem.Web;
5usingSystem.Collections;
6usingSystem.Web.Services;
7usingSystem.Web.Services.Protocols;
8usingSystem.ComponentModel;
9usingSystem.Xml.Linq;
10usingBusinessObject.Projects;//dbml文件的引用
11usingDatabase;
12namespaceWeb.Projects.OperProjects
13{
14/**////<summary>
15///SummarydescriptionforDeleteProject
16///</summary>
17[WebService(Namespace="http://tempuri.org/")]
18[WebServiceBinding(ConformsTo=WsiProfiles.BasicProfile1_1)]
19[ToolboxItem(false)]
20//ToallowthisWebServicetobecalledfromscript,usingASP.NETAJAX,uncommentthefollowingline.
21//[System.Web.Script.Services.ScriptService]
22publicclassDeleteProject:System.Web.Services.WebService
23{
24
25[WebMethod]
26publicboolDelProject(stringstrProjects)//这里需要返回删除是否成功给ExtJS调用
27{
28boolresult=false;
29try
30{
31ProjectBaseInfoDataContextdb=newProjectBaseInfoDataContext();
32varprojects=frompindb.PROJECT_BASE_INFOs
33wherestrProjects.IndexOf(p.PROJECT_NO)>0
34selectp;
35db.PROJECT_BASE_INFOs.DeleteAllOnSubmit(projects);
36result=true;
37}
38catch{
39result=false;
40}
41
42returnresult;
43}
44}
45}
46

2.让我们再回到第一篇里的GridForProjectLists.js文件里，在代码最后部分找到

id:'btnDel',
text:'批量删除',
tooltip:'删除',
iconCls:'remove',
handler:showDelDialog

修改handler:showDelDialog为hanlder:doDel
现在实现doDel这个function:

doDel
<!--<br /><br /> <br /><br /> Code highlighting produced by Actipro CodeHighlighter (freeware)<br /><br /> <a href="http://www.CodeHighlighter.com/" title="http://www.CodeHighlighter.com/">http://www.CodeHighlighter.com/</a><br /><br /> <br /><br /> -->1functiondoDel(){
2Ext.MessageBox.confirm('提示','确实要删除所选的记录吗?',showResult);
3}
4functionshowResult(btn){
5if(btn=='yes'){
6varrow=gdProjects.getSelections();
7varjsonData="";
8for(vari=0,len=row.length;i<len;i++){
9varss=row[i].get("PROJECT_NO");
10if(i==0)
11jsonData=jsonData+ss;//这样处理是为了删除的Lambda语句方便
12else
13jsonData=jsonData+","+ss;//这样处理是为了删除的Lambda语句方便
14}
15//alert(jsonData);
16varconn=newExt.data.Connection();
17conn.request({
18url:"../Projects/OperProjects/DeleteProject.asmx/DelProject", //请注意引用的路径
19params:{strProjects:jsonData},
20method:'post',
21scope:this,
22callback:function(options,success,response){
23if(success){
24Ext.MessageBox.alert("提示","所选记录成功删除！");
25ds.load({params:{start:0,limit:25}});
26}
27else
28{Ext.MessageBox.alert("提示","所选记录删除失败！");}
29}
30})
31}
32};

以上代码加在gdProjects定义之后即可。

实现效果如下：

至此已实现Grid的批量删除功能。
后记：
由于从VS2008 Beta2转到了RTM版(俺得跟着大家一起走呀)，原先的代码略有改动，主要体现在两处：
（1）Web.config文件中的
<add assembly="System.Data.DataSetExtensions, Version=3.5.0.0, Culture=neutral, PublicKeyToken=B77A5C561934E089"/>
版本号在beta里是2.0.0.0，现为3.5.0.0
(2)LINQ的变化,原先的删除使用RemoveAll+SubmitChange的方式，现在为DeleteAllOnSubmit