Az elmúlt két hét történései + a szeptemberi kilátások

Nyárvégi szép jó estét kívánok minden kedves blog olvasónak!

Az elmúlt két hétben nyaralás fedőnév alatt részt vettem egy titkos akcióban, mely alatt újból felfedeztük a családommal Magyarország, illetve Szlovákia néhány rég elfeledett várának romjait.  Emiatt szünetelt a blogolásom, de most megpróbálom néhány mondatban összefoglalni az elmúlt két hét legfontosabb  .NET-es történéseit, illetve néhány szeptemberi MS akcióról is le fogom rántani a leplet.

Augusztus 6.-án a Microsoft kiadta végre az SQL Server 2008 végleges verzióját, egyből 7 változatban (tiszta Vista feeling)!  Szerencsére továbbra is megmaradt az Express edition, így az otthon fejlesztők is élvezhetik az SQL Server által nyújtott szolgáltatások nagy részét.  Hogy mik is ezek a szolgáltatások pontosan azt még felsorolni is nehéz lenne, de az egyszer biztos, hogy legalább olyan ütősek, mint annó az IIS7 új szolgáltatásai voltak.
Szerencsémre szeptemberben részt vehetek majd egy SQL Server 2008 gyorstalpaló tanfolyamon, és amennyiben sikeresen levizsgázok belőle, akkor abban az esetben, mint IT-s előadó is viszont láthattok majd engem a MIC laborban

De kanyarodjunk is vissza a fejlesztők világához!
A .NET Team még az nap válaszolt az SQL Server 2008 bejelentésére, és feldobták az MSDC-re a Visual Studio 2008 SP1, illetve a .NET Framework 3.5 SP1 végleges verzióját.

VS08 SP1 (831mb): http://www.microsoft.com/downloads/details.aspx?FamilyID=27673c47-b3b5-4c67-bd99-84e525b5ce61&DisplayLang=en
.NET 3.5 SP1 (231mb): http://download.microsoft.com/download/2/0/e/20e90413-712f-438c-988e-fdaa79a8ac3d/dotnetfx35.exe

Ebbe a javító csomagba nem csak hibajavítások kerültek bele, hanem csomó új alrendszer, pl.:, ADO.NET Entity Framework, ADO.NET Data Services, ASP.NET MVC, stb..Ezekről bővebb információt Balássy Gyuri blogjában találhattok:
http://msdnkk.hu/Article.aspx?Id=3a6e4339-6668-dd11-a452-005056c00008,

vagy pedig a .NET Framework 3.5 SP1-hez kiadott Enhancements Training Kit csomagban, amelyet innen tölthettek le:
http://www.microsoft.com/downloads/details.aspx?FamilyID=355c80e9-fde0-4812-98b5-8a03f5874e96&displaylang=en

Ez a csomag tartalmaz egy jó pár diát, hands on lab-et, illetve demo alkalmazást! (A prezik szerintem teljesen feleslegesek, ugyanis a lényeges dolgokat a DEMO dia alatt mutatták be, a többi dia csak tartalomjegyzék…)

Természetesen a Silverlight csapat is frissítette a Silverlight Tools Beta 2 for Visual Studio 2008 programocskáját, amely az alábbi „szokásos” címről tölthető le:
http://www.microsoft.com/downloads/details.aspx?FamilyId=50A9EC01-267B-4521-B7D7-C0DBA8866434&displaylang=en

Visszatérve az sp-kez, a szerviz csomagok telepítése nagyon fel tudja bosszantani az embert, ugyanis baromi sokáig tart és rohadtul nem lehet tudni, hogy éppen mit csinál vagy hol tart a telepítő (a progressbar teljesen függetlenül müködik a telepítéstől!!!). De a kedvencem a telepítőkben az, hogy  a DOS-os világból ismert „dolgozok logó” (|/–\) ismét hódít. Íme egy kép a hitetleneknek (Installing sorban jobb oldalt):

Tehát azoknak, aki még nem telepítették fel ezeket az új javító csomagokat azt ajánlom, hogy vagy a Star Wars összes részét töltsék le előtte, hogy ne unatkozzanak, vagy vegyék le a könyves polcról a Gyűrűk Ura mindhárom kötetét.  Nekem egy délutánom ráment arra, hogy újrapakoljam a Vistát, illetve a VS08-at, majd utána feltegyem az SP-ket. De ez van, sprite…

És jöjjön most, aminek jönnie kell, vagyis az MS beújít legújabb epizódja. Főszerepben: Devportal. Bátorfi Zsolt vezénylésével július eleje óta már béta állapotban üzemel a Devportal új verziója, amely valójában egy Community Server 2008. Várhatóan szeptember 5.-én indul el világhódító útjára, és magába fogja olvasztani az msportal-t is!!! Néhány háttér információt még találhattok róla Zsolt blogjában, vagyis alábbi címen:
http://batorfizsolt.spaces.live.com/Blog/cns!78E216F5ABAE195D!1171.entry

Ja és persze a legfontosabb: jelenleg ezen a címen érhető el:
http://beta.devportal.hu/

Én a portálon, mint ASP.NET, illetve Silverlight szakértő leszek jelen. Ezzel kapcsolatban jut eszembe, hogy mostanság azon fogok dolgozgatni, hogy a Silverlight tanfolyamon leadott anyagokat kicsit kibővítsem, szépítgessem, kommentezgessem, vagyis publikálható formába próbálom őket hozni.
A demo alkalmazásokat is elkezdtem nem rég kibővítgetni, így remélhetőleg egy egész jó kis induló csomag fog összeállni a végén. (A demok egy része nem ugyanaz lesz, mint amiket a tanfolyamon bemutattam, hanem azoknál sokkal gazdagabb tartalmúak lesznek!  /saját vállveregetés kipipálva /)

Hát egyelőre ennyi a nagy harci helyzet, remélem sikerült valami hasznos információval is szolgálnom! Legközelebb már a „nagy” SL csomagommal fogok jelentkezni!

AJAX Control Toolkit XXIV. – PopupControl II.

AJAX Control Toolkit –
PopupControl II.

 

Ez egy példaalkalmazáshoz tartozó leírás! Az alkalmazás erről a címről tölthető el:
http://devportal.hu/Portal/Detailed.aspx?NewsId=66d33f35-c16b-4830-b0a1-223b1bc0b69a vagy

http://cid-8dcaf3b0da4fb828.skydrive.live.com/embedrowdetail.aspx/ACTsorozat/ACT|_XXIV|_PopupControl|_II.zip

 

Itt is vagyunk a cikk második felével, amelyben tovább boncolgatjuk a PopupControlExtender által nyújtott szolgáltatásokat!

 

PCE használata

 

A kicsit bonyolultabb példa

Dinamikus tartalomgenerálásra általában akkor van szükségünk, ha adatbázisokkal vagy egyéb más szöveges erőforrásokkal dolgozunk. Ezért most egy Master-Details kapcsolatot bemutató példát fogunk elkészíteni egyetlen GridView vezérlő segítségével!
Az adatbázisunk most is a jó öreg Northwind lesz. Alapban a GridView-ban a Products táblából jelenítünk meg néhány mezőt. Majd a PCE segítségével aszinkron módon lekérdezzük az egyes termékek CategoryId-jához tartozó kategória nevét a Categories táblából. (Természetesen ennél sokkal több és értelmesebb adatot is lekérdezhetnénk, de ez csak egy demo alkalmazás, ezért nem is kell benne értelmet keresni ).

 

Tehát, először húzzunk a formunkra egy GridView-t, majd hozzunk hozzá létre egy új SqlDataSource-t, amely segítségével lekérdezünk néhány mezőt a Products táblából (a CategoryId oszlop legyen mindenféleképpen köztük!)! Most valahol itt kell tartanunk kód ügyileg:

 

<asp:GridView ID="GridView1" runat="server" AllowPaging="True" AutoGenerateColumns="False" DataKeyNames="ProductID" DataSourceID="SqlDataSource1">
    <Columns>
        <asp:BoundField DataField="ProductID" HeaderText="ProductID" InsertVisible="False" ReadOnly="True" SortExpression="ProductID" />
        <asp:BoundField DataField="ProductName" HeaderText="ProductName" SortExpression="ProductName" />
        <asp:BoundField DataField="CategoryID" HeaderText="CategoryID" SortExpression="CategoryID" />
        <asp:BoundField DataField="UnitPrice" HeaderText="UnitPrice" SortExpression="UnitPrice" />
        <asp:BoundField DataField="UnitsInStock" HeaderText="UnitsInStock" SortExpression="UnitsInStock" />
    </Columns>
</asp:GridView>
<asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString="<%$ ConnectionStrings:NorthwindConnectionString %>"
    SelectCommand="SELECT [ProductID], [ProductName], [CategoryID], [UnitPrice], [UnitsInStock] FROM [Products]">
</asp:SqlDataSource>

 

Ezek után a CategoryId oszlop mellé szúrjunk be egy TemplateField-et! Ennek az egyik legegyszerűbb módja, ha a GridView SmartTag-jében az Edit Columns… linkre kattintunk!

A felpattanó ablakban először adjunk egy TemplateField-et a Selected fields-nél lévő BoundField-ekhez, majd állítsuk be a HeaderText-jét CategoryName-re. Végül pedig az új mezőt vigyük feljebb a Selected Fields listában úgy, hogy a CategoryId alá kerüljön!

Ebbe a TemplateField-be ezek után úgy tudjuk a legegyszerűbben elhelyezni az új vezérlőket, hogy ismét elnavigálunk a GridView SmartTag-jéhez és itt legalul az Edit Templates linkre kattintunk!  Ilyenkor a GW átvált szerkesztő üzemmódba, és ekkor tudjuk a mező ItemTemplate-jét módosítgatni. Húzzunk ide be egy Image vezérlőt, egy PCE-t, illetve egy Panel vezérlőt! Végül a PCE SmartTag-jében kattintsunk az Add Dynamic Populate page method linkre!

Ilyenkor a Visual Studio elhelyez az oldalunk cs fájljában egy ilyen kódrészletet:

 

[System.Web.Services.WebMethodAttribute(), System.Web.Script.Services.ScriptMethodAttribute()]
public static string GetDynamicContent(string contextKey)
{
    return default(string);
}

 

Ez lesz az a webmetódus, amely előállítja majd a dinamikus tartalmat. (A függvény fölött elhelyezett attribútumok végéről természetesen nyugodtan elhagyható az Attribute() rész!) Ennek a függvénynek a megírásával kicsit később fogunk foglalkozni, ezért most térjünk vissza az aspx oldalunkra és fejezzük be a sablon szerkesztését (SmartTag >> End Template Editing)! Váltsunk át kódnézetbe és módosítsuk át a PopupControlExtender1 vezérlőnk markup-ját az alábbira:

 

<ajaxToolkit:PopupControlExtender ID="PopupControlExtender1" runat="server" TargetControlID="Image1" PopupControlID="Panel1" Position="Center" DynamicControlID="Panel1" DynamicServiceMethod="GetDynamicContent">
    <Animations>
        <OnShow>
            <Sequence>
                <HideAction Visible="true" />
                <FadeIn duration="1" Fps="25"/>
            </Sequence>
        </OnShow>
        <OnHide>
            <Sequence>
                <FadeOut duration="1" Fps="25" />
                <HideAction Visible="false" />
            </Sequence>
        </OnHide>
    </Animations>
</ajaxToolkit:PopupControlExtender>

 

A DynamicServiceMethod tulajdonságon keresztül adjuk meg a dinamikus tartalmat generáló webmetódus nevét. Ha ez nem az aspx vagy az aspx.cs oldalon található, akkor értelemszerűen meg kell adnunk a DynamicServicePath tulajdonságot is!
A DynamicControlID annak a vezérlőnek az azonosítóját tartalmazza, amelybe publikálni szeretnénk a dinamikus tartalmat. Két dolgot fontos róla megjegyezni! Az első, hogy ezt a tulajdonságot mindig be kell állítanunk, ha nem statikus content-tel akarunk dolgozni, vagyis ha beállítjuk a DynamicServiceMethod-ot, akkor ezt is be kell állítani! A másik fontos dolog, hogy az ennél a tulajdonságnál beállított azonosítónak nem feltétlenül kell megegyeznie a PopupControlId-nál beállítottal, vagyis akár más panel-t is feltölthetünk dinamikus tartalommal, nem csak a popup ablakot!

 

Oké, ha ezzel megvagyunk, akkor térjünk vissza a dinamikus tartalmat generáló függvényhez!
Mivel a GetDynamicContent metódus egy webmetódus, ezért szinte semmilyen információt nem tudunk belőle direkt módon elérni a GridView-ról. Ezért azt kell csinálnunk, hogy a contextKey paraméteren keresztül át kell passzolnunk neki mondjuk a CategoryId értékét!
Ennek a megvalósítása rendkívül egyszerűen történik, ugyanis a PCE-t az ItemTemplate-n belül helyeztük el, és emellett még adatköthető is a vezérlő, ezért annyi dolgunk van összesen, hogy a DynamicContextKey tulajdonságát adatkössük.  Vagyis az alábbi kódrészlettel kell kiegészíteni a PCE markup-ját:

 

DynamicContextKey='<%# Eval("CategoryID") %>’

 

Már csak az a feladatunk, hogy megírjuk a GetDynamicContent webmetódust. Íme az implementációja:

 

using System.Web.Configuration;
using System.Data.SqlClient;
…

string connstring = WebConfigurationManager.ConnectionStrings["NorthwindConnectionString"].ConnectionString;
string name = String.Empty;
using (SqlConnection conn = new SqlConnection(connstring))
{
    using (SqlCommand comm = conn.CreateCommand())
    {
        comm.CommandText = "SELECT CategoryName FROM [dbo].[Categories] WHERE CategoryID = @ID";
        comm.Parameters.Add("@ID", SqlDbType.Int);
        comm.Parameters["@ID"].Value = Int32.Parse(contextKey);

        conn.Open();
        name = comm.ExecuteScalar() as string;
        conn.Close();
    }
}
return name;

 

A kód szerintem eléggé egyértelmű, ezért csak annyi kiegészítést tennék hozzá, hogy ha több adatot is le akarunk kérdezni az adatbázisból, és táblázatos formában akarjuk majd őket megjeleníteni, akkor mindenféleképpen StringBuilder-t használjunk a dinamikus tartalom összekonkatenálásánál!

 

Futtassuk az alkalmazásunkat és valami hasonlót kell tapasztalnunk!

Végezzünk el még néhány apró design-beli módosítást, hogy ki is nézzen valahogy az egész!
– GridView-nak az AutoFormat-nál állítsuk be a Professional kinézetet!
– A Panel-nek állítsuk be az alábbi stílus osztályt:

.panel_style
{
    visibility: hidden;
    background-color: #5D7B9D;
    color: white;
    padding: 5px;
    text-align:center
}

–  Végül pedig a PCE-nek állítsuk be az OffsetY tulajdonságát 7-re, hogy a Position-nél megadott Center az tényleg középen is legyen!

 

Ha ezzel megvagyunk, akkor már mondhatjuk azt, hogy adtunk egy kicsit az UX-re is !

A dolog egyetlen szépséghibája az, hogy ha egyszer már megjelent a popup panel az adott sorban, akkor utána már csak nehezen tudunk még egyszer rákattintani ugyanerre a képre, ugyanis a panel layer-e továbbra is ott marad, csak nem látszik, és a kurzor is átvált text-re!
Erre egy félig jó megoldás az, hogy a Panel-t nem az ItemTemplate-n belül helyezzük el, hanem a GridView-n kívül. A panel továbbra is mindig jó helyen fog megjelenni a Postion tulajdonságnak köszönhetően, és így az előző hibát ki is küszöböltük, de kaptunk helyette egy másikat!  Ez a másik probléma pedig az, hogy ha akkor, amikor a popup ablak éppen látható, rákattintunk egy másik sorban lévő képre, akkor se a fadeout, se fadein nem fog lejátszódni, hanem helyettük vibrálni fog a panel! (Valamit valamiért alapon. )

 

PCE vs. FireFox
Hát igen, elérkeztünk a dolog kényes részéhez!  Sajnos azt kell, hogy mondjam, a PCE nem igazán támogatott Extender FireFox alatt. A probléma akkor kezdődik, amikor UpdatePanel-t is szeretnénk használni. Valamilyen okból kifolyólag a benne lévő vezérlők soha se váltanak ki postback-et. Magyarul megjelenik ugyan a popup ablak, illetve ha elveszíti a fókuszt a TargetControl, akkor el is tűnik a panel (de ez is csak akkor, ha a PCE-nél nem állítottunk be semmilyen animációt!), de postback valamiért soha se történik.
Próbálkoztam azzal, hátha csak az aszinkron trigger hiányzik neki, de azzal se ment, aztán megpróbáltam azt, hogy beszórtam az összes vezérlőt egy közös UpdatePanel-be, de az se volt jó, stb. Ezek után ellátogattam a hivatalos asp.net-es oldalra (természetesen mondanom se kell, hogy az általuk készített példaalkalmazások se működnek FF alatt ) és ott rátaláltam egy új Ajax Control Toolkit Tutorials sorozatra. Hírtelen nagyon megörültem, de sajnos itt se kaptam választ a kérdésemre, mert pont olyan példa van köztük a PCE-hez, ami nem használ UpdatePanel-t.
Visszatérve a sorozathoz, szóval június 4-én felkerült összesen 46 ilyen act-s tutorial az alábbi oldalra: http://www.asp.net/learn/ajax-control-toolkit/?lang=cs 
Nekem nem nyerte el a tetszésemet a sorozat, mert szerintem rosszul van felépítve az egész és a vezérlők feléhez nincs is leírás, de ez csak egy szubjektív vélemény, ettől még lehet jó és hasznos mások számára!

 

Összegezve a látottakat azt kell, hogy mondjam, a PCE egy jó kis extender mindaddig, amíg nem egy éles rendszerben szeretnénk használni! Ha esetleg valaki rájönne a fenti problémák valamelyikének a megoldására, kérem tudassa velem, mert nagyon kíváncsi lennék rá! Előre is köszönöm!

 

AJAX Control Toolkit XXIV. – PopupControl I. rész

AJAX Control Toolkit –
PopupControl I.

Ez egy példaalkalmazáshoz tartozó leírás! Az alkalmazás erről a címről tölthető el:
http://devportal.hu/Portal/Detailed.aspx?NewsId=6321b80b-7444-40c7-8c60-5c93d1b7705a vagy

http://cid-8dcaf3b0da4fb828.skydrive.live.com/embedrowdetail.aspx/ACTsorozat/ACT|_XXIV|_PopupControl|_I.zip

Ma a PopupControlExtender nevet viselő vezérlővel fogunk megismerkedni. Ez a cikk kicsit eltér a többitől, ugyanis két részletben fog felkerülni majd a teljes írás. 
 
PopupControlExtender alapok
A PCE vezérlő nagyon hasonlít a HoverMenuExtender-re, ugyanis mindkettőt ugyanarra a feladatra találták ki, vagyis egy popup panel megjelenítésére egy bizonyos esemény bekövetkezésekor. A különbség a kettő között ez a bizonyos esemény. A HME-nél a popup ablak akkor jelenik meg, ha az adott vezérlő fölé visszük az egerünket (vagyis az onhover esemény bekövetkezésekor). A PCE ezzel szemben csak akkor dobja fel a formra a popup panelt, amikor bele- vagy rákattintunk, vagy esetleg elkezdünk gépelni az adott vezérlőbe (tehát az onclick, onfocus, onkeydown események közül valamelyik meghívódásakor).
A popup ablakban bármilyen tartalmat elhelyezhetünk, akár még PostBack-et generáló ASP.NET-es vezérlőket is, de ilyenkor egy UpdatePanel-be kell őket becsomagolnunk, hogy aszinkron módon történjen a postback-et generáló esemény lekezelése!
A PCE annyival tud többet a HME-nél, hogy itt már alapban kapunk néhány olyan tulajdonságot, függvényt, amelyek segítségével a popup ablakban történt interakciók eredményével frissíthetjük a TargetControl valamely tulajdonságát aszinkron módon, anélkül hogy a targetcontrol-nak egy UpdatePanel-en belül kéne elhelyezkednie! Nézzünk erre egy egyszerű példát! Van egy TextBox-unk és egy Panelünk. A popup panelünkben pedig van egy UpdatePanel, azon belül pedig egy Calendar vezérlőnk. Amikor belekattintunk a szövegdobozba, megjelenik a naptár, majd amikor kiválasztunk egy dátumot, akkor pedig eltűnik. Értelemszerűen azt szeretnénk, hogy ilyenkor a kiválasztott dátum jelenjen meg a TextBox-ban, és ebben nyújtanak nekünk segítséget a PCE vezérlő ComitXXX tulajdonságai, illetve függvényei.

PCE használata
A teljes cikkben két példaalkalmazást is el fogunk készíteni. Az egyikben a ComitXXX-ek használatára fogunk látni egy egyszerű példát, a másikban pedig egy kicsit bonyolultabb példán keresztül megnézzük a dinamikus tartalom generálás rejtelmeit.
/A komplexebb példaalkalmazást a cikk második része fogja taglalni!/

Az egyszerűbb példa
Ebben a részben egy DropDownList-et fogunk elkészíteni egy TextBox, egy RadioButtonList, illetve egy PCE segítségével. Kezdjünk is hozzá!
Húzzunk a formunkra egy TextBox-ot, illetve egy Panel vezérlőt! A Panelnek állítsuk be stíluson keresztül a láthatóságát hidden-re, hogy ne villanjon egyet a panel az első oldalkérésnél (lásd korábbi cikkek)! Ezek után helyezzünk el benne egy UpdatePanel-t és ennek a ContentTemplate-jén belül pedig egy RadioButtonList-et! Itt vegyük fel elemeknek, mondjuk a hét napjait, ezek legyenek a Text értékek, a Value értékek pedig a héten belüli sorszámai legyenek a napoknak! Most valahol itt kell, hogy tartsunk:

<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
<asp:Panel ID="Panel1" runat="server" style="visibility:hidden;">
  <asp:UpdatePanel ID="UpdatePanel1" runat="server">
        <ContentTemplate>
            <asp:RadioButtonList ID="RadioButtonList1" runat="server">
                <asp:ListItem Text="Hétfő" Value="1" />
                <asp:ListItem Text="Kedd" Value="2" />
                <asp:ListItem Text="Szerda" Value="3" />
                <asp:ListItem Text="Csütörtök" Value="4" />
                <asp:ListItem Text="Péntek" Value="5" />
                <asp:ListItem Text="Szombat" Value="6" />
                <asp:ListItem Text="Vasárnap" Value="7" />
            </asp:RadioButtonList>
        </ContentTemplate>
    </asp:UpdatePanel>
</asp:Panel>

Húzzunk a form-unkra egy PCE vezérlőt és az alábbi módon állítsuk be:

<ajaxToolkit:PopupControlExtender ID="PCE_1" runat="server" TargetControlID="TextBox1" PopupControlID="Panel1" Position="Bottom" />

A PopupControlID tulajdonságon keresztül állíthatjuk be annak a vezérlőnek az azonosítóját, amelyiket dinamikusan meg szeretnénk majd jeleníteni az onclick, vagy onfocus, vagy onkeydown esemény bekövetkezésekor. Általában ehhez egy Panel vezérlőt érdemes használni.
A Position tulajdonság arra szolgál, hogy megszabjuk vele a PopControl relatív helyzetét a TargetControl-hoz képest. Ez a property egy PopControlPopupPosition enumerátor értéket vár. A halmaz az alábbi elemeket tartalmazza: Left, Top, Right, Bottom, Center.

Ahhoz, hogy a RadioButtonList-ből kiválasztott elem értékét ki tudjuk olvasni, majd meg tudjuk szépen jeleníteni, két dologra van szükségünk. Egyfelől fel kell iratkoznunk a SelectedIndexChanged eseményére, másfelől pedig be kell állítanunk néhány CommitXXX tulajdonságot. Először iratkozzunk fel az eseményére! (Ne felejtsük el átállítani a RadioButtonList-nél az AutoPostBack tulajdonságát true-ra!)
Az eseménykezelő függvényhez az alábbi kódot rendeljük:

PCE_1.Commit(RadioButtonList1.SelectedValue);

Ezzel a kóddal olyan, mintha megmondanánk azt, hogy mi legyen a popup panel-nek a visszatérési értéke.  Magyarul, a Commit metódusnak átadott paramétert tudjuk majd beállítani a TargetControl valamely tulajdonságának értékül. A TargetControl alapértelmezett beállítható tulajdonsága a http://devportal.hu/Portal/Detailed.aspx?NewsId=6321b80b-7444-40c7-8c60-5c93d1b7705a. Azért a value, mert például a TextBox egy <input type=”text” html tag-re „fordul le”, aminek a value attribútumán keresztül állíthatjuk be a TextBox Text értékét.

Tehát, ha most futtatjuk az alkalmazásunkat, akkor azt fogjuk tapasztalni, hogy a TextBox-ba mindig a kiválasztott nap sorszáma fog bekerülni aszinkron módon.

Hát valljuk be őszintén, ez nem valami túl felhasználóbarát kiíratás, ezért szépítsünk egy kicsit rajta! Megtehetnénk azt, hogy a Commit metódusba elhelyezünk egy String.Format() függvényt és egy szép mondatot kerítünk  a SelectedValue köré, de ennél van egy sokkal szebb megoldás is. Még pedig, hogy használjuk a PCE CommitXXX tulajdonságait! Menjünk vissza az aspx oldalunk source nézetébe és módosítsuk a PCE-t, valahogy így:

<ajaxToolkit:PopupControlExtender ID="PCE_1" runat="server" TargetControlID="TextBox1"
    PopupControlID="Panel1" Position="Bottom"
    CommitProperty="selectedDay"
    CommitScript="e.style.color = ‘red’; e.value = ‘A hét ‘ + e.selectedDay + ‘. napját választottad ki!’;" >
</ajaxToolkit:PopupControlExtender>

A CommitProperty tulajdonságnál megadott névvel létrejön egy új tulajdonsága a TargetControl-nak, amely majd tartalmazni fogja a szerver oldalon a Commit függvénynek átadott paramétert. Tehát a CommitProperty-nél azt a tulajdonságnevet szabjuk meg, amelyen keresztül majd el akarjuk érni a popup ablak „visszatérési értékét”!
Vagyis jelen esetben a TextBox-unkat kibővítjük egy selectedDay tulajdonsággal (amely csak javascript kódból lesz elérhető), és ennek az értékét állítgathatjuk majd a RadioButtonList-tel.
A CommitScript segítségével lehetőségünk van arra, hogy egy script kódot futtassunk az után, hogy a szerver oldalon végrehajtódott a Commit metódus. Ha inline javascript kódot írunk, akkor az e objektumon keresztül kapunk egy referenciát a TargetControl-ra, ami jelen esetben egy TextBox. Ennek először beállítjuk a betűszínét pirosra (sajnos valamiért nem hajlandó kezelni az olyan stílus beállításokat, amikben kötőjel is van, pl.: font-size), majd pedig a megjelenítendő szövegét szabjuk meg.
Amikor az e.value-nak adjuk meg az értékét, akkor a popup ablak result-jára az e.selectedDay tulajdonságon keresztül hivatkozunk.

Most már egy fokkal kellemesebb látvány fogadja majd a felhasználókat, amikor kiválasztanak egy napot a home-made DDL-ünkből. Íme:

Ehhez a példaalkalmazáshoz még annyi hozzáfűznivalóm lenne, hogy ha például azt szeretnénk megvalósítani, hogy a Vasárnap kiválasztásakor ne történjen semmi, akkor az alábbi kódrészletre kell módosítanunk a SelectedIndexChanged kezelőfüggvényét:

if (RadioButtonList1.SelectedIndex == 6)
{
    PopupControlExtender.GetProxyForCurrentPopup(this).Cancel();
    RadioButtonList1.ClearSelection();
}
else
    PCE_1.Commit(RadioButtonList1.SelectedValue);

Ez a kódrészlet több szempontból is érdekes. Az egyik, hogy megtudhatjuk belőle, hogy van egy Cancel metódusa is a PCE-nek, ami egy RollBack-nek felel meg, vagyis a popup ablak eltűnik, és a TextBox szövege nem változik meg.
A másik érdekessége a kódnak az, hogy láthatunk egy alternatívát az oldalon elhelyezett PCE vezérlőre történő hivatkozásra. A PopupControlExtender osztálynak van egy GetProxyForCurrentPopup metódusa, amely egy Page objektumot vár paraméterül, és egy referenciát ad vissza az adott Page-n lévő PCE vezérlőről. (Értelemszerűen ez a kód csak akkor működik, ha egyetlen egy PCE található az adott oldalon!)

A kicsit bonyolultabb példa

Folytatjuk…
Comming Soon…
Várhatóan csütörtökön!