Make input field jquery ui datepicker editable - javascript

I've scanned trough the documentation but I can't find out how I to get the field to get the datepickers value AND let it be editable using my keyboard numpad. So filling/editing the date without using the datepicker.
I hope my question is clear cause I don't know how the formulate it otherwise.

It is already ( see http://jqueryui.com/demos/datepicker/ ) editable.

Related

How to close html date picker programmatically using vanilla JS or CSS?

Is it possible to close the browser's native HTML date picker using any vanilla JS methods? I'm referring to a native datetime picker like this one
gotten from here. I've tried different things and seen different suggestions including changing the type of the input field, setting display: none on the input field, replacing the input field (node.outerHTML = node.outerHTML), blurring the input field (node.blur()), setting its value to an empty string, and giving it type="hidden". But none of these have worked. Whatever change I make to the element in the DOM, the native picker is unaffected and remains on the screen.
Any ideas for how to achieve this? The solution must work on Android. Thanks!

Multiple jqGrid on the same page with filterToolbar option for date fields

I am having some trouble with getting 2 jqGrids working on the same page. Each of these grid contains a Date Field with the exact same name.
I have configured the filterToolbar option using jquery datepicker. After selecting a date from the second grid, the value gets populated back to the first grid.
Here's the jsFiddle:
http://jsfiddle.net/g2oo5nhc/8/
I think this might be an ID collision problem. Is this a bug? Or is there something wrong with my set up?
If this is indeed a bug, is there any workarounds for this problem?

Issue with spry validation from a dynamically updated input field vai javascript

I have a form on my website that uses spry validation widgets. I have recently added a date feature that uses 3 drop down boxes (day, month, year). I've used the onchange feature of the selection boxes to update a text field with the date and used spry validation on that input box to make sure its a valid date.
The JavaScript update function works but the spry does not consider the input text field changed. If I manually input the same date in the same format into the field the validation works, it's just when the field is changed dynamically via JavaScript that it does not work.
Any ideas why this is happening and how to fix it?
Here's what worked for me:
Say you have sprytextfield1 as the variable for your validation text field. Then use
sprytextfield1.removeHint()
sprytextfield1.setValue('your value goes here')
sprytextfield1.validate()
I figured it out. When I finish updating the input field via javascript I needed to add this line of text to trigger the spry validation.
spryNameofSpry.validate();
Hope this helps someone someday.

option to change jquery ui datepicker to just a "yearpicker"

I'm checking datapicker documentation here trying to find a way to change it from a full display date picker to just something where I can pick a year only. But I can't find anything. I tried suggestions found here like this, but it still displays the full view.
.datepicker({changeDay:false, changeMonth:false, changeYear:true})
Can I somehow turn the datapicker to a year picker only?
For my company's website, we used jQuery UI slider instead since year is a single value. In our implementation, we also had to do a year range, a slider also accommodated for that.
http://jqueryui.com/demos/slider/#steps

Prevent form field to be edited without disabling field

I am currently working on a page that has a date picker for one of the field.
One of the requirements by my client is to prevent the user from editing the field manually. Only the date picker would be possible to be used. (jQuery DatePicker)
I had in mind to disable the field and use an hidden field to store the data (disabled from object ton send data on post). This sounds a bit wacky for something that could be done by javascript I'm pretty sure.
So the big question, in javascript is it possible to prevent manual edition of a field without stopping datepicker plugin?
Instead of disabling the field, just add the readonly attribute. It will have a similar effect as disabling the field, but without the need to store the value to a hidden field.
You can also access this property with javascript if needed:
document.getElementById("myTextBoxID").readOnly = true;

Categories

Resources