title: Best way to use datetimepicker with Backbone model?
body: <p>I'm currently using the jquery datetimepicker inside a backbone view that will have a model tied to it for each datepicker control I use.</p>
  
  <p>I'm not sure what the best way to implement this but there is huge rendering slowness issues if I have more than a few datetimepicker controls in my CompositeView.</p>
  
  <p>Here is my current setup, ideas on ways to make this faster or change would be appreciated.</p>
  
  <p>There looks to be a bottle neck in the JQuery _updateDatePicker code as well.  empty() eventually calls $.cleanData which is a choke.</p>
  
  <pre><code>    /* Generate the date picker content. */
       _updateDatepicker: function(inst) {
               this.maxRows = 4; //Reset the max number of rows being displayed (see #7043)
               instActive = inst; // for delegate hover events
               inst.dpDiv.empty().append(this._generateHTML(inst));
  </code></pre>
  
  <p><strong>Underscore template code:</strong></p>
  
  <pre><code>&lt;div style="float:left;"&gt;           
      &lt;div class="lbltext" id="startdate-datepicker"&gt;&lt;/div&gt;                
  &lt;/div&gt;
  </code></pre>
  
  <p><strong>CompositeView onRender:</strong></p>
  
  <pre><code>            onRender: function () {
              // Add datetimepicker               
              var dtp_mod = Page.Module("datetimepicker");
  
              this.dateTimePickerDailyStart = new dtp_mod.View({
                  model: new dtp_mod.Model({
                      CurrentDate: null,
                      LabelText: "Start Date",
                      showTimepicker: false
  
                  }),
                  el: this.ui.dailystartdatepicker[0]
              }).on("change.datetimepicker", this._onDateChange, this);
  </code></pre>