jQuery UI 提供了強大的前端功能,包括基於腳本和樣式表的日曆,拖放等等非常酷的特性,但是,這些都是基於 javascript 編程的,對於不太屬性這門語言的程序員來說,掌握 jQuery UI 還是有一定難度的。
今天,我要向大家介紹一個標準的 ASP.NET 控件庫 JuiceUI ,從這個地址 http://www.juiceui.com/ 你就可以下載到。
JuiceUI 是開源的 WebForms 控件集,你可以簡單地在 WebForm 項目中使用 jQuery UI 組件。現在,你也可以在 ASP.NET 項目中輕易地使用流行的 JavaScript 界面庫。
比如說,你希望在頁面中實現一個彈出式的日曆選擇器,下面的代碼就可以做到。
<asp:TextBox runat="server" ID="_Default" /> <Juice:Datepicker runat="server" TargetControlID="_Default" />拖個控件就可以了!
注意:必須先增加對於 ScriptManager 的使用。
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="JuiceUI_1.WebForm1" %> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <title></title> </head> <body> <form id="form1" runat="server"> <div> <asp:ScriptManager ID="ScriptManager1" runat="server"> </asp:ScriptManager> <asp:TextBox runat="server" ID="_Default" /> <juice:Datepicker runat="server" TargetControlID="_Default" /> </div> </form> </body> </html>甚至還提供了如下的控制:
page up/down
- 上月/次月ctrl+page up/down
- 上年/次年ctrl+home
- current month or open when closedctrl+left/right
- 昨天/明天ctrl+up/down
-上周/次周enter
- accept the selected datectrl+end
- close and erase the dateescape
- close the datepicker without selection
可以從工具箱中直接拖過來。
什麼?你希望在代碼中有更多的控制,沒有問題!你有大量的屬性可以用來進行設置,比如 DateFormat 就可以設置日期的格式。
如果你已經安裝了 NuGet, 直接使用這個命令就可以為你的項目增加這個支持。
Install-Package JuiceUI
注意:這個庫基於 jQuery 和 jQuery UI , 下面是其使用的版本:
jQuery 1.7.1
jQuery.UI.Combined 1.8.17
安裝之後,所有需要的文件都已經在你的項目中了,包括 jQuery。
包括腳本
在你的項目文件夾中,包括所有的文件。
沒有留言:
張貼留言