Skip to content
  • Categories
  • Recent
  • Tags
  • Popular
  • World
  • Users
  • Groups
Skins
  • Light
  • Cerulean
  • Cosmo
  • Flatly
  • Journal
  • Litera
  • Lumen
  • Lux
  • Materia
  • Minty
  • Morph
  • Pulse
  • Sandstone
  • Simplex
  • Sketchy
  • Spacelab
  • United
  • Yeti
  • Zephyr
  • Dark
  • Cyborg
  • Darkly
  • Quartz
  • Slate
  • Solar
  • Superhero
  • Vapor

  • Default (No Skin)
  • No Skin
Collapse
Code Project
CODE PROJECT For Those Who Code
  • Home
  • Articles
  • FAQ
Community
  1. Home
  2. Web Development
  3. ASP.NET
  4. DatePicker using JQuery

DatePicker using JQuery

Scheduled Pinned Locked Moved ASP.NET
javascripthelpcssdesignsysadmin
3 Posts 2 Posters 0 Views 1 Watching
  • Oldest to Newest
  • Newest to Oldest
  • Most Votes
Reply
  • Reply as topic
Log in to reply
This topic has been deleted. Only users with topic management privileges can see it.
  • K Offline
    K Offline
    klaydze
    wrote on last edited by
    #1

    Hi, Im using datepicker using standalone jquery. The datepicker works perfectly in WebForm. Now i decided to use a site master on my sample project and I add some web content form also inside the site.master. In my web content form i add search function with date range. Now, the problem was, after using web content form, datepicker no longer showing the icon "..." beside my asp:textbox. Please see below tags in my site.Master page.

    <asp:ScriptManager ID="ScriptManager1" runat="server">
    <Scripts>
    <asp:ScriptReference Path="~/scripts/datepickerjs/jquery-1.3.1.min.js" />
    <asp:ScriptReference Path="~/scripts/datepickerjs/jquery-ui-1.7.1.custom.min.js" />
    <asp:ScriptReference Path="~/scripts/datepickerjs/daterangepicker.jQuery.js" />
    </Scripts>
    </asp:ScriptManager>

    i also place the css in site.master inside the head tag.

    <link rel="Stylesheet" type="text/css" href="style/datepickercss/ui.daterangepicker.css" />
    <link rel="Stylesheet" type="text/css" href="style/datepickercss/redmond/jquery-ui-1.7.1.custom.css" title="ui-theme" />

    In my web content form i place the script after the asp:Content tag.

    <script type="text/jscript">
        $(function() {
            $("#txtDateFrom").datepicker({
                changeMonth: true,
                changeYear: true,
                buttonText: 'Select Date From',
                buttonImage: 'images/calendar.gif',
                buttonImageOnly: true,
                showOn: 'button'
            });
        });
        
        $(function() {
            $("#txtDateTo").datepicker({
                changeMonth: true,
                changeYear: true,
                buttonText: 'Select Date To',
                buttonImage: 'images/calendar.gif',
                buttonImageOnly: true,
                showOn: 'button'
            });
        }); 
    </script>
    

    Finally, when i run my project the "..." is not showing. Normally, when i used web form this "..." will show and i can select a date, but now after switching to web content form, "..." is no longer visible. Thanks

    if(you type your code here) { Messagebox.Show("You help me a lot!"); } else { You help me = null; }

    B 1 Reply Last reply
    0
    • K klaydze

      Hi, Im using datepicker using standalone jquery. The datepicker works perfectly in WebForm. Now i decided to use a site master on my sample project and I add some web content form also inside the site.master. In my web content form i add search function with date range. Now, the problem was, after using web content form, datepicker no longer showing the icon "..." beside my asp:textbox. Please see below tags in my site.Master page.

      <asp:ScriptManager ID="ScriptManager1" runat="server">
      <Scripts>
      <asp:ScriptReference Path="~/scripts/datepickerjs/jquery-1.3.1.min.js" />
      <asp:ScriptReference Path="~/scripts/datepickerjs/jquery-ui-1.7.1.custom.min.js" />
      <asp:ScriptReference Path="~/scripts/datepickerjs/daterangepicker.jQuery.js" />
      </Scripts>
      </asp:ScriptManager>

      i also place the css in site.master inside the head tag.

      <link rel="Stylesheet" type="text/css" href="style/datepickercss/ui.daterangepicker.css" />
      <link rel="Stylesheet" type="text/css" href="style/datepickercss/redmond/jquery-ui-1.7.1.custom.css" title="ui-theme" />

      In my web content form i place the script after the asp:Content tag.

      <script type="text/jscript">
          $(function() {
              $("#txtDateFrom").datepicker({
                  changeMonth: true,
                  changeYear: true,
                  buttonText: 'Select Date From',
                  buttonImage: 'images/calendar.gif',
                  buttonImageOnly: true,
                  showOn: 'button'
              });
          });
          
          $(function() {
              $("#txtDateTo").datepicker({
                  changeMonth: true,
                  changeYear: true,
                  buttonText: 'Select Date To',
                  buttonImage: 'images/calendar.gif',
                  buttonImageOnly: true,
                  showOn: 'button'
              });
          }); 
      </script>
      

      Finally, when i run my project the "..." is not showing. Normally, when i used web form this "..." will show and i can select a date, but now after switching to web content form, "..." is no longer visible. Thanks

      if(you type your code here) { Messagebox.Show("You help me a lot!"); } else { You help me = null; }

      B Offline
      B Offline
      bVagadishnu
      wrote on last edited by
      #2

      klaydze wrote:

      $("#txtDateFrom").datepicker({

      Using a MasterPage will change the id. You may want to try

      $("[id$='txtDateFrom']").

      to get the id that ends in txtDateFrom [Edit for correct punctuation]

      K 1 Reply Last reply
      0
      • B bVagadishnu

        klaydze wrote:

        $("#txtDateFrom").datepicker({

        Using a MasterPage will change the id. You may want to try

        $("[id$='txtDateFrom']").

        to get the id that ends in txtDateFrom [Edit for correct punctuation]

        K Offline
        K Offline
        klaydze
        wrote on last edited by
        #3

        Hi bVagadishnu, You help me alot. Works perfectly!!! Thanks

        if(you type your code here) { Messagebox.Show("You help me a lot!"); } else { You help me = null; }

        1 Reply Last reply
        0
        Reply
        • Reply as topic
        Log in to reply
        • Oldest to Newest
        • Newest to Oldest
        • Most Votes


        • Login

        • Don't have an account? Register

        • Login or register to search.
        • First post
          Last post
        0
        • Categories
        • Recent
        • Tags
        • Popular
        • World
        • Users
        • Groups