小男孩‘自慰网亚洲一区二区,亚洲一级在线播放毛片,亚洲中文字幕av每天更新,黄aⅴ永久免费无码,91成人午夜在线精品,色网站免费在线观看,亚洲欧洲wwwww在线观看

<nav id="gyngw"><optgroup id="gyngw"></optgroup></nav>

<center id="gyngw"><cite id="gyngw"><center id="gyngw"></center></cite></center>

<option id="gyngw"><blockquote id="gyngw"></blockquote></option>
<code id="gyngw"><option id="gyngw"></option></code>

搜索

分享

QQ空間 QQ好友新浪微博微信

超簡(jiǎn)單！80行代碼實(shí)現(xiàn)Google日歷（拖放、移動(dòng)、AJAX）

昵稱10504424 2013-11-18

展開全文

介紹

本實(shí)例介紹使用DayPilot Lite for ASP.NET MVC library 類來實(shí)現(xiàn)類google日歷效果。

在線實(shí)例

天視圖
星期視圖
拖放調(diào)整
拖放移動(dòng)

我們將使用80行代碼來實(shí)現(xiàn)ajax 添加備忘，拖放

首先準(zhǔn)備：
類庫:在你的項(xiàng)目中引入 DayPilot.Web.Mvc.dll
視圖: 使用 Html.DayPilotCalendar擴(kuò)展建立一個(gè)DayPilot Calendar
控制器: 建立一個(gè) MVC 控制器

1. DayPilot.Web.Mvc 類庫

下載 DayPilot Lite for ASP.NET MVC 包

在 Scripts 文件夾中復(fù)制 DayPilot JavaScript 到你的項(xiàng)目(Scripts/DayPilot):
daypilot-all.min.js

從bin目錄復(fù)制DayPilot.Web.Mvc.dll 到你的項(xiàng)目 (Bin).

添加 DayPilot.Web.Mvc.dll引用:

2. MVC 視圖(8行代碼)

建立一個(gè) ASP.NET MVC 視圖 (Views/Home/Index.cshtml):

@{ ViewBag.Title = "ASP.NET MVC Razor Event Calendar"; }

<h2>ASP.NET MVC Razor Event Calendar</h2>

添加 DayPilot JavaScript 類:

<script src="@Url.Content("~/Scripts/DayPilot/daypilot-all.min.js")" type="text/javascript"></script>

添加日歷初始化代碼

@Html.DayPilotCalendar("dpc", new DayPilotCalendarConfig

{

BackendUrl = Url.Content("~/Home/Backend"),

})

Note that the minimum required code is quite short. It only has to point to the backend MVC controller ("~/Home/Backend") that will supply the calendar event data using an AJAX call.

在配置中添加DayPilot.Web.Mvc 命名空間以支持Html.DayPilotCalendar:

<configuration>

<system.web.webPages.razor>

<pages pageBaseType="System.Web.Mvc.WebViewPage">

<namespaces>

...

<add namespace="DayPilot.Web.Mvc"/>

</namespaces>

</pages>

</system.web.webPages.razor></configuration>

完整代碼：

@{ ViewBag.Title = "ASP.NET MVC Razor Event Calendar"; }

<h2>ASP.NET MVC Razor Event Calendar</h2>

<script src="@Url.Content("~/Scripts/DayPilot/daypilot-all.min.js")" type="text/javascript"></script>

@Html.DayPilotCalendar("dpc", new DayPilotCalendarConfig

{

BackendUrl = Url.Content("~/Home/Backend"),

})

3. MVC 控制器(34 行代碼)

建立一個(gè) MVC 控制器(Controllers/HomeController.cs):

public class HomeController : Controller

{

public ActionResult Index()

{

return View();

}

}

為日歷添加一個(gè) handler 叫作/Home/Backend.

public ActionResult Backend()

{

return new Dpc().CallBack(this);

}

DayPilotCalendar:

class Dpc : DayPilotCalendar

{

protected override void OnInit(InitArgs e)

{

var db = new DataClasses1DataContext();

Events = from ev in db.events select ev;

DataIdField = "id";

DataTextField = "text";

DataStartField = "eventstart";

DataEndField = "eventend";

Update();

}

}

我們使用 linq to sql從一個(gè)sql數(shù)據(jù)庫取得數(shù)據(jù) (DataClasses1.dbml).

"events" 表結(jié)構(gòu)

DataIdField = "id";

DataTextField = "text";

DataStartField = "eventstart";

DataEndField = "eventend";

所有動(dòng)作將引發(fā) Update()

這里是日歷所有的控制器代碼：（使用ajax)

Collapse | Copy Code

using System;

using System.Linq;

using System.Web;

using System.Web.Mvc;

using DayPilot.Web.Mvc;

using DayPilot.Web.Mvc.Events.Calendar;

namespace DayPilotCalendarMvc3.Controllers

{

public class HomeController : Controller

{

public ActionResult Index()

{

return View();

}

public ActionResult Backend()

{

return new Dpc().CallBack(this);

}

class Dpc : DayPilotCalendar

{

protected override void OnInit(InitArgs e)

{

var db = new DataClasses1DataContext();

Events = from ev in db.events select ev;

DataIdField = "id";

DataTextField = "text";

DataStartField = "eventstart";

DataEndField = "eventend";

Update();

}

}

}

}

4. 添加AJAX拖放事件 (38行代碼)

為了支持拖放，我們需要添加以下代碼：

@Html.DayPilotCalendar("dpc", new DayPilotCalendarConfig

{

BackendUrl = Url.Content("~/Home/Backend"),

EventMoveHandling = DayPilot.Web.Mvc.Events.Calendar.EventMoveHandlingType.CallBack,

EventResizeHandling = DayPilot.Web.Mvc.Events.Calendar.EventResizeHandlingType.CallBack,

TimeRangeSelectedHandling = DayPilot.Web.Mvc.Events.Calendar.TimeRangeSelectedHandlingType.JavaScript,

TimeRangeSelectedJavaScript = "dpc.timeRangeSelectedCallBack(start,

end, null, { name: prompt('New Event Name:', 'New Event') });"

})

事件處理

using System;

using System.Linq;

using System.Web.Mvc;

using DayPilot.Web.Mvc;

using DayPilot.Web.Mvc.Enums;

using DayPilot.Web.Mvc.Events.Calendar;

namespace DayPilotCalendarMvc3.Controllers

{

public class HomeController : Controller

{

public ActionResult Index()

{

return View();

}

public ActionResult Backend()

{

return new Dpc().CallBack(this);

}

class Dpc : DayPilotCalendar

{

DataClasses1DataContext db = new DataClasses1DataContext();

protected override void OnInit(InitArgs e)

{

Update(CallBackUpdateType.Full);

}

protected override void OnEventResize(EventResizeArgs e)

{

var toBeResized = (from ev in db.Events where ev.id == Convert.ToInt32(e.Id) select ev).First();

toBeResized.eventstart = e.NewStart;

toBeResized.eventend = e.NewEnd;

db.SubmitChanges();

Update();

}

protected override void OnEventMove(EventMoveArgs e)

{

var toBeResized = (from ev in db.Events where ev.id == Convert.ToInt32(e.Id) select ev).First();

toBeResized.eventstart = e.NewStart;

toBeResized.eventend = e.NewEnd;

db.SubmitChanges();

Update();

}

protected override void OnTimeRangeSelected(TimeRangeSelectedArgs e)

{

var toBeCreated = new Event {eventstart = e.Start,

eventend = e.End, text = (string) e.Data["name"]};

db.Events.InsertOnSubmit(toBeCreated);

db.SubmitChanges();

Update();

}

protected override void OnFinish()

{

if (UpdateType == CallBackUpdateType.None)

{

return;

}

Events = from ev in db.Events select ev;

DataIdField = "id";

DataTextField = "text";

DataStartField = "eventstart";

DataEndField = "eventend";

}

}

}

}

5. 星期視圖 (+1行)

切換到日歷視圖非常簡(jiǎn)單

ViewType = DayPilot.Web.Mvc.Enums.Calendar.ViewType.Week,

@Html.DayPilotCalendar("dpc", new DayPilotCalendarConfig

{

BackendUrl = Url.Content("~/Home/Backend"),

ViewType = DayPilot.Web.Mvc.Enums.Calendar.ViewType.Week,

EventMoveHandling = DayPilot.Web.Mvc.Events.Calendar.EventMoveHandlingType.CallBack,

EventResizeHandling = DayPilot.Web.Mvc.Events.Calendar.EventResizeHandlingType.CallBack,

TimeRangeSelectedHandling = DayPilot.Web.Mvc.Events.Calendar.TimeRangeSelectedHandlingType.JavaScript,

TimeRangeSelectedJavaScript =

"dpc.timeRangeSelectedCallBack(start, end, null, { name: prompt('New Event Name:', 'New Event') });"

})

月視圖

翻譯自外網(wǎng)。

本站是提供個(gè)人知識(shí)管理的網(wǎng)絡(luò)存儲(chǔ)空間，所有內(nèi)容均由用戶發(fā)布，不代表本站觀點(diǎn)。請(qǐng)注意甄別內(nèi)容中的聯(lián)系方式、誘導(dǎo)購買等信息，謹(jǐn)防詐騙。如發(fā)現(xiàn)有害或侵權(quán)內(nèi)容，請(qǐng)點(diǎn)擊一鍵舉報(bào)。

轉(zhuǎn)藏 分享

QQ空間 QQ好友新浪微博微信

獻(xiàn)花（0） +1

來自：昵稱10504424 > 《工作》

舉報(bào)/認(rèn)領(lǐng)

0條評(píng)論

發(fā)表

請(qǐng)遵守用戶評(píng)論公約

類似文章 更多

昵稱10504424

關(guān)注對(duì)話

TA的最新館藏

Android
更好的逐幀動(dòng)畫函數(shù)
TypeScript Class(類)
C#軟件設(shè)計(jì)
java8特性深入解讀文章合集唐山貨運(yùn) 13930579202
建站技能get（1）

喜歡該文的人也喜歡更多

熱門閱讀換一換

<code id="i9kga"><menuitem id="i9kga"></menuitem></code>