Changing the datepicker model and css problem

Hi,

I’m attempting to change the datepicker model to attach the datepicker to a text input field. I’m working on the master branch.

The text input and datepicker are functional but the calendar is missing styling. The calendar text is formatted correctly, but there’s no button styling. I’m unsure how to apply the css from datepicker.css, since the div containing the calendar isn’t created until after the jquery datepicker function is called. Does anyone know a way around this?

Here is my datepicker.coffee code so far:

_ = require “underscore”
$ = require “jquery”
$1 = require “jquery-ui/datepicker”

InputWidget = require “./input_widget”
datepicker_template = require “./datepicker_template”
BokehView = require “…/…/core/bokeh_view”
p = require “…/…/core/properties”

class DatePickerView extends BokehView
template: datepicker_template

initialize: (options) →
super(options)
@listenTo(@model, ‘change’, @render)
html = @template(@model.attributes)
@$el.html(html)
@render()

render: () →
opts = {
value: @mget(‘value’),
min_date: @mget(‘min_date’),
max_date: @mget(‘max_date’)
}
@$(’.datepicker’).datepicker(opts)

return @

onSelect: (dateText, ui) =>
@mset(‘value’, new Date(dateText))
@mget(‘callback’)?.execute(@model)

class DatePicker extends InputWidget.Model
type: “DatePicker”
default_view: DatePickerView

@define {
# TODO (bev) types
value: [ p.Any, Date.now() ]
min_date: [ p.Any ]
max_date: [ p.Any ]
}

module.exports =
Model: DatePicker
View: DatePickerView

``

And here is my eco template:

<%= @title %>:

``

Thanks,