Jag sitter just nu i ett projekt där vi skriver en webbapplikation som hanterar flera språk och regioner. Det innebär att vi bland annat måsta ta hänsyn till olika datumformat. Det finns en valideringskontroll som man kan använda för att validera om ett datum är rätt. Det fungerar till och med på klientsidan. Men det finns ett problem och det är att valideringen endast triggas igång när man gör någon form av submit på sidan. I projektet vill vi kunna kontrollera datumet även när vi flyttar oss till en annan kontroll på sidan.
För att lösa detta kan man naturligtvis bygga egna javascript som hanterar olika datumformat för att göra en rätt validering. Men vår fundering var om man inte kunde använda sig av valideringskontrollens valideringsfunktioner, för dessa fungerar redan när man gör submit. Och det gjorde vi.
I det här exemplet vill jag visa på hur man kan sparka igång en validering utan att behöva göra en submit av sidan. (Observera att jag använder mig av ASP.NET:s egna valideringsskript. Detta kanske inte kommer att vara kompatibla i framtiden. Men det har jag inte kollat upp. Exemplet fungerar i Visual Studio 2003 och troligtvis också i Visual Studio 2002.)
Vi börjar med att skapa ett nytt webbprojekt och lägger till tre kontroller i WebForm1.Aspx:
<asp:TextBox id="TextBox1" runat="server"></asp:TextBox> <asp:button id="Button1" runat="server" text="Button"></asp:button> <asp:comparevalidator id="CompareValidator1" runat="server" errormessage="CompareValidator" controltovalidate="TextBox1" operator="DataTypeCheck" type="Date"> </asp:comparevalidator>
En TextBox, som skall innehålla datumet och en Button, som endast använts för att kunna ge en annan kontroll fokus, och en CompareValidator, vilket har möjligheten att validera att någon information är av av en speciell typ. (Den har även annan funktionalitet, som hörs av namnet.) Den här validatorn kontrollerar innehållet i Textboxen och kontrollerar om den är av typen Date.
I code-behind-filen:s Page_Load lägger vi in följande två rader:
Private Sub Page_Load(ByVal sender As System.Object, ByVal e As System.EventArgs) _ Handles MyBase.Load TextBox1.Text = DateTime.Now.ToShortDateString TextBox1.Attributes.Add("onChange", _ "validDate('" + CompareValidator1.ClientID + "')") End Sub
Den första raden skriver ut dagens datum i Textboxen. Den andra raden lägger till ett attribut i Textboxen. Attributet är en händelse, onChange, som när den utlöses, kör igång funktionen validateDate(), vilket är ett javascript som jag strax kommer att beskriva. Som argument till denna funktion har vi validatorns id. (CompareValidator genereras som en span-tag.)
Det sista som vi behöver göra, för att sparka igång validatorns valideringsfunktion när vi ändrar något i Textboxen, är ett javascript som implementerar validDate().
<script language="javascript"> <!-- function validDate(cvName) { var cv = document.getElementById(cvName); CompareValidatorEvaluateIsValid(cv); } //--> </script>
Skriptet gör två saker. För det första letar den fram vår valideringskontroll genom att leta upp kontrollen med dess namn. Namnet som vi skickade in med parametern cvName. Sedan kör vi igång validatorns valideringsfunktion CompareValidatorEvaluateIsValid() och skickar med valideringskontrollen som en parameter till denna.
Vart ligger CompareValidatorEvaluateIsValid() någonstans? Jo, denna funktion ligger i ett skript som installeras när .NET Framework installeras. Den installeras så att den kan användas av alla webbapplikationer som körs i IIS:en på datorn. Vanligtvis ligger den i katalogen C:\Inetpub\wwwroot\aspnet_client\system_web\1_1_4322 och heter WebUIValidation.js. Titta gärna igenom den filen. Det finns godbitar där som man kan ha nytta av.
Nu är det dags att kör igång och testa. Ange ett ej giltigt datum och tryck på TAB-tangenten för att förlyttas till nästa kontroll på sidan. Nu skall en röd text komma upp på skärmen. Den indikerar att datumet är ogiltigt.
Nu skall vi ändra våra inställningar för webbapplikationen så att vi istället kör med finskt datumformat. Det går att göra på flera sätt. Det enklaste är att öppna web.config och lägga till ett attribut i elementet globalization.
<globalization requestEncoding="utf-8" responseEncoding="utf-8" culture="fi-FI"/>
Nu kan du provköra det och se att valideringen av datumet även fungerar med ett annat datumformat.
Comments