Create calendardateselect from javascript

Question

Not sure why I can't figure this out. When a user makes a selection, a javascript method is called, at which point I want to add a calendardateselect to an existing div tag from the javascript.

According to the docs, it seems like this should work:

var a = new CalendarDateSelect( document.getElementById("date_area"), {embedded:true, year_range:10} );
$('date_area').insert(a);

... or maybe this....

var newScript   = document.createElement('script');
newScript.type  = 'text/javascript';
var tn      = document.createTextNode("new CalendarDateSelect( $(this).previous() )");
newScript.appendChild(tn);
$('date_area').insert(newScript);

http://code.google.com/p/calendardateselect/wiki/JavascriptDocumentation

But neither of them are working. I feel like I've tried everything. Ideas?

Answer 1

Turns out the first try works:

var a = new CalendarDateSelect( document.getElementById("date_area"), {embedded:true, year_range:10} );
$('date_area').insert(a);

But the trick was that CalendarDateSelect seems to rely on having a hidden input field in the div where this is created. Once I added that, the above code worked perfectly.

But a better way is simply:

new CalendarDateSelect(
    $('date_area'),
    {
       embedded:   true,
       year_range: 10
   }
);