locked
Please explain how to use jQuery datepicker in my Dynamic Data project RRS feed

  • Question

  • User-753353512 posted

    So that a dummy can implement it. I went to the jQuery site and copied and pasted the code in a plain HTML file and it worked perfectly. However when I put the file references in my SiteMaster and the javascript in the Date_Time_Edit.ascx file nnothing happens.

    Please help a dummy. 

    You may get to heaven.

    Tuesday, October 29, 2013 11:35 AM

Answers

  • User697462465 posted

    Hi martin,

    I have test your code, and I have got two errors:

    1. Jquery can't get the textbox which ID is "datepicker", the reason is the clientID is"DateTime_Edit_datepicker", so I replace your javascript to with

    $("#<%=datepicker.ClientID %>").datepicker();

    2. Now your datepicker() also can't work, because in the usercontrol can't call the master page jquery library, so I have also refer these jquery library in the usercontrol:

    <%@ Control Language="C#" AutoEventWireup="true" CodeBehind="DateTime_Edit.ascx.cs" Inherits="JqueryFull.DateTime_Edit" %>
    <asp:TextBox ID="datepicker" runat="server" CssClass="DDTextBox" Columns="20"></asp:TextBox>
    <asp:RequiredFieldValidator runat="server" ID="RequiredFieldValidator1" CssClass="DDControl DDValidator" ControlToValidate="datepicker" Display="Static" Enabled="false" />
    <asp:RegularExpressionValidator runat="server" ID="RegularExpressionValidator1" CssClass="DDControl DDValidator" ControlToValidate="datepicker" Display="Static" Enabled="false" />
    <asp:DynamicValidator runat="server" ID="DynamicValidator1" CssClass="DDControl DDValidator" ControlToValidate="datepicker" Display="Static" />
    <asp:CustomValidator runat="server" ID="DateValidator" CssClass="DDControl DDValidator" ControlToValidate="datepicker" Display="Static" EnableClientScript="false" Enabled="false" OnServerValidate="DateValidator_ServerValidate" />
    <asp:DomainValidator runat="server" ID="DomainValidator1" CssClass="DDControl DDValidator" Display="Static"  />
    <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />
    <script src="http://code.jquery.com/jquery-1.9.1.js" type="text/javascript"></script>
    <script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js" type="text/javascript"></script>
      <script type="text/javascript">
          $(function () {
              $("#<%=datepicker.ClientID %>").datepicker();
          });
      </script>

    Now, it work fine.

    And there have a sample thread please refer to it:
    http://stackoverflow.com/questions/18794266/web-form-doesnt-call-jquery-library-when-its-using-a-master-page-but-works-with

    Hope it helps.

    Best Regards,
    Terry Guo

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Thursday, October 31, 2013 4:05 AM

All replies

  • User697462465 posted

    Hi martin,

    If you want to execute the jQuery code, you should to refer the jQuery master files, and if you have use the jQuery UI, you also add the jQuery UI package to your page.

    So, please confirm, you have not foget to refer the packages of jQuery.

    And if you can't found the reason of problem, please post your code for me.

    Hope it helps.

    Best Regards,

    Terry Guo

    Wednesday, October 30, 2013 12:58 AM
  • User-753353512 posted

    These are the file references in Site.master:

    <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />
    <script src="http://code.jquery.com/jquery-1.9.1.js" type="text/javascript"></script>
    <script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js" type="text/javascript"></script>

    This is the javascript in DateTime_Edit.ascx:

    <%@ Control Language="C#" CodeBehind="DateTime_Edit.ascx.cs" Inherits="sims.DateTime_EditField" %>
    
    <asp:TextBox ID="datepicker" runat="server" CssClass="DDTextBox" Text='<%# FieldValueEditString %>' Columns="20"></asp:TextBox>
    <asp:RequiredFieldValidator runat="server" ID="RequiredFieldValidator1" CssClass="DDControl DDValidator" ControlToValidate="datepicker" Display="Static" Enabled="false" />
    <asp:RegularExpressionValidator runat="server" ID="RegularExpressionValidator1" CssClass="DDControl DDValidator" ControlToValidate="datepicker" Display="Static" Enabled="false" />
    <asp:DynamicValidator runat="server" ID="DynamicValidator1" CssClass="DDControl DDValidator" ControlToValidate="datepicker" Display="Static" />
    <asp:CustomValidator runat="server" ID="DateValidator" CssClass="DDControl DDValidator" ControlToValidate="datepicker" Display="Static" EnableClientScript="false" Enabled="false" OnServerValidate="DateValidator_ServerValidate" />
    <asp:DomainValidator runat="server" ID="DomainValidator1" CssClass="DDControl DDValidator" Display="Static" />
    
      <script type="text/javascript">
      	$(function () 
    	{
      		$("#datepicker").datepicker();
      	});
      </script>

    Hope this helps you to help me. 


    Thursday, October 31, 2013 1:05 AM
  • User697462465 posted

    Hi martin,

    I have test your code, and I have got two errors:

    1. Jquery can't get the textbox which ID is "datepicker", the reason is the clientID is"DateTime_Edit_datepicker", so I replace your javascript to with

    $("#<%=datepicker.ClientID %>").datepicker();

    2. Now your datepicker() also can't work, because in the usercontrol can't call the master page jquery library, so I have also refer these jquery library in the usercontrol:

    <%@ Control Language="C#" AutoEventWireup="true" CodeBehind="DateTime_Edit.ascx.cs" Inherits="JqueryFull.DateTime_Edit" %>
    <asp:TextBox ID="datepicker" runat="server" CssClass="DDTextBox" Columns="20"></asp:TextBox>
    <asp:RequiredFieldValidator runat="server" ID="RequiredFieldValidator1" CssClass="DDControl DDValidator" ControlToValidate="datepicker" Display="Static" Enabled="false" />
    <asp:RegularExpressionValidator runat="server" ID="RegularExpressionValidator1" CssClass="DDControl DDValidator" ControlToValidate="datepicker" Display="Static" Enabled="false" />
    <asp:DynamicValidator runat="server" ID="DynamicValidator1" CssClass="DDControl DDValidator" ControlToValidate="datepicker" Display="Static" />
    <asp:CustomValidator runat="server" ID="DateValidator" CssClass="DDControl DDValidator" ControlToValidate="datepicker" Display="Static" EnableClientScript="false" Enabled="false" OnServerValidate="DateValidator_ServerValidate" />
    <asp:DomainValidator runat="server" ID="DomainValidator1" CssClass="DDControl DDValidator" Display="Static"  />
    <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />
    <script src="http://code.jquery.com/jquery-1.9.1.js" type="text/javascript"></script>
    <script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js" type="text/javascript"></script>
      <script type="text/javascript">
          $(function () {
              $("#<%=datepicker.ClientID %>").datepicker();
          });
      </script>

    Now, it work fine.

    And there have a sample thread please refer to it:
    http://stackoverflow.com/questions/18794266/web-form-doesnt-call-jquery-library-when-its-using-a-master-page-but-works-with

    Hope it helps.

    Best Regards,
    Terry Guo

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Thursday, October 31, 2013 4:05 AM