Webcontrol input text mask

Question

I created a Usercontrol called Ucldatavigencia very simple. Only one label and two Texts input that will be responsible for receiving a start date and an end date. I would like to apply a mask to the date of type dd/mm/yyyy. I tried to use jQuery Maskinput, but to no avail. I found this link, but I was unsuccessful, it follows the code of Ucldatavigencia_portaltributario.ascx:

<%@ Control Language="C#" AutoEventWireup="true" CodeBehind="UclDataVigencia_PortalTributario.ascx.cs" Inherits="Web.Seguranca.UserControls.UclDataVigencia_PortalTributario" %>

<asp:Label ID="lb_msg" runat="server" Font-Bold="true">Data de Vigência (Mensagem de Observação)</asp:Label>

<asp:Label ID="lb_dataInicio" runat="server" Font-Bold="true">Data Início:</asp:Label><br />

<asp:TextBox ID="txt_dataInicio" runat="server" ToolTip="dd/mm/aaaa" Width="25%" CssClass="form-control" Enabled="true" ></asp:TextBox><br />

<asp:Label ID="lb_dataFim" runat="server" Font-Bold="true">Data Fim:</asp:Label><br />

<asp:TextBox ID="txt_dataFim" runat="server" ToolTip="dd/mm/aaaa" Width="25%" CssClass="form-control" Enabled="true"></asp:TextBox>

Answer 1

You could use javascript example:

<script language="JavaScript" type="text/javascript">
   function mascaraData(campoData){
              var data = campoData.value;
              if (data.length == 2){
                  data = data + '/';
                  document.forms[0].data.value = data;
      return true;              
              }
              if (data.length == 5){
                  data = data + '/';
                  document.forms[0].data.value = data;
                  return true;
              }
         }
</script>

Refer to your Textbox like this:

<asp:TextBox ID="txt_dataInicio" runat="server"
ToolTip="dd/mm/aaaa" Width="25%"
CssClass="form-control" Enabled="true"
OnKeyUp="mascaraData(this);" maxlength="10">
</asp:TextBox><br />