We launched new forums in March 2019—join us there. In a hurry for help with your website? Get Help Now!
    • 24969
    • 120 Posts
    I am trying to get the datepicker from the manager side to show in the end user side....
    But alas, I can not get it to work.... I know even less javascript then I do php.... If you can beleive that....
    My chunk is as follows;
    <p class="error" style="text-align: left;">[+validationmessage+]</p>
    <form id="AppointmentForm" style="text-align: left;" action="[~[*id*]~]" method="post">
    <script src="media/script/mootools/mootools.js" type="text/javascript"></script>
    <script src="media/script/mootools/moodx.js" type="text/javascript"></script>
    <fieldset>
                    <legend><strong>Step One: Personal Information</strong></legend>
                    <label>Name: <input name="cfName" type="text" /></label>
                    <label>Last name: <input name="cfLast" size="25" type="text" /></label>
                    <label>Address: <input name="cfAddress" size="45" type="text" /></label>
                    <label>City: <input name="cfCity" size="15" type="text" /></label>
                    <label>Province: <input name="cfProvince" size="5" type="text" /></label>
                    <label>Postal Code: <input name="cfPostalCode" size="10" type="text" /></label>
                    <label>Phone: <input name="cfPhone" size="13" type="text" /></label>
                </fieldset>
              <fieldset>  
                     <legend><strong>Step Two: Tell us what time and date you would like to visit.</strong></legend>
                     <label>Time: <select name="cfTime">
                                              <option>10:00AM</option>
                                              <option>10:30AM</option>
                                              <option>11:00AM</option>
                                              <option>11:30AM</option>
                                              <option>12:00PM</option>
                                              <option>12:30PM</option>
                                              <option>1:00PM</option>
                                              <option>1:30PM</option>
                                              <option>2:00PM</option>
                                              <option>2:30PM</option>
                                              <option>3:00PM</option>
                                              <option>3:30PM</option>
                                              <option>4:00PM</option>
                                      </select></label>
    <!-- Loading Theme file(s) -->
    <script src="media/calendar/datepicker.js" type="text/javascript"></script>
    <script type="text/javascript">// <![CDATA[
    window.addEvent('domready', function(){
    	var dpOffset = -10;
    	var dpformat = "dd-mm-YYYY" + ' hh:mm:00';
    	new DatePicker($('adate'), {'yearOffset': dpOffset,'format':dpformat});
    	
    	if( !window.ie6 ) {
    	    $$('img[src=media/style/MODxCarbon/images/icons/b02_trans.gif]').each(function(help_img) {
                help_img.removeProperty('onclick');
                help_img.removeProperty('onmouseover');
                help_img.removeProperty('onmouseout');
                help_img.setProperty('title', help_img.getProperty('alt') );
                help_img.setProperty('class', 'tooltip' ); 
    	    });
    	    new Tips($$('.tooltip'),{className:'custom'} );
    	}
    });
    // ]]></script>
    <label>Date you would like to come:<input id="adate" name="adate" class="DatePicker" value="" onblur="documentDirty=true;" />
    </label>...


    Can I have some one look at the chunk above and let me know what I have done/am doing wrong?
      The important thing is not to stop questioning. Curiosity has its own reason for existing. One cannot help but be in awe when he contemplates the mysteries of eternity, of life, of the marvelous structure of reality. It is enough if one tries merely to comprehend a little of this mystery every day. Never lose a holy curiosity.

      -Albert Einstein (1879 - 1955)

      Apache/2.2.11 (Unix) mod_ssl/2.2.11 OpenSSL/0.9.8e-fips-rhel5 DAV/2 mod_auth_passthrough/2.1 mod_bwlimited/1.4 FrontPage/5.0.2.2635
      • 27330
      • 884 Posts
      what version are you using?
      in 0.9.6.3 I think the you also need the file
      media/script/datefunctions.js but not sure.

      anyway why not using some other date pickers with better functionality like this one?
      http://www.electricprism.com/aeron/calendar/

      super easy to use and setup. Someone on the forum posted the link once since then it’s the only one I use. One feature I really like is that you can block specific dates from being selected like holidays etc.

        • 24969
        • 120 Posts
        OK... I just thought since the one that comes with modx would suffice.... OK.... So how do I install it? How do I get it working?
          The important thing is not to stop questioning. Curiosity has its own reason for existing. One cannot help but be in awe when he contemplates the mysteries of eternity, of life, of the marvelous structure of reality. It is enough if one tries merely to comprehend a little of this mystery every day. Never lose a holy curiosity.

          -Albert Einstein (1879 - 1955)

          Apache/2.2.11 (Unix) mod_ssl/2.2.11 OpenSSL/0.9.8e-fips-rhel5 DAV/2 mod_auth_passthrough/2.1 mod_bwlimited/1.4 FrontPage/5.0.2.2635
          • 27330
          • 884 Posts
          http://www.electricprism.com/aeron/calendar/#manual

          pretty straight forward IMHO, if not working post a link for the page if you can.
            • 10487 MODX Staff
            • 1,535 Posts
            Can I have some one look at the chunk above and let me know what I have done/am doing wrong?
            Your path to the DatePicker JS is wrong, it needs to be:
            manager/media/calendar/datepicker.js

            Also, I don’t think you need the moodx.js call in there, unless you’re using it specifically (it’s not needed for the DatePicker).

            And, to get the calendar fully working, you will also need the CSS to go with the calendar - look in the manager’s style.css to get the most up-to-date version (not the CSS in the calendar folder), the CSS for the DatePicker is right towards the bottom of the stylesheet. The CSS may need some tweaking to get it working on the front-end of the site, but I shouldn’t imagine it will be too drastic.
              Garry Nutting
              Senior Developer
              MODX, LLC

              Email: [email protected]
              Twitter: @garryn
              Web: modx.com
              • 24969
              • 120 Posts
              Thanks Gary. That did the trick....
                The important thing is not to stop questioning. Curiosity has its own reason for existing. One cannot help but be in awe when he contemplates the mysteries of eternity, of life, of the marvelous structure of reality. It is enough if one tries merely to comprehend a little of this mystery every day. Never lose a holy curiosity.

                -Albert Einstein (1879 - 1955)

                Apache/2.2.11 (Unix) mod_ssl/2.2.11 OpenSSL/0.9.8e-fips-rhel5 DAV/2 mod_auth_passthrough/2.1 mod_bwlimited/1.4 FrontPage/5.0.2.2635