12/31/09

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"></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

No comments:

Post a Comment

Getting started with docker

It is very simple to get started usig docker. All you need to do-is download the docker desktop for your system Once you get docker syste...