C# The object [textBox] does not support the 'datepicker' property or method

▲
0
▼

I'm having trouble with an association of a textbox with a datapicker. Error:

Unhandled exception at line 60, column 13 in http://localhost:54293/my-path/my-file.aspx 0x800a01b6 - JavaScript runtime error: The object does not support the 'datepicker' property or method occurred

I need to associate a data picker to a textbox for a report that I'm building. I can just type the date, but it's easier for my users to pick directly from a calendar.

heres my code:

<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
<meta http-equiv="x-ua-compatible" content="IE=9"/>
    <link href="../../../Css/formulario.css" type="text/css" rel="stylesheet" />
    <link href="../../../Css/principal.css" type="text/css" rel="stylesheet" />
    <link href="../../../Css/jQuery/themes/base/jquery-ui.css" rel="stylesheet" type="text/css" />
    <script type="text/javascript" src="../../../Lib/Client/jQuery/jquery-1.11.3.js"></script>
    <script type="text/javascript" src="../../../Lib/Client/jQuery/jquery-ui-1.11.4.js"></script>
    <script type="text/javascript" language="javascript" src="../../../Lib/Client/service.js"></script>
    <script type="text/javascript" language="javascript">

       
        function initScript() {
            // Recupera ação informada no codebehind
            var hdfAcaoRelatorio = document.getElementById("hdfAcaoRelatorio");
            // Verifica se o relatório deve ser gerado
            if (hdfAcaoRelatorio.value.toUpperCase() == "GERARRELATORIO") {
                gerarRelatorio();
                hdfAcaoRelatorio.value = "";
            }
        }

       
        $(document).ready(function () {
            carregarControles();
        });


        function terminarRequisicao() {
            carregarControles();
        }

      
        function carregarControles() {
            $("[id$=txtDataInicial]").datepicker({
                dateFormat: 'dd/mm/yy',
                dayNames: ['Domingo', 'Segunda', 'Terça', 'Quarta', 'Quinta', 'Sexta', 'Sábado'],
                dayNamesMin: ['D', 'S', 'T', 'Q', 'Q', 'S', 'S', 'D'],
                dayNamesShort: ['Dom', 'Seg', 'Ter', 'Qua', 'Qui', 'Sex', 'Sáb', 'Dom'],
                monthNames: ['Janeiro', 'Fevereiro', 'Março', 'Abril', 'Maio', 'Junho', 'Julho', 'Agosto', 'Setembro', 'Outubro', 'Novembro', 'Dezembro'],
                monthNamesShort: ['Jan', 'Fev', 'Mar', 'Abr', 'Mai', 'Jun', 'Jul', 'Ago', 'Set', 'Out', 'Nov', 'Dez'],
                nextText: 'Próximo',
                prevText: 'Anterior',
                beforeShow: function (input, inst) {
                    setTimeout(function() {
                        inst.dpDiv.find('a.ui-state-highlight').removeClass('ui-state-highlight');
                    }, 100);
                }
            });

            $("[id$=txtDataFinal]").datepicker({
                dateFormat: 'dd/mm/yy',
                dayNames: ['Domingo', 'Segunda', 'Terça', 'Quarta', 'Quinta', 'Sexta', 'Sábado'],
                dayNamesMin: ['D', 'S', 'T', 'Q', 'Q', 'S', 'S', 'D'],
                dayNamesShort: ['Dom', 'Seg', 'Ter', 'Qua', 'Qui', 'Sex', 'Sáb', 'Dom'],
                monthNames: ['Janeiro', 'Fevereiro', 'Março', 'Abril', 'Maio', 'Junho', 'Julho', 'Agosto', 'Setembro', 'Outubro', 'Novembro', 'Dezembro'],
                monthNamesShort: ['Jan', 'Fev', 'Mar', 'Abr', 'Mai', 'Jun', 'Jul', 'Ago', 'Set', 'Out', 'Nov', 'Dez'],
                nextText: 'Próximo',
                prevText: 'Anterior',
                beforeShow: function (input, inst) {
                    setTimeout(function () {
                        inst.dpDiv.find('a.ui-state-highlight').removeClass('ui-state-highlight');
                    }, 100);
                }
            });
        }

    </script>
    <style type="text/css">
        
        .ui-datepicker {
            font: 9pt Verdana;
        }
        
    </style>
</head>

<body>
<table style="width: 980px" id="Table11" cellspacing="6" cellpadding="0" border="0">
  <tbody>
      <tr>
          <td style="width: 160px">
              <asp:Label ID="lblAno" runat="server" CssClass="labelControlMenor">Período:</asp:Label></td>
          <td style="width: 820px" colspan="2" valign="top">
              <asp:TextBox ID="txtDataInicial" runat="server" CssClass="textField" 
                  MaxLength="10" Width="73px"></asp:TextBox>
              <ajaxtoolkit:MaskedEditExtender ID="mxtDataInicial" runat="server" 
                  Mask="99/99/9999" MaskType="Date" TargetControlID="txtDataInicial">
              </ajaxtoolkit:MaskedEditExtender>
              &nbsp;à &nbsp;<asp:TextBox ID="txtDataFinal" runat="server" CssClass="textControl" 
                  MaxLength="10" Width="73px"></asp:TextBox>
              <ajaxtoolkit:MaskedEditExtender ID="mxtDataFinal" runat="server" 
                  Mask="99/99/9999" MaskType="Date" TargetControlID="txtDataFinal">
              </ajaxtoolkit:MaskedEditExtender>
              <asp:RangeValidator ID="rgvDataInicial" runat="server" 
                  ControlToValidate="txtDataInicial" Display="None" 
                  ErrorMessage="- &lt;b&gt;DATA INICIAL&lt;/b&gt; inválida." ForeColor=" " 
                  MaximumValue="01/01/3000" MinimumValue="01/01/1900" Type="Date"></asp:RangeValidator>
              <asp:RangeValidator ID="rgvDataFinal" runat="server" 
                  ControlToValidate="txtDataFinal" Display="None" 
                  ErrorMessage="- &lt;b&gt;DATA FINAL&lt;/b&gt; inválida." ForeColor=" " 
                  MaximumValue="01/01/3000" MinimumValue="01/01/1900" Type="Date"></asp:RangeValidator>
              <asp:RequiredFieldValidator ID="rfvDataInicial" runat="server" 
                  ControlToValidate="txtDataInicial" Display="Dynamic" 
                  ErrorMessage="- &lt;b&gt;DATA INICIAL&lt;/b&gt; obrigatória." 
                  CssClass="mensagemErro" ForeColor=""></asp:RequiredFieldValidator>
              <asp:RequiredFieldValidator ID="rfvDataFinal" runat="server" 
                  ControlToValidate="txtDataFinal" Display="Dynamic" 
                  ErrorMessage="- &lt;b&gt;DATA FINAL&lt;/b&gt; obrigatória." 
                  CssClass="mensagemErro" ForeColor=""></asp:RequiredFieldValidator>
              <asp:Label ID="lblErroData" runat="server" CssClass="mensagemErro" 
                  Visible="False"></asp:Label>
          </td>
      </tr>
  </tbody>
</table>
</body>

javascript
c#
asp.net
asked on Stack Overflow Feb 20, 2020 by hilario_cassio

1 Answer

▲
0
▼

Why you trying selector to get object like that? I think you can use just # for your id.

$("#txtDataFinal").datepicker()
answered on Stack Overflow Feb 20, 2020 by Cafer Aydın

User contributions licensed under CC BY-SA 3.0