Bepaal de complete HTML van een ASP.NET Control

De volledige HTML van een ASP.NET control (inclusief alle onderliggende controls) kan je bepalen door onderstaande code toe te passen:

string html = null;
using (StringWriter stringWriter = new StringWriter())
{
   using (HtmlTextWriter htmlWriter = new HtmlTextWriter(stringWriter))
   {
      control.RenderControl(htmlWriter);
      html = stringWriter.ToString();
   }
}

Hierboven is de 'control' variabele natuurlijk een instantie van een ASP.NET control.

Helaas kan jij bij bovenstaande code tegen een probleem aanlopen. Wanneer zich binnen het control, waar je de HTML van wilt bepalen, controls bevinden die binnen een ASP.NET Form geplaatst moeten worden (zoals bijvoorbeeld een TextBox, CheckBox, enz.), dan treedt de volgende fout op:
Control 'TextBox1' of type 'TextBox' must be placed inside a form tag with runat=server

Dit probleem kan je oplossen door het volgende te doen:

1. Zet de volgende optie in de 'Page Directive' van de pagina: EnableEventValidation="False" Deze optie kan ook in de Web.Config ingesteld worden. Dan geldt dit voor alle pagina's in je web project
2. 'Override' de volgende methode in de pagina: VerifiyRenderingInServerForm. Deze methode hoeft dan geen enkele code te bevatten

Check het MSDN om te bepalen of je vindt dat deze twee opties inderdaad aangepast/overriden mogen worden in jouw project:
• Page.VerifiyRenderingInServerForm
• PageSection.EnableEventValidation

Vervanger voor ASP.NET Dynamic Data Web Application

Momenteel ben ik een fervent gebruiker van de ASP.NET AJAX control suite van Telerik. Ik heb geprobeerd een simpele Database editor te ontwikkelen, ter vervanging van het ASP.NET Dynamic Data Web Application project uit Visual Studio 2008.

Dit Visual Studio 2008 C# project kan je hier downloaden. Let op: de Telerik assembly is verwijderd uit het ZIP bestand. Hier zal je zelf voor moeten zorgen.

Dit project bevat:

1. 1 LINQ to SQL diagram met alle tabellen uit mijn AdventureWorks SQL Server database
2. 1 webpagina met:
   - 1 RadGrid voor het tonen en wijzigen van records uit een SQL Server tabel
   - 1 RadComboBox voor het tonen van alle tabellen uit het LINQ to SQL diagram
   - 3 RadioButtons voor het specificeren van de EditMode eigenschap van het RadGrid
   - 1 LinkButton om het volledige grid te exporteren naar MS Excel

Dit project is dus heel wat simpeler dan een Dynamic Data Web Application. Om deze functionaliteit te gebruiken in je eigen webproject dien je het volgende te doen:

• Kopieer de webpagina en het LINQ to SQL diagram naar je eigen webproject
• Verwijder alle tabellen uit het LINQ to SQL diagram en voeg de tabellen uit je eigen SQL Server database aan het diagram.

Dat is alles... succes ermee !

Vervanger voor ValidatorCalloutExtender van AjaxControlTookit

Al enige tijd maak ik dankbaar gebruik van het AjaxControlTookit in mijn webapplicaties. Het control wat ik het meest gebruik is de ValidatorCalloutExtender. Deze extender vervangt de standaard meldingen van een ASP.NET Validator control door een fraaie tooltip.

Sinds kort maak ik gebruik van de Telerik controls (RadControls for ASP.NET AJAX), welke mijns insziens een zeer volwassen pakket met ASP.NET AJAX controls is.

Eigenlijk wil ik niet beide control suites in één project gebruiken en daarom heb ik een vervanger voor de ValidatorCalloutExtender van het AjaxControlTookit ontwikkelt. Deze vervanger is ook een ASP.NET AJAX Extender, welke gebruik maakt van de RadTooltipManager om de tooltips bij een Validator control te tonen.

Ik heb deze extender in een test web project geplaatst, welke je hier kan downloaden. In dit bestand heb ik overigens de assemblies van Teleriek niet toegevoegd. Daar zal je zelf voor moeten zorgen.

Hieronder een korte uitleg van deze extender:
De belangrijkste onderdelen van de extender zijn een klasse, genaamd ValidatorRadTooltipExtender, en een javascript bestand, genaamd ValidatorRadTooltipBehavior.
ValidatorRadTooltipExtender
De ValidatorRadTooltipExtender klasse erft van de abstracte klasse ExtenderControl, welke de basis is voor ASP.NET AJAX control extenders. Deze klasse bevat de volgende eigenschappen:

• RadTooltipManagerID = het ID van het RadTooltipManager control welke gebruikt wordt om de tooltips te tonen
• HighlightCssClass = naam van de class in de stijlen van de pagina, welke wordt gebruikt om toe te passen op het control wat gevalideert wordt (bijv. een Textbox welke verplicht is om in te vullen), wanneer het control ongeldig is volgens de validatie

ValidatorRadTooltipBehavior
Dit is het javascript bestand welke de extender functionaliteit implementeert. Hierbij wordt de EvaluationFunction van het Validator control vervangen door een eigen Validate functie. Deze functie voert wel de EvaluationFunction van het Validator control uit, maar zorgt er daarna voor dat het ToolTip wordt getoond op de pagina.
Hiernaast worden event handlers toegevoegt voor de Focus en Blur events van het control wat gevalideert wordt. Bij OnFocus wordt de tooltip getoond (indien deze niet geldig is volgens de validatie) en bij OnBlur wordt deze tooltip weer verborgen.

Webpagina
De volgende onderdelen dienen toegevoegd te worden aan een pagina, om gebruikt van deze extender te kunnen maken:
RadTooltipManager
Dit control dient toegevoegd te worden aan de webpagina of aan de Master van de webpagina. De volgende eigenschappen op dit control zijn van belang:

• RelativeTo = waar (gerelateerd aan welk object) dient de tooltip gepositioneerd te worden. Deze eigenschap dient op 'Element' ingesteld te worden
• HideEvent = welk event zorgt ervoor dat de tooltip weer verborgen dient te worden. Deze eigenschap dient op 'FromCode' ingesteld te worden
• ShowEvent = welk event zorgt ervoor dat de tooltip weer getoond dient te worden. Deze eigenschap dient ook op 'FromCode' ingesteld te worden

Validator
Naast het element wat gevalideert dient te worden (bijv. een Textbox) dient natuurlijk het Validator control (bijv. de RequiredFieldValidator) aan de pagina toegevoegd te worden. Voor dit control zijn de volgende eigenschappen van belang:

• ErrorMessage = de melding die in de tooltip getoond moet worden indien het element niet geldig is. Hierbij kan je gewoon gebruik van HTML maken, zodat je de tooltip een leuk uiterlijk kan geven!
• Display = deze eigenschap dient op 'None' ingesteld te worden, zodat de ErrorMessage van de validator niet in een label wordt getoond. Hiervoor wordt natuurlijk de tooltip gebruikt.
• SetFocusOnError = indien deze op 'True' wordt ingesteld dan zal het element wat gevalideert wordt de focus krijgen wanneer dit niet geldig is. Door deze actie zal het OnFocus event ervoor zorgen dat de tooltip direct getoond wordt.

Hierboven zijn de belangrijkste onderdelen van dit extender control beschreven. Hieronder een screenshot van deze extender in werking.

Veel succes met dit extender control.

Fiedelientje Blog

Mijn vrouw is een tijdje geleden een webwinkel begonnen onder de naam Fiedelientje. Nu is ze een Blog gestart waarin ze probeert een beetje te kunnen laten zien van achter de schermen en de ontwikkeling van haar winkeltje.

Fiedelientje is een kinderlifestyle webwinkel voor kleine wereldburgertjes. Houdt u van lieflijk, kleurrijk, stippen en ruitjes en niet van een standaard assortiment dan bent u bij Fiedelientje aan het juiste adres. U vind hier artikelen van verschillende leveranciers, maar ook handgemaakte artikelen van eigen ontwerp.

Bezoek haar blog eens op http://fiedelientje.blogspot.com/

SSH op VMware ESXi inschakelen

SSH staat standaard uit in VMware ESXi. VMware geeft ook geen support indien je SSH wel inschakeld op ESXi. Toch is het wel erg handig als je remote op de console van ESXi kan inloggen om bijvoorbeeld wat maintenance uit te voeren.

Hieronder staan de stappen beschreven waarmee je SSH kan inschakelen op ESXi:

• Start VMware ESXi op en toets in het console op ALT-F1:



• Typ het commando unsupported in:
  
  
• Geeft het wachtwoord van de root gebruiker in
• Typ nu het volgende commando in: vi /etc/inetd.conf
  
  
• Ga (met behulp van de pijltjestoetsen) naar de regel waar #ssh staat en verwijder het # teken
  
  - ga voor het # teken staan
  - druk op de Insert toets
  - ga met de cursor over het # teken
  - druk op de Backspace toets
• Druk op de ESC toets en typ het commando wq om het bestand te bewaren
• VMware ESXi dient nu opnieuw opgestart te worden.
  Zorg er wel voor dat alle virtuele machines netjes zijn afgesloten (door in het operating systeem een shutdown uit te voeren)

Nadat VMware ESXi is herstart kan je met behulp van een SSH tool, zoals bijvoorbeeld PuTTY, remote inloggen op de ESXi console.

Success ermee !


Bron(nen): VM-Aware

Installeer SCSI hard disk in VMWare Virtual Machine met Windows XP

Wanneer je in een VMWare virtual machine Windows XP wilt installeren met een Hard Disk van het type SCSI, dan heb je een probleem met de drivers. De benodigde drivers zitten namelijk niet in een standaard Windows XP installatie wat veroorzaakt dat de Windows XP installatie de hard disk niet 'ziet' en dus de installatie niet kan voltooien.

VMWare heeft wel een driver hiervoor beschikbaar gestelt, welke je kan downloaden op http://www.vmware.com/download/ws/drivers_tools.html onder het kopje SCSI Disk Drivers. Dit is een Floppy image die je in je Virtuele Machine kan koppelen aan de floppy drive. In de Windows XP installatie kies je dan de optie "Druk op F6 om een niet-Microsoft SCSI/RAID stuurprogramma te installeren". Daarna kies je "E=Extra apparaat opgeven" en Enter om de "VMWare SCSI Controller" te selecteren. Wanneer je daarna de installatie probeert te voltooien krijg je, tijdens het kopiëren van de bestanden, de foutmelding "Setup kan het bestand vmscsi.sys niet kopiëren". Helaas kan je nu de installatie niet goed voltooien.

Een simpele manier (en eentje die zeker werkt) is het 'slipstreamen' van de SCSI driver in de Windows XP installatie. Ik heb hiervoor nLite gebruikt. Met behulp van nLite kan je de gehele Windows XP installatie aanpassen. Ik richt me in dit artikel alleen op het integreren van de driver:

• Download de laatste versie van nLite op hun website en installeer deze
• Start nLite op en selecteer de directory waar de Windows XP installatie staat. Dit kan ook de CD-ROM drive (waar de installatie CD van Windows in zit) zijn
• Klik een aantal keer op Next totdat je onderstaand venster te zien krijgt:
  
  Selecteer hier de opties Drivers en Bootable ISO
• Klik hierna op Next totdat je onderstaand venster te zien krijgt:
  
  Download hier het ZIP bestand met de VMWare SCSI Driver en extract de inhoud naar een folder.
  Klik hier op Insert en selecteer daarna Single Driver. Nu heb je de mogelijkheid om de SCSI driver te selecteren welke in de Windows XP installatie toegevoegd zal worden.
  
  Selecteer de VMWare SCSI Controler en klik op OK
• Klik een aantal keer op Next totdat je onderstaand venster te zien krijgt:
  
  Klik op Make ISO om een ISO bestand te genereren welke je daarna kan branden op CD óf aan een VMWare CD Drive kan koppelen
• De installatie van Windows XP kan nu op een 'normale' manier uitgevoerd worden. De installatie zal automatisch de HD 'zien' en de juiste drivers installeren.

Succes ermee !

Leuke Speech gadgets bij Acapela.tv

Ik ben momenteel bezig met het uitzoeken van de Speech API van Microsoft welke in het .Net framework geïntegreerd is (System.Speech). Via Google kwam ik op de website van Acapela en Acapelat.tv. Daar heb je een aantal zeer leuke gadgets, waaronder deze hieronder. Klik op de 'Play' knop en laat je verrassen. Erg indrukwekkend hoor !!!

Analyseren van het gedrag van bezoekers aan je website (Mouse Tracking)

Tegenwoordig is het mogelijk het echte gedrag van bezoekers op je website te meten. Daarmee bedoel ik dat alle muisbewegingen en klikken van de muis gevolgd kunen worden.

Een aantal bedrijven (o.a. TrackConsole, ClickTale, OpenCube) hebben reeds software ontwikkelt om dit mogelijk te maken. Met behulp van deze software kan je de weg die een bezoeker met zijn muis heeft gevolgt 'naspelen', waardoor het daadwerkelijke gedrag van de bezoeker inzichtelijk wordt gemaakt. Met behulp van de verzamelde gegevens kan je je website beter optimaliseren, waardoor bezoeken (hopelijk) tot een hoger rendement zullen leiden.

Mouse Tracking moet je niet vergelijken met Eye Tracking. Eye Tracking analyseert het kijkgedrag van een bezoeker aan een website d.m.v. dure (camera-)apparatuur. De resultaten die hieruit volgen zijn wel vergelijkbaar met Mouse Tracking en zouden op dezelfde manier gebruikt kunnen worden voor website optimalisatie.

Ik denk dat ik me in eerste instantie maar even bezig ga houden met de goedkopere Mouse Tracking methode. Ik ben benieuwd wat de resultaten ervan zullen zijn én of/hoe websites echt, op basis van deze resultaten, geoptimaliseert kunnen worden. Indien ik hier meer over weet zal ik het in mijn blog schrijven.

Velden gebruiken in de header van een SQL Server Reporting rapport

Hoe kan je velden uit je dataset gebruiken in de header of footer van een rapport in SQL Server Reporting?

Helaas kan je dit niet zomaar doen. Wanneer je een veld uit de Datasets toolbar sleept in de header of footer van een rapport, dan krijg je bij het uitvoeren van het rapport de volgende melding: "The Value expression for the textbox ‘[FieldName]’ refers to a field. Fields cannot be used in page headers or footers."

Hoe krijg je dit nu wél voor elkaar?
De simpelste oplossing is om aan de rapport parameters een nieuw veld toe te voegen.

• Hierbij selecteer je dan de optie 'Hidden', zodat de gebruiker niet wordt gevraagd om de nieuwe parameter in te vullen.
• Onder de sectie "Default values", selecteer je de optie "From query". Hierbij maak je de keuze voor de betreffende Dataset en voor "Value field" selecteer je het betreffende veld uit deze dataset

Hierna kan je een nieuwe 'Textbox' in de header of footer van het rapport slepen en de rapport parameter er aan toe kennen. Bijvoorbeeld: "=Parameters!EmployeeName.Value"

Dat is alles. Succes ermee !

API van TransIP.nl aanroepen vanuit .Net

Smallweb maakt sinds kort gebruikt van een aantal diensten van TransIP. TransIP biedt hierbij de mogelijkheid om gebruik te maken van een API. Deze API is een service die SOAP gebaseerd is en biedt functionaliteit om domeinen te bekijken die je via TransIP geregistreerd hebt, maar ook om domeinen te registreren, DNS records te wijzigen, enz.

TransIP heeft op haar website documentatie geplaatst welke PHP gerelateerd is. Zelf ontwikkel ik voornamelijk op het Microsoft platform en had dus de behoefte om deze API in .Net te gebruiken. Hieronder een korte uitleg om dit eenvoudig op te zetten.

1. Om gebruik van de API te kunnen maken dien je eerst klant te worden bij TransIP. Hierna kan je in het controlepaneel de API inschakelen, waarbij je een wachtwoord voor je gebruikersnaam op kan geven.
   Let op: dit wachtwoord hoeft niet hetzelfde wachtwoord te zijn als van je reguliere TransIP account.


2. Maak in Microsoft Visual Studio een project aan (in dit voorbeeld heb ik een Web Application project in Visual Studio 2008 aangemaakt)


3. Voeg aan dit project een web reference toe door met de rechter muisknop op het project in de Solution Explorer te klikken en Add Web Reference te selecteren.


4. Vul in het nieuwe venster de volgende URL in: https://api.transip.nl/wsdl/?service=DomainService (deze kan je terugvinden in de API documentatie van TransIP) en klik op Go.
   Hierna krijg je een aantal keer onderstaand venster te zien, maar hier kan je gewoon op Ja / Yes klikken.
   
   
   Geef de service reference de naam 'DomainService' en klik op "Add reference"
   
   
   De Web Reference wordt nu aan het project toegevoegd.
   
   


5. Om met de API van TransIP te kunnen communiceren dien je 3 cookies in het service request mee te sturen, namelijk:
   login = het account bij TransIP
   hash = een string die volgens het volgende formaat opgebouwd is: 'login:password@ipadres', waarbij login het account bij TransIP is; het password is het wachtwoord wat je hebt ingesteld bij de API instellingen in het controlepaneel van TransIP; het IP adres is het internet IP adres van de computer waarmee je een verbinding maakt met de SOAP service.
   Deze string dient geëncrypt te worden met behulp van MD5.
   mode = readonly of readwrite. Met readonly kan je de API testen en met readwrite worden wijzigingen daadwerkelijk doorgevoerd.
   Voor het doorgeven van deze waardes heb ik een aantal constanten aangemaakt. Natuurlijk is het veel beter om deze waardes uit een configuratiebestand te lezen, maar voor dit voorbeeld houden we het even simpel.
   

   
   private const string TransIpLogin = "username";
   private const string TransIpPassword = "password";
   private const string TransIpIpAddress = "192.168.1.1";
   private const string TransIpMode = "readonly";
   



6. Nu voegen we een 'Connect' methode toe aan de klasse waarin we aan het programmeren zijn, om de verbinding met de SOAP service tot stand te brengen
   

   
   public DomainServiceService Connect()
   {
       //Instancieer service
       DomainServiceService service = new DomainServiceService();
   
       //Valideer de server certicicaat (vanwegde de HTTPS conenctie)
       ServicePointManager.ServerCertificateValidationCallback =
           new RemoteCertificateValidationCallback(
           delegate(object sender, X509Certificate certificate, X509Chain chain, SslPolicyErrors sslPolicyErrors)
           {
               return true;
           });
   
       //Genereer de hash voor authenticatie
       string hashData = string.Format("{0}:{1}@{2}", TransIpLogin, TransIpPassword, TransIpIpAddress);
       string hash = System.Web.Security.FormsAuthentication.HashPasswordForStoringInConfigFile(hashData, "MD5").ToLower();
   
       //Voeg de 3 authenticatie/configuratie cookies toe
       CookieContainer cookies = new CookieContainer();
       cookies.SetCookies(new Uri(service.Url), string.Format("login={0}", TransIpLogin));
       cookies.SetCookies(new Uri(service.Url), string.Format("hash={0}", hash));
       cookies.SetCookies(new Uri(service.Url), string.Format("mode={0}", TransIpMode));
       service.CookieContainer = cookies;
   
       //Retourneer de service instantie
       return service;
   }
   

   Deze 'Connect' methode geeft een instantie van de service klasse terug, waarmee we domeinen kunnen gaan beheren.


7. Nu kunnen we bijvoorbeeld de lijst met geregistreerde domeinnamen (geregistreerd via TransIP) ophalen:
   

   
   DomainServiceService service = this.Connect();
   this.txtDomains.Text = string.Join("\r\n", service.getDomainNames());
   

   In dit voorbeeld wordt de lijst met domeinen in een TextBox control getoont
   
   óf WHOIS gegevens van een domein ophalen:
   

   
   DomainServiceService service = this.Connect();
   this.txtWhois.Text = service.getWhois(this.txtDomain.Text);
   

   In dit voorbeeld wordt de WHOIS informatie in een TextBox control getoont.


8. Voor een overzicht van alle functies in de API verwijs ik je door naar de API documentatie van TransIP

Bovenstaande voorbeeld Web Project kan je hier eventueel downloaden.

Succes ermee !!

Smallweb verlaagt prijzen voor domeinregistraties

Smallweb verlaagt de prijzen voor domeinregistraties. De prijs voor de registratie van een .nl domein kost nu nog maar € 7,50 per jaar zonder eenmalige registratiekosten.

Maar, bij Smallweb kan je natuurlijk naast de domeinregistratie ook meteen je website laten hosten (overigens zijn we momenteel bezig met het verlagen van de prijzen voor hosting én het opwaarderen van deze pakketten. Denk hierbij aan beschikbare schijfruimte en maximaal toegestaan dataverkeer).
Het voordeel van Smallweb is dat het alleen maar zeer hoge kwaliteit biedt.

Check de website van Smallweb of registreer direct je domeinnaam !!!

Eenvoudig RSS feeds maken in ASP.NET 3.5

In ASP.NET 3.5 is het zeer eenvouding om RSS feeds te maken voor je website. Hieronder probeer ik dan ook eenvoudig uit te leggen hoe je dit snel voor elkaar kunt krijgen:

1. Voeg aan je web project een nieuw item toe door met de rechter muisknop op het project te klikken en "Add/New item" te selecteren
   
2. Selecteer de "Generic Handler" template en geef deze de naam 'rss.ashx'
   
   Het *.ashx bestand met het code-behind klasse bestand (*.cs) wordt gegenereerd


3. De klasse implementeert de interface IHttpHandler en de bijbehorende methodes en eigenschappen zijn hierbij reeds aangemaakt.


4. We gaan nu de methode 'ProcessRequest' aanpassen om een RSS feed in het Response object te schrijven. Verwijder eerst de bestaande voorbeeld code
   
   
5. Om RSS feeds te genereren hebben we een extra reference in het project nodig, namelijk: "System.ServiceMode.Web". Klik in het webproject met de rechter muisknop op 'References' en selecteer "Add Reference". Selecteer in de lijs met .Net componenten het betreffende component.
   



6. Maak een instantie van de klasse 'SyndicationFeed':
   SyndicationFeed feed = new SyndicationFeed("RSS titel", "RSS omschrijving", new Uri("http://localhost"));
   Voeg hiervoor de volgende "using directive" (bonvenin de klasse) toe:
   using System.ServiceModel.Syndication;


7. Voeg (als voorbeeld) twee items aan de RSS feed toe:
   feed.Items = new List
   {
   new SyndicationItem("Item 1", "Het 1e RSS item", new Uri("http://localhost/item1.aspx")),
   new SyndicationItem("Item 2", "Het 2e RSS item", new Uri("http://localhost/item2.aspx"))
   };


8. Schrijf de RSS feed naar het Response object:
   using (System.IO.StringWriter output = new System.IO.StringWriter())
   {
   System.Xml.XmlTextWriter writer = new System.Xml.XmlTextWriter(output);
   new Rss20FeedFormatter(feed).WriteTo(writer);
   context.Response.ContentType = "application/rss+xml";
   context.Response.Write(output.ToString());
   }


9. Als je nu rss.ashx opstart in je webproject dan zul je zien dat er netjes een RSS feed wordt 'gerendert'.

In punt 7 zou je natuurlijk een database (of andere databron) uit kunnen lezen om automatisch RSS items toe te voegen aan je feed.

Succes ermee !!!

Drag&Drop Panels oftewel Widgets in ASP.NET

Al enige tijd was ik van plan om "draggable panels" (ook wel widgets genoemd) te ontwikkelen in ASP.NET, zodat ik deze kon gaan gebruiken in een dashboard pagina in de webapplicaties die wij ontwikkelen. Een voorbeeld hiervan zijn de Gadgets in iGoogle:


Natuurlijk heb ik deze techniek niet helemaal zelf ontwikkeld, want er zijn er al genoeg die mij voor zijn geweest... het wiel hoeft immers niet opnieuw uitgevonden te worden. De controls die voor mij het beste in aanmerking kwamen waren de controls die Omar AL Zabir heeft ontwikkeld.
Omar heeft een project ontwikkeld (open source) waarvan je online kan bekijken hoe dit functioneert: http://www.dropthings.com/. De sources van dit project kan je hier downloaden.

Het nadeel van dit open source project is de complexiteit die er aanwezig is, vanwege de vele 'Widgets' die er al inzitten. Ik het dit project uitgekleed tot een project waar alleen de techniek van de Drag&Drop widgets aanwezig is. Met behulp van dit project kan je veel eenvoudiger een start maken om de Widgets verder te ontwikkelen tot je eigen controls.


Laten we beginnen met een voorbeeld filmpje wat bewijst dat het allemaal ook nog werkt:


Dit project is ontwikkeld in ASP.NET 3.5 SP1 en maakt gebruik van het AjaxControlToolkit. Het project bestaat uit de volgende onderdelen:

• DragControls folder. Hierin staan de AJAX control extenders die Omar heeft ontwikkeld.
• Default pagina. Deze pagina bevat 2 Panel controls welke ieder 2 Widgets bevat. Hierbij heb ik gebruik gemaakt van standaard ASP.NET controls. Het is natuurlijk netter om uiteindelijk de controls die voor de Widgets zijn gebruikt te verwerken tot 1 custom ASP.NET control óf 1 UserControl
• Voor elk Panel control waarin Widgets staan is een CustomDragDropExtender toegevoegd aan de pagina. Hierin staat het volgende gedefinieerd:
  TargetControlID: ID van het Panel control welke de Widgets bevat;
  DragItemClass: welke CssClass wordt gebruikt voor het kenmerken van een Widget
  DragItemHandleClass: welke CssClass wordt gebruikt voor het kenmerken van de header van een Widget (dit header element wordt gebruikt om het Widget te Drag&Droppen);
  DropCueID: ID van het control waarin de Widgets in gedropt kunnen worden. Elk Panel wat Widgets kan bevatten heeft een dergelijk Drop control nodig.
  OnClientDrop: hierbij kan een javascript functie aangegeven worden welke uitgevoerd dient te worden, nadat een Widget versleept is
• Stylesheet. Deze stylesheet bevat alleen die stijlen die gebruikt worden door de Widget functionaliteit
• WidgetHandler.js. Dit javascript bestand bevat de onDropWidget functie welke aangeroepen wordt nadat een Widget versleept is (OnClientDrop)
  Deze javascript functie maakt gebruik van de WidgetService om hierin de methode MoveWidget aan te roepen.
• WidgetService. Webservice welke door de Default pagina is toegevoegd aan de ASP.NET ScriptManager. Dit zorgt ervoor dat de WebMethodes in deze WebService beschikbaar komen middels een object model in javascript. De webservice functies zijn dan dus vanuit javascript direct aan te roepen.

Ik heb verder geen implementatie toegevoegd voor het daadwerkelijk verplaatsen van een Widget aan de server zijde. De knoppen voor het verwijderen/sluiten van een Widget zijn wel aanwezig, maar ook deze heb ik niet geïmplementeerd.
Het lijkt me juist beter dat jullie deze functionaliteit zelf implementeren en ik de code in dit project niet vervuil met applicatielogica waar jullie niets aan hebben.

De source code kan je hier downloaden.
Succes ermee !!!


Bronnen:
http://www.dropthings.com/
http://msmvps.com/blogs/omar/archive/2007/03/22/asp-net-ajax-extender-for-multi-column-widget-drag-drop.aspx

Bug in ASP.NET ReportViewer van Microsoft

Oplossing

Vandaag (4 maart 2009) heb ik reactie gekregen op mijn feedback. Microsoft heeft het probleem opgelost in Cumulative update package 9 for SQL Server 2005 Service Pack 2 en Cumulative update package 1 for SQL Server 2005 Service Pack 3.

Ik heb in eerste instantie SQL Server 2005 Service Pack 3 geïnstalleerd. Hierna bleek het probleem al direct opgelost te zijn. Óf de Cumulative update package 1 zit al in SP3 óf de installatie van SP3 lost het probleem zelf al op!

Update (9 maart 2009): helaas heeft de update naar SP3 op de (64 bits) productie server niet tot hetzelfde resultaat geleidt. Ook de Cumulatieve Update 1 voor SP3 heeft niet geholpen. Microsoft heeft me gewezen op een blog artikel van Brian Hartman. Ik heb alle updates geïnstalleerd die Brian in zijn artikel noemt (behalve de update voor SharePoint, want daar heb ik in mijn project niets mee te maken), maar ook dit heeft niets geholpen. Ik zal dit opnieuw aan Microsoft melden.

Wordt vervolgd...

In het ReportViewer control van Microsoft, waarmee rapporten van SQL Server Reporting in een web applicatie bekeken kunnen worden , zit een bug.

Indien de beveiligingsupdate voor ActiveX Killbits voor Windows XP (KB956391) is geïnstalleerd op de client computer (in mijn geval Windows XP SP3 met Internet Explorer 7) dan functioneert het printen van een rapport niet meer.
Hierbij volgt dan de volgende foutmelding: "Unable to load client print control". Wanneer je de betreffende update verwijderd, dan is het probleem weer opgelost.

Ik heb hiervoor een bug rapport bij Microsoft Connect ingediend. Je kan deze 'feedback' hier volgen.
Ik houd jullie op de hoogte !!!

Fiedelientje

Mijn vrouw is pas geleden een webwinkel begonnen onder de naam Fiedelientje.

Fiedelientje is een kinderlifestyle webwinkel voor kleine wereldburgertjes. Houdt u van lieflijk, kleurrijk, stippen en ruitjes en niet van een standaard assortiment dan bent u bij Fiedelientje aan het juiste adres. U vind hier artikelen van verschillende leveranciers, maar ook handgemaakte artikelen van eigen ontwerp.

Smallweb heeft hiervoor de webapplicatie ontwikkeld. Wil je ook een webwinkel beginnen, bel of mail ons dan en wij komen graag onze webwinkel demonstreren.

Ik zou zeggen: ga snel eens kijken !!!

ASP.NET control voor FusionChart

Op de markt zijn talloze grafiek componenten aanwezig die in ASP.NET webapplicaties geïntegreerd kunnen worden. Persoonlijk zoek ik altijd naar freeware controls, omdat de vraag naar grafieken in een webapplicatie vaak niet van dergelijk belang is dat er (veel) geld voor neergeteld wordt.

Nu heb ik een oplossing gevonden welke gratis is, zeer dynamisch, flexibel... en het ziet er nog fraai uit ook. FusionCharts biedt een oplossing die op Flash (versie 8) gebaseerd is. Het grote voordeel van Flash is natuurlijk dat het cross-browser en cross-platform is. Het nadeel is dat het altijd op de computer van de gebruiker geïnstalleerd moet zijn om er gebruik van te kunnen maken.

Om het gebruik van deze functionaliteit te vereenvoudigen heb ik een ASP.NET (3.5) control ontwikkeld, welke de meest gebruikte functionaliteiten toepast. Het control maakt gebruik van Javascript om de Flash elementen op de pagina toe te voegen.
Een Visual Studio 2008 project kan hier gedownload worden. Dit project bevat het ASP.NET control en een testpagina.

Belangrijke eigenschappen van het control:

• DataSource: het toekennen van data aan het Flash element geschiedt middels XML. Dit control biedt de mogelijkheid om een IEnumberable DataSource toe te kennen. Deze DataSource zal als XML in de pagina worden toegevoegd
• DataMemberXAxis: DataMember uit de DataSource die op de X-as gebruikt moet worden
• DataMemberYAxis: Lijst met één of meerdere DataMembers die op de Y-as gebruikt moet worden.
  Let op: indien er meer dan één DataMember wordt gebruikt, dan dient een correct ChartType toegekent te worden (alle ChartTypes die beginnen met 'MS' kunnen hiervoor worden gebruikt)
• ChartType: type grafiek die gebruikt moet worden. Elk type maakt gebruik van een ander Flash bestand. Zie de FusionCharts folder in het VS2008 project
  

Succes ermee !

Bron(nen):
FusionCharts
FusionCharts Documentatie

ASP.NET control voor Google AJAX Search API

Google maakt het mogelijk om (redelijk) simpel hun zoekmachine functionaliteit te integreren in je eigen website. Hiervoor kan je gebruik maken van de Google AJAX Search API.

Deze API kan middels Javascript aangeroepen worden en biedt een AJAX zoekmachine in je eigen website. Om het gebruik van deze functionaliteit te vereenvoudigen heb ik een ASP.NET (3.5) control ontwikkeld, welke de meest gebruikte functionaliteiten van de API toepast.
Een Visual Studio 2008 project kan hier gedownload worden. Dit project bevat het ASP.NET control en een testpagina.

Belangrijke eigenschappen van het control:

• GoogleApiKey: deze key kan hier worden opgevraagd
• SearchDefinitions: dit is de lijst met de types Search die je kan integreren op je website. Zie de Google documentatie voor uitleg hiervan. Standaard is het type WebSearch al aanwezig (zie Constructor) in deze lijst.
• MessageForNoResults: standaard wordt geen melding weergegeven indien Google geen zoekresultaten heeft. Middels deze eigenschap kan je toch een melding laten weergeven
• NoDefaultCss: standaard voegt Google zelf HTML styles toe aan de Google elementen op je pagina. Wanneer je deze eigenschap op False zet wordt dit niet gedaan en kan je je eigen styles gebruiken (door je juiste class names in je stylesheet op te nemen).

Succes ermee!

Bron(nen):
Google AJAX Search API
Documentatie Google AJAX Search API

Verbergen van Next / Previous controls in ASP.NET WizardControl

Vandaag had ik een probleem met het verbergen van de Next / Previous links/buttons van een ASP.NET WizardControl.

Hierbij liep ik tegen 2 problemen aan:

1. Middels de standaard methode FindControl op het WizardControl object kan de betreffende LinkButton niet gevonden worden. Hiervoor het ik zelf een FindControl methode gemaakt, welke hieronder is bijgevoegd
2. Het aanpassen van de eigenschap [LinkButton].Visible naar False blijkt niet te werken. Waarschijnlijk negeert het WizardControl deze eigenscap in de eigen Render methode. In plaats van de Visible eigenschap kan je de Style eigenschap gebruiken:
   [LinkButton].Style["display"] = "none";

De code behorende bij punt 1 (deze methode zoek recursief, binnen een container control, naar het control met het betreffence ID):

public static Control FindControl(string controlID, Control container) 
{
 foreach (Control ctrl in container.Controls) 
 {
  if (ctrl.ID != null && ctrl.ID.Equals(controlID))
   return ctrl;
  if (ctrl.HasControls()) 
  {
   Control c = FindControl(controlID, ctrl);
   if (c != null) return c;
  }
 }
 return null;
}

Een voorbeeld van het verbergen van de Next link op de eerste Wizard Step:

WebControl = FindControl("StartNextLinkButton", this.wizardControl1) as WebControl;
nextLink.Style["display"] = "none";

Bronnen: Microsoft MSDN

Dynamic Data integreren in bestaande web applicatie

Één na de nieuwe features in Visual Studio 2008 SP1 is de Dynamic Data Web Application. Een heel handige feature die het mogelijk maakt om je databronnen middels een website te bekijken of te muteren.

Als je een nieuw project in Visual Studio 2008 aanmaakt bestaat de Dynamic Data Web Application uit één van de vele mogelijkheden die Visual Studio tegenwoordig biedt. Indien je deze keuze maakt wordt een complete web applicatie voor je gegenereerd en hoef je eigenlijk alleen maar een 'LINQ to SQL classes' diagram toe te voegen; de benodigde tabellen op het diagram te slepen en de gecreëerde DataContext toe te voegen aan de MetaModel instantie in global.asax.cs en je bent klaar.

Wat nu als je deze functionaliteit wilt integreren in een bestaande web applicatie?
Ik heb wat zitten vogelen met deze functionaliteit en heb deze zo aangepast dat het relatief eenvoudig is om te integreren in een bestaande web applicatie. Hiervoor moet je het volgende doen:

1. Download dit zip bestand en importeer de folder uit de zip in je web applicatie. De zip bevat een 'LINQ to SQL classes' diagram welke als voorbeeld is toegevoegd. Deze kan gewoon verwijderd worden!
2. Voeg de volgende references toe aan je project:
   System.Web.DynamicData
   System.Web.Routing
3. Voeg een 'LINQ to SQL classes' diagram toe aan je project en sleep de benodigde tabellen op het diagram
4. Registreer de DataContext, van bovenstaand diagram, middels de model.RegisterContext functie van de RegisterRoutes methode in de DynamicDataModule klasse
5. Wijzig de DynamicDataApplicationName constante in de DynamicDataMaster klasse naar je eigen applicatienaam
   
   == Web.config aanpassingen ==
6. Voeg in de sectie de volgende assemblies toe:

   <add assembly="System.Web.Abstractions, Version=3.5.0.0, Culture=neutral, PublicKeyToken=31BF3856AD364E35"/>
   <add assembly="System.Web.Routing, Version=3.5.0.0, Culture=neutral, PublicKeyToken=31BF3856AD364E35"/>
   <add assembly="System.ComponentModel.DataAnnotations, Version=3.5.0.0, Culture=neutral, PublicKeyToken=31BF3856AD364E35"/>
   <add assembly="System.Web.DynamicData, Version=3.5.0.0, Culture=neutral, PublicKeyToken=31BF3856AD364E35"/>

7. Voeg in de / sectie de volgende tag prefix toe:

   <add tagPrefix="asp" namespace="System.Web.DynamicData" assembly="System.Web.DynamicData, Version=3.5.0.0, Culture=neutral, PublicKeyToken=31BF3856AD364E35"/>

8. Activeer ASP.NET Routing
      IIS5/IIS6 : voeg de module toe aan de httpModules sectie:
   

   <add name="UrlRoutingModule" type="System.Web.Routing.UrlRoutingModule, System.Web.Routing, Version=3.5.0.0, Culture=neutral, PublicKeyToken=31BF3856AD364E35" />

      IIS7 - deel 1: voeg de module toe aan de / sectie:

   <remove name="UrlRoutingModule" />
   <add name="UrlRoutingModule" type="System.Web.Routing.UrlRoutingModule, System.Web.Routing, Version=3.5.0.0, Culture=neutral, PublicKeyToken=31BF3856AD364E35" />

      IIS7 - deel 2 : voeg de handler toe aan de / sectie:

   <add name="UrlRoutingHandler" preCondition="integratedMode" verb="*" path="UrlRouting.axd" type="System.Web.HttpForbiddenHandler, System.Web, Version=2.0.0.0, Culture=neutral, PublicKeyToken=b03f5f7f11d50a3a" />

9. Voeg de DynamicDataModule aan de modules sectie toe (wijzig [WebApplitionName] in de naam van je assembly):
   

   <add name="DynamicDataModule" type="DynamicDataModule, [WebApplitionName]"/>

Als je nu de pagina DynamicData\Default.aspx opstart zou de Dynamic Data feature moeten werken.

Succes ermee !!!

Google Chrome foutmelding "The application failed to initialize properly (0xc0000005)”

Ik heb net Google Chrome gedownload en geïnstalleerd. Helaas kreeg ik bij het opstarten meteen de volgende foutmelding: "The application failed to initialize properly (0xc0000005)”.

Er zijn twee mogelijke oplossingen voor dit probleem:
1. Pas de registry aan:

• Start de registry editor door op Start \ Uitvoeren de klikken en regedit.exe gevolgd door ENTER in te toetsen.
• Ga in de boomstructuur HKEY_LOCAL_MACHINE\SYSTEM\CurrentControlSet\Services\SysPlant.
  Indien deze sleutel niet aanwezig is, dient deze aangemaakt te worden.
• Open de 'Start' waarde of voeg deze toe (type is DWORD)
• Wijzig de waardegegevens van de 'Start' waarde naar 4 om drivers uit te schakelen
• Herstart de computer

2. Start Google Chrome met het "--no-sandbox" argument.

• Klik met de rechter muisknop op de Google Chrome snelkoppeling
• Voeg de tekst "–no-sandbox" (zonder de aanhalingstekens) toe aan het Doel veld.

In mijn geval werkte oplossing 1 al en was oplossing 2 niet meer noodzakelijk.

Mijn ervaringen met Google Chrome zijn tot nu toe erg goed. Ik heb nog nooit een webbrowser gehad die zo snel opstartte en zo snel naar een website surfte.