Databases
StackOverflow2013
Postsdbo
POBootstrap Datepicker showing frame but not calendar
Body
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POBootstrap Datepicker showing frame but not calendar
    text
    copied!<p>I am relatively new to JavaScript and JQuery. I am trying to implement Twitter's bootstrap datepicker on a series of tabs where there is a datepicker on each tab. Right now (single tab), the empty frame pops up on the first click of the icon. Clicking away and clicking the icon again shows the arrows and the days of the week (Sun, Mon, Tues, ...). It doesn't show the month or the day numbers. I've included the CSS, JS, and less in the base.html. My code is below:</p> <p>JavaScript</p> <pre><code>//implemented within another method this.$('li.tab i').datepicker('autoclose', true, 'update', Date.today().toString("mm/dd/yyyy")).on('changeDate', function(ev){ this.$('li.tab i').datepicker("show"); }); </code></pre> <p>Base.html</p> <pre><code>&lt;head&gt; &lt;link rel=stylesheet href="{{ CSS_URL }}/datepicker.css"&gt; &lt;link rel=stylesheet href="{{ CSS_URL }}/datepicker.less"&gt; &lt;/head&gt; &lt;body&gt; &lt;script&gt; require = { baseUrl: "{{ JAVASCRIPT_URL }}", config:{ tpl: { variable:'data' } }, shim: { underscore: { exports: '_' }, backbone: { deps: ['underscore', 'jquery'], exports: 'Backbone' }, bootstrap: ['jquery'], select2: ['jquery'], 'backbone.marionette': ['backbone'], 'jquery.tokeninput': ['jquery'], 'datepicker': ['jquery'] } }; &lt;/script&gt; &lt;/body&gt; </code></pre> <p>Tabs html</p> <pre><code>&lt;li&gt;&lt;a class="btn add" href="#"&gt;&lt;i class="icon-plus"&gt;&lt;/i&gt;&lt;/a&gt;&lt;/li&gt; &lt;% for (m in data.models) {%&gt; &lt;li class="tab" &gt; &lt;a data-model=&lt;%= data.models[m].cid %&gt; href="#datapoint&lt;%= data.models[m].cid %&gt;" data-toggle="tab"&gt;&lt;%= data.models[m].get('date') %&gt; &lt;div class="input-append date datepicker" data-date-format="mm/dd/yyyy"&gt; &lt;i class="icon-calendar pull-right" style="margin-left:10px;cursor:pointer;"&gt; &lt;/i&gt; &lt;/div&gt; &lt;/a&gt; &lt;/li&gt; &lt;% } %&gt; </code></pre> <p>Any assistance would be greatly appreciated. I apologize if it's something simple I missed.</p> <p><strong>EDIT:</strong> Also, I'm trying to figure out what the HTML inside the ... > does. If anyone knows a good resource for it/what it's even called, I would be very grateful.</p>
 

Querying!

 
Guidance
An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload