Jquery Datepicker ( Error: Object doesn't support property or method 'datepicker' )

Question

User2037455357 posted

Hello there

I am having a bit of trouble implementing a datapicker into a textbox.

this is my textbox

<asp:TextBox ID="RiskAss_DateofCorporation_TxtBox" runat="server" height="20px" Width="100px" Style ="margin-top:3px; border:none;"></asp:TextBox>

this is my jscript references and datapicker script

    <script src="js/bootstrap.min.js"></script>   
<link href="css/bootstrap.min.css" rel="stylesheet" /> 

<link rel="stylesheet" href="https://code.jquery.com/ui/1.12.0/themes/base/jquery-ui.css">
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://code.jquery.com/ui/1.12.0/jquery-ui.js"></script>


 <script>
     $(document).ready(function () {
         $('#RiskAss_DateofCorporation_TxtBox').datepicker({
             dateFormat: 'dd/mm/yy'
         });
     });
</script>

when the page loads I get the following message.

Error: Object doesn't support property or method 'datepicker'

I have search about for this but most examples are the same but no luck

Regards

Rob

Answer 1

User475983607 posted

This is an extremely common error that usually means you are trying to invoke the datepicker() before the library is loaded or your selector is incorrect.

$('#<%=RiskAss_DateofCorporation_TxtBox.ClientID%>').datepicker({
	 dateFormat: 'dd/mm/yy'
});

Answer 2

User288213138 posted

Hi masterdineen,

I ran the code you posted, but it works fine in my side. Is your code complete?

Please check if there are different versions of js references in your code.

I tested result:

Best regards,

Sam

Answer 3

User2037455357 posted

Hi all.  I managed to find an example and I got it working on a new aspx page.

so it looks like I was referencing more than one version of a js, I shall confirm definitely later on when I get in and post my working version.

Just for reference this was the example I used and it worked fine.

https://jqueryui.com/datepicker/

Regards

Rob

Answer 4

User2037455357 posted

I managed to get it working using your advice

thank you,

also I was referencing a different version of Jquery in my master file, so that also needs to be the same version as you are using for the datepicker.

the below shows examples of both Input and textbox example.

<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">


  <script src="https://code.jquery.com/jquery-1.12.4.js"></script>

  <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>

  <script>

      $(function () {
          $('#<%=TextBox1.ClientID%>').datepicker();
      });

      $(function () {

          $("#datepicker-1").datepicker();

      });


  </script>



   

      <!-- HTML --> 
      <input type = "text" placeholder="Select a Date" id = "datepicker-1">
    <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>