Coolite Cool Study 3 MVC + Coolite 的实现代码

2019-12-14,,,,



因为默认的 MVC 的样式文件里对于的 table 和 其他相关样式(h1~h6) 与Coolite有冲突,会导致GridPanel走样,大家记得先把那个table 和  h1~h6的样式清除掉才看到GridPanel的帅脸面 …


项目文件分布:



关于Coolite在MVC中的配置文件跟一般webform是一样的。 但在MVC的Global.asax中,需要在 RegisterRoutes 方法里加上这一句:


routes.IgnoreRoute("{exclude}/{coolite}/coolite.axd");


另外 ScriptManager 要注明 IDMode="Static“:


<ext:ScriptManager ID="ScriptManager1" runat="server"  IDMode="Static"/>


其中唯一与一般MVC不同的是,我们需要定义自己的ActionResult来返回Json结果给客户端。因为Coolite 的JsonReader 要求的格式大致都是这样:{data: [{…}], totalCount: …}


关于JsonReader的一般用法:


<ext:JsonReader ReaderID="CustomerID" Root="data" TotalProperty="totalCount"> 


所以, 要继承MVC ActionResult 的抽象方法 public override void ExecuteResult(ControllerContext context)  来返回给 JsonReader   合适口味的 JsonResult , 不然它就不认人了。


以下代码实现了对Json Response & Save Response 的简单封装。

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
using Coolite.Ext.Web;

namespace CooliteMVC.Helper
{
public class AjaxStoreResult : ActionResult
{
public AjaxStoreResult() { }

public AjaxStoreResult(object data)
{
this.Data = data;
}

public AjaxStoreResult(object data, int totalCount)
: this(data)
{
this.TotalCount = totalCount;
}

public AjaxStoreResult(StoreResponseFormat responseFormat)
{
this.ResponseFormat = responseFormat;
}

private object data;
public object Data
{
get { return this.data; }
set { this.data = value; }
}

private int totalCount;
public int TotalCount
{
get { return this.totalCount; }
set { this.totalCount = value; }
}

private StoreResponseFormat responseFormat = StoreResponseFormat.Load;
public StoreResponseFormat ResponseFormat
{
get { return this.responseFormat; }
set { this.responseFormat = value; }
}

private SaveStoreResponse saveResponse;
public SaveStoreResponse SaveResponse
{
get
{
if (this.saveResponse == null)
{
this.saveResponse = new SaveStoreResponse();
}
return this.saveResponse;
}
}

public override void ExecuteResult(ControllerContext context)
{
switch (this.ResponseFormat)
{
case StoreResponseFormat.Load:

string json = Coolite.Ext.Web.JSON.Serialize(Data);
json = "{data:" + json + ", totalCount:" + 100 + "}";
context.HttpContext.Response.Write(json);

break;
case StoreResponseFormat.Save:
Response response = new Response(true);
response.Success = this.SaveResponse.Success;
response.Msg = this.SaveResponse.ErrorMessage;
StoreResponseData saveResponse = new StoreResponseData();
saveResponse.Confirmation = this.SaveResponse.ConfirmationList;
response.Data = saveResponse.ToString();

response.Write();
break;
default:
throw new ArgumentOutOfRangeException();
}
}

}

public enum StoreResponseFormat
{
Load,
Save
}

public class SaveStoreResponse
{
private bool success = true;
private string errorMessage;

public bool Success
{
get { return this.success; }
set { this.success = value; }
}

public string ErrorMessage
{
get { return this.errorMessage; }
set { this.errorMessage = value; }
}

public ConfirmationList ConfirmationList { get; set; }
}
}

.csharpcode, .csharpcode pre
{
font-size: small;
color: black;
font-family: consolas, "Courier New", courier, monospace;
background-color: #ffffff;
/*white-space: pre;*/
}
.csharpcode pre { margin: 0em; }
.csharpcode .rem { color: #008000; }
.csharpcode .kwrd { color: #0000ff; }
.csharpcode .str { color: #006080; }
.csharpcode .op { color: #0000c0; }
.csharpcode .preproc { color: #cc6633; }
.csharpcode .asp { background-color: #ffff00; }
.csharpcode .html { color: #800000; }
.csharpcode .attr { color: #ff0000; }
.csharpcode .alt
{
background-color: #f4f4f4;
width: 100%;
margin: 0em;
}
.csharpcode .lnum { color: #606060; }

AjaxStoreResult 在 CustomerController 中的使用:

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
using System.Web.Mvc.Ajax;
using CooliteMVC.Models;
using CooliteMVC.Helper;
using Coolite.Ext.Web;

namespace CooliteMVC.Controllers
{
public class CustomerController : Controller
{
//
// GET: /Customer/

public ActionResult Index()
{
ViewData["Title"] = "Customer List";
ViewData["Message"] = "Welcome to Coolite MVC! My name is Bruce.";
return View();
}

public ActionResult List(int limit, int start, string dir, string sort)
{
Random rand = new Random();
IList<Customer> list = new List<Customer>();
for (int i = start; i < start + limit; i++)
list.Add(new Customer
{
CustomerID = "Customer" + i,
Address = "Address" + i,
City = "City" + rand.Next(1000),
CompanyName = "Com" + rand.Next(1000),
ContactName = "Contract" + rand.Next(1000),
ContactTitle = "Title" + rand.Next(1000),
Country = "Country" + rand.Next(1000),
Email = rand.Next(1000) + "@live.com",
Fax = rand.Next(1000).ToString() + rand.Next(1000),
Mobile = rand.Next(1000).ToString() + rand.Next(1000),
Notes = "Notes" + rand.Next(1000),
Phone = "Phone" + rand.Next(1000),
Region = "Region" + rand.Next(1000),
TranDate = DateTime.Now.AddDays(rand.Next(30))
});
return new AjaxStoreResult(list, 100);
}

public ActionResult Save()
{
AjaxStoreResult ajaxStoreResult = new AjaxStoreResult(StoreResponseFormat.Save);
try
{
StoreDataHandler dataHandler = new StoreDataHandler(Request["data"]);
ChangeRecords<Customer> data = dataHandler.ObjectData<Customer>();

foreach (Customer customer in data.Deleted)
{
//db.Customers.Attach(customer);
//db.Customers.DeleteOnSubmit(customer);
}
foreach (Customer customer in data.Updated)
{
//db.Customers.Attach(customer);
//db.Refresh(RefreshMode.KeepCurrentValues, customer);
}
foreach (Customer customer in data.Created)
{
//db.Customers.InsertOnSubmit(customer);
}
}
catch (Exception e)
{
ajaxStoreResult.SaveResponse.Success = false;
ajaxStoreResult.SaveResponse.ErrorMessage = e.Message;
}
return ajaxStoreResult;
}

}
}

.csharpcode, .csharpcode pre
{
font-size: small;
color: black;
font-family: consolas, "Courier New", courier, monospace;
background-color: #ffffff;
/*white-space: pre;*/
}
.csharpcode pre { margin: 0em; }
.csharpcode .rem { color: #008000; }
.csharpcode .kwrd { color: #0000ff; }
.csharpcode .str { color: #006080; }
.csharpcode .op { color: #0000c0; }
.csharpcode .preproc { color: #cc6633; }
.csharpcode .asp { background-color: #ffff00; }
.csharpcode .html { color: #800000; }
.csharpcode .attr { color: #ff0000; }
.csharpcode .alt
{
background-color: #f4f4f4;
width: 100%;
margin: 0em;
}
.csharpcode .lnum { color: #606060; }

页面的关键代码:

   <ext:Store ID="dsCustomers" runat="server" >
<Proxy>
<ext:HttpProxy Url="/Customer/List" Method ="GET" />
</Proxy>
<UpdateProxy>
<ext:HttpWriteProxy Url="/Customer/Save" />
</UpdateProxy>
<Reader>
<ext:JsonReader ReaderID="CustomerID" Root="data" TotalProperty="totalCount">
<Fields>
<ext:RecordField Name="CustomerID" SortDir="ASC" />
<ext:RecordField Name="CompanyName" />
<ext:RecordField Name="ContactName" />
<ext:RecordField Name="Email" />
<ext:RecordField Name="Phone" />
<ext:RecordField Name="Fax" />
<ext:RecordField Name="Region" />
<ext:RecordField Name="TranDate" Type="Date" />
</Fields>
</ext:JsonReader>
</Reader>
<BaseParams>
<ext:Parameter Name="limit" Value="15" Mode="Raw" />
<ext:Parameter Name="start" Value="0" Mode="Raw" />
<ext:Parameter Name="dir" Value="ASC" />
<ext:Parameter Name="sort" Value="CustomerID" />
</BaseParams>
<SortInfo Field="CustomerID" Direction="ASC" />
</ext:Store>
我们可以看到其实就是Url的写法不同而已:
 <ext:HttpProxy Url="/Customer/List" Method ="GET" />
 <ext:HttpWriteProxy Url="/Customer/Save" /> 
详细页面代码跟第一章差不多,这里不列出来。 

《Coolite Cool Study 3 MVC + Coolite 的实现代码.doc》

下载本文的Word格式文档,以方便收藏与打印。