Christopher Bergin 1 Posted January 8, 2013 Report Share Posted January 8, 2013 Am I approaching this correctly? I'm trying to produce a datepicker widget but it's not working. Here is the code: <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8"/> </head> <body> <h1>This is a JQuery test of it's plug-ins</h1> <a href='' id= 'dateInput'><p id= 'pickOne'>Please select a date</p></a> <script src= 'utilities/jquery-1.8.3.js'></script> <script src= 'utilities/jquery-ui-1.9.2.custom.min.js'></script> <script src= 'utilities/jquery.ui.datepicker.js'></script> <script type= 'text/javascript'>$('#dateInput').onclick(function(){$('#pickOne').datepicker();})</script> </body> </html> Quote Link to post Share on other sites
HartleySan 826 Posted January 8, 2013 Report Share Posted January 8, 2013 Is this enough? http://jqueryui.com/datepicker/ Quote Link to post Share on other sites
benjamin.morgan 6 Posted January 8, 2013 Report Share Posted January 8, 2013 jQuery (don't forget the document.ready function. <script type= 'text/javascript'> $(document).ready(function() { $('#datepicker').datepicker(); }); </script> HTML Date: <input type="text" id="datepicker" value="Please select a date!"> Quote Link to post Share on other sites
HartleySan 826 Posted January 8, 2013 Report Share Posted January 8, 2013 The ready method is not required, but yes, it doesn't hurt to use it in this case. Quote Link to post Share on other sites
benjamin.morgan 6 Posted January 8, 2013 Report Share Posted January 8, 2013 I like to be safe than sorry, there has been plenty of times when I forgot that little function and couldn't get the script to work.. Even when I tested it it wouldn't work without the ready function. @Christoper, don't forget you can shorten the ready function to this if you like. $(function() { }); Basically the point of the post was to have an input element not a paragraph element. Quote Link to post Share on other sites
HartleySan 826 Posted January 8, 2013 Report Share Posted January 8, 2013 I rarely use jQuery, so I'm not sure why your scripts sometimes don't work without the ready method, but no script should ever be dependent on the ready method. The only thing the ready method really gives you is the ability to set up event handlers slightly sooner than you'd be able to with the standard onload event handler. If anything, using the ready method could cause issues that otherwise wouldn't be present. Quote Link to post Share on other sites
Christopher Bergin 1 Posted January 8, 2013 Author Report Share Posted January 8, 2013 well, I was able to go to the site and copy the code. The syntax was pretty much correct, the problem was the input type I was using. After some testing using different input methods and inline JS events, it seems the widget only responds to input type of text. Quote Link to post Share on other sites
benjamin.morgan 6 Posted January 8, 2013 Report Share Posted January 8, 2013 Which you can set a preset text before they enter a date as the value of the input. <!-- Will change when they click a date --> Date: <input type="text" id="datepicker" value="Please select a date!"> Quote Link to post Share on other sites
HartleySan 826 Posted January 8, 2013 Report Share Posted January 8, 2013 Christopher, I suppose it makes sense that the date picker can only be attached to a text input. With that said, I imagine that the date picker library could be easily edited to allow you to attach the onclick event handler to other kinds of elements. Quote Link to post Share on other sites
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.