允許乙個網際網路瀏覽器向乙個遠端頁面/服務作非同步的http呼叫,並且用收到的結果更新乙個當前web頁面而不必重新整理整個頁面。
atlas快速入門之實戰atlas
出處:天極開發
摘要:允許乙個網際網路瀏覽器向乙個遠端頁面/服務作非同步的http呼叫,並且用收到的結果更新乙個當前web頁面而不必重新整理整個頁面。
正文:
接下來,我們看下如何在這個日曆控制項中使用ajax技術。在.net 的日曆控制項中,人們經常抱怨的是,每次選定日曆上的乙個日期,都會引發一次postback頁面回傳,需要使用者等待,十分不方便。下面,我們通過atals控制項,來對日曆控制項進行改造。
在default.aspx頁中,切換到**檢視,在之前的<atlas:scriptmanager>控制項中,加入enablepartialrendering屬性,以使得atlas可以對頁面進行區域性更新,如下所示
<atlas:scriptmanager id="scriptmanager1" runat="server"
enablepartialrendering="true" />
再增加乙個<updatepanel>控制項,updatepanel是atlas中乙個很重要的控制項,功能強大容易使用,可以只做很小的改動就可以向已有的asp.net站點新增ajax功能,我們再將日曆控制項拖拉放到updatepanel控制項中去,其中要注意到,日曆控制項是放到<contenttemplate>的標籤內的,該標籤內放的就是受updatepanel控制的控制項,如下**所示:
<atlas:updatepanel id="id1" runat="server">
<contenttemplate>
<asp:calendar id="calendar1" runat="server"
backcolor="#ffffcc" ... />
</asp:calendar>
</contenttemplate>
</atlas:updatepanel>
為了更好地看到效果,我們增加兩個下拉選擇框,可以讓使用者選擇年份和月份,**如下所示
<form id="form1" runat="server">
<atlas:scriptmanager id="scriptmanager1" runat="server"
enablepartialrendering="true" />
<asp:dropdownlist id="dropdownlist1" runat="server"
autopostback="true">
<asp:listitem value="1">jan</asp:listitem>
<asp:listitem value="2">feb</asp:listitem>
<asp:listitem value="3">mar</asp:listitem>
<asp:listitem value="4">apr</asp:listitem>
<asp:listitem value="5">may</asp:listitem>
<asp:listitem value="6">jun</asp:listitem>
<asp:listitem value="7">jul</asp:listitem>
<asp:listitem value="8">aug</asp:listitem>
<asp:listitem value="9">sep</asp:listitem>
<asp:listitem value="10">oct</asp:listitem>
<asp:listitem value="11">nov</asp:listitem>
<asp:listitem value="12">dec</asp:listitem>
</asp:dropdownlist>
year
<asp:dropdownlist id="dropdownlist2" runat="server"
autopostback="true">
<asp:listitem>2005</asp:listitem>
<asp:listitem>2006</asp:listitem>
<asp:listitem>2007</asp:listitem>
</asp:dropdownlist><br />
然後在code-behind的**中,寫入如下**:
protected sub dropdownlist1_selectedindexchanged( _
byval sender as object, _
byval e as system.eventargs) _
handles dropdownlist1.selectedindexchanged
with calendar1
.visibledate = new date( _
dropdownlist2.selectedvalue, _
dropdownlist1.selectedvalue, 1)
end with
end sub
protected sub dropdownlist2_selectedindexchanged( _
byval sender as object, _
byval e as system.eventargs) _
handles dropdownlist2.selectedindexchanged
with calendar1
.visibledate = new date( _
dropdownlist2.selectedvalue, _
dropdownlist1.selectedvalue, 1)
end with
end sub
在上面的**中,分別為月份和年份的下拉選擇框的selectedindexchanged事件寫入了**,主要是控制當使用者選擇了月份和年份時,日曆控制項中顯示相應的日期。但當我們f5執行時,會發覺頁面依然會引起postback重新整理的。因此,我們要定義觸發器triggers。
所謂的觸發器,指定了發生動作的事件源,updatepanel提供兩種引發非同步postback的trigger ,分別是controleventtrigger和controleventtrigger。其中controleventtrigge是指當某個控制項的某個指定的屬性變化時更新,而controleventtrigger是指當指定的事件發生時進行更新。則我們修改**如下:
<atlas:updatepanel id="id1" runat="server">
<contenttemplate>
<asp:calendar id="calendar1" runat="server"
backcolor="#ffffcc" ... />
</asp:calendar>
</contenttemplate>
<triggers>
<atlas:controlvaluetrigger controlid="dropdownlist1"
propertyname="selectedvalue" />
<atlas:controleventtrigger controlid="dropdownlist2"
eventname="selectedindexchanged" />
</triggers>
</atlas:updatepanel>
這裡,分別指定了月份下拉框的屬性觸發器和年份下拉框的事件觸發器,使得無論當使用者選擇哪乙個下拉框時,都會引發區域性的重新整理,而這些重新整理全部都通過updatepanel控制項來封裝進行處理了。所以當執行程式時,頁面不會象以前那樣要進行一次postback和整體頁面的重新整理。
最後,我們再在日曆控制項下面,增加乙個進度狀態條控制項updateprogress,用來向使用者反映當前的進度,**如下所示
<atlas:updateprogress id="pro" runat="server">
<progresstemplate>
<asp:label id="label1" runat="server" text="label">
updating calendar...
</asp:label>
</progresstemplate>
</atlas:updateprogress>
要注意的是,上面我們在進度狀態控制項的<progresstemplate>中,我們只是簡單加入了乙個標籤控制項,如果有實際需要的話,我們是可以加入
的。 到此,我們的程式大功告成了,執行這個日曆程式,選擇月份和年份下拉框,會看到日曆控制項沒有象以前那樣引起整個頁面的重新整理,而是很快在日曆控制項中顯示出相應的日期。
預科階段 快速實戰入門
artificial inteligence 英文縮寫為ai,它是研究,開發用於模擬,延伸和擴充套件人的智慧型的理論,方法,技術及應用系統的一門新的技術科學,人工智慧是電腦科學的乙個分支,它企圖了解智慧型的實質並生產出一種新的能以人類智慧型相似的方式做出反應的智慧型機器,未來人工智慧帶來的科技產品,...
人工智障也刷題!Kaggle 入門之實戰鐵達尼號
在 data 下我們會看到官方給的 train.csv 和 test.csv 兩個檔案,分別是訓練和測試資料。我們可以使用 virtualenv 來建立乙個 隔離 的 python 應用環境 虛擬環境 在這裡,你不需要考慮系統原有庫的版本,只需要 pip 來管理你需要用到的一切。import pan...
JEECG快速深度學習 入門到精通實戰
為了活躍社群,降低jeecg學習成本,社群特意開展jeecg深入培訓 開源精神,非盈利,學成可退學費 一 課程簡介 jeecg入門到精通培訓班,10堂課,結業後完成社群任務可退學費 二 學習模式 三 開課時間 四 課程表 第一節 jeecg開發環境的搭建,平台功能介紹 第二節 生成器使用講解 第三節...