Validation

Now, since the user can write free text in the txtBirthDate input we need to validate if the date he intered is in the correct format.
To do so i will use the RegulaExpressionValidator.
lets write some regular expression to validate that date is in the dd.MM.yyy format...
^(((0[1-9]|[12]\d|3[01])\.(0[13578]|1[02])\.((1[6-9]|[2-9]\d)\d{2}))|((0[1-9]|[12]\d|30)\.(0[13456789]|1[012])\.((1[6-9]|[2-9]\d)\d{2}))|((0[1-9]|1\d|2[0-8])\.02\.((1[6-9]|[2-9]\d)\d{2}))|(29\.02\.((1[6-9]|[2-9]\d)(0[48]|[2468][048]|[13579][26])|((16|[2468][048]|[3579][26])00))))$


Oops! A little problem here: the validator functions are triggered by "onChange" event causing a bug

Frotunately there is a solution- The plugin have its own validator:

We have only to add two more js files:

<script src="/moia/jquery.datepick.package-3.5.2/jquery.validate.js" type="text/javascript"></script>

<script src="/moia/jquery.datepick.package-3.5.2/jquery.datepick-validation.js" type="text/javascript"></script>

{The order is important!}

and add to our code:

   23   $('#form1').validate({

   24   errorPlacement: $.datepick.errorPlacement,

   25   rules: {

   26       txtBirthDate: { dpMaxDate: [] }

   27   },

   28   messages: {

   29     txtBirthDate: '<span style="color:red">the date is incorrect or in future</span>'

   30   }

   31

   32   });


Now we almost got the thing working , only one imporatne thing left:
there must be the "name" attribute inside txtBirthDate control. (The name is not compatible tag for asp control so you will get warning)

<asp:TextBox ID="txtBirthDate" runat="server" Height="24px"  name="txtBirthDate">

Now the datepicker and validator should work.

Good