jQuery calender

hey folks,
i m trying to append months short type with jQuery Datepicker

	<script type="text/javascript">
	$(function() {
		$("#datepicker").datepicker();
		$("#format").change(function() { $('#datepicker').datepicker('option', {dateFormat: $(this).val()}); });
	});
	</script>

now it says if u wanna get months short it should be
$( “.selector” ).datepicker({ dayNamesShort: [‘Dim’, ‘Lun’, ‘Mar’, ‘Mer’, ‘Jeu’, ‘Ven’, ’
how do i append to my function?

my bad, while tryping in here, i had typo, still with monthNamesShort, its not working do i append a format too? can u gimme a working example?

Have a look at the documentation relating to monthNamesShort and note the spelling.

Could it be that if you give it only the first three months, it resorts to using numeric representations for some of the months?

Try providing 12 names for the months.

Well there are a large number of books that you can learn from, but to hep whittle down the list, there is a very good thread on JavaScript books that you’ll find stickied at the top of the JavaScript forum.

so what main part of JS should i hit on. i mean to get started fast as easy

Making the change means updating one part of your code.

Can you work it out, knowing that #datepicker is your selector?

yes its working but i donno how to append the shortmonths option

Look at these two lines of code, and see if you can work it out.


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


$( ".selector" ).datepicker({ dayNamesShort: ['Dim', 'Lun', 'Mar', 'Mer', 'Jeu', 'Ven', ...]});

well i set the option of .datepicker like this


<script language="text/javascript">
$(function(){
$(#HandOver).datepicker({
showOn:'button',
button:'path to my image',
buttonImageOnly:true,
monthNameShort:['jan','feb','march']
});
});

every is working expect the monthNameShort, coz the months selected are displayed in numeric and not in words. why?

that was a example i created. actually they are 12 but not working :frowning: i want to display date as ‘Aug 10 2007’

Ah thanks! a lot mate

Go to the documentation for datepicker, and in the Options, select dateFormat.

You will see that it’s specified in the same manner that you have already used for showOn and buttonImage.
See the end of my previous post where I copy/pasted an example from working code.

As you might imagine, we find that the documentation becomes a very useful tool.
It can also make for an effective weapon too when printed and bound :slight_smile:

And even though we sometimes poke the stick at designers [dilbert], you do tend to do [url=“http://www.dilbert.com/fast/2002-09-23/”]much better than us engineers [dilbert].

still not working :rolleyes:


                    <script type="text/javascript">
                    $(function() {
                        $("#txtHandOver").datepicker
                        ({
                        showOn: 'button',
                        buttonImage: 'img/calendar.png',
                        buttonImageOnly: true,
                        changeMonth: false,
                        changeYear: true
                        }).dateFormar('M-dd-yy')
                        });
                    </script>

though i am a designer, i can pass it on to the engineering guy bt i wanna know myself too

Ahh good, now we’re getting down to the crux of the matter.

There is a misunderstanding going on here. The monthNames and monthNamesShort are not intended to change how the date appears in your text field. Their purpose is for internationalisation, so that you can specify a French spelling, or Japanese spelling for the months.

To change the way that the date is presented in the form field, you should be using the dateFormat option

For example:

dateFormat: ‘M d, yy’

will try, on a short note what should i be needing to be good at jQuery. ?i know css, html.

That’s right. jQuery is nothing more than well-written JavaScript.

For example, here is the hide function:


hide: function( speed, callback ) {
	if ( speed || speed === 0 ) {
		return this.animate( genFx("hide", 3), speed, callback);
	} else {
		for ( var i = 0, l = this.length; i < l; i++ ) {
			var old = jQuery.data(this[i], "olddisplay");
			if ( !old && old !== "none" ) {
				jQuery.data(this[i], "olddisplay", jQuery.css(this[i], "display"));
			}
		}
		// Set the display of the elements in a second loop
		// to avoid the constant reflow
		for ( var j = 0, k = this.length; j < k; j++ ) {
			this[j].style.display = "none";
		}
		return this;
	}
},

Yes you can. showOn is one option, buttonImage is another option, and buttonImageOnly is yet another option.

Currently you have the equivalent of:

({
    foo: 'bar',
    baz: 'bat',
    bar: true
});

dayNamesShort goes on the left of the colon, and [‘Dim’, ‘Lun’, …] goes on the right of the colon.

Don’t forget that they are comma separated, which means ensuring there is a comma at the end of all of them, except for the last one.

here is my code,

	<script type="text/javascript">
	$(function() {
		$("#datepicker").datepicker({
			showOn: 'button',
			buttonImage: 'images/calendar.gif',
			buttonImageOnly: true
		});
	});
	</script>

i can’t append the shortmonth function in this

jQuery is just a framework nothing more than pure JavaScript. jQuery can be considered to be a framework.