Let's forget the event handler for a second, that's not the problem. In fact, let's forget about z3c.form and everything. My question is simply: how to change, using javascript, the year of a mockup's pickadate widget. If you have to write a javascript function to unconditionally modify the value, what html node would you modify?
This is the html code of a pickadate widget (as seen in http://plone.github.io/mockup/dev/#pattern/pickadate for only date widget):
https://gist.github.com/jdinuncio/a9de7a7ecc45898191b91de9a343ce94
It has a div.pattern-pickadate-wrapper which contains a div.pattern-pickadate-date-wrapper, which contains an input.pattern-pickadate-date. If I change the data-value attribute of this input, the widget doesn't show any change, at all. Inside all this structure, there's a <select>
for the year. If I chose an option, and add a selected="" attribute, the UI widget doesn't change.
There's nothing that I can do in this html code that have any effect in the widget. None, nada, zip, zero.
Again, if I browse http://plone.github.io/mockup/dev/#pattern/pickadate and open the javascript console, and use jQuery, I haven't found any way to modify the fricking date and change the year in the widget...
I added an id to the main div. After that, if I try:
$($('#blah input')[0]).attr('data-value', '2016-05-01')
it changes the value of the attribute, but no change in the shown date widget.
year=$($('#blah select')[1])
year.val("2018")
changes the year's value, but no change in the shown date widget, neither the date nor the year select widget.