underscore.js的使用

插入html元素
underscore的模板

时间控件
<div style="margin-bottom: 30px">
            <form class="form form-inline" id="query-form">
                <div class="input-group">
                    <input type="text" name="start" class="form-control time-start "
                           placeholder="起始时间"/>
                </div>
                <div class="input-group">
                    <input type="text" name="end" class="form-control time-end"
                           placeholder="截止时间"/>
                </div>
                <button type="button" class="btn btn-primary btn-filter">查询</button>
            </form>
        </div>
 <table class="table table-bordered table-striped">
            <thead>
            <tr>
                <th>时间</th>
                <th>收入</th>
                <th>参与人数</th>
                <th>浏览量</th>
                <th>活动数</th>
            </tr>
            </thead>
            <tbody id="biz_detail">

            </tbody>

 </table>

获取时间

        var QueryForm = {
            el: $("#query-form"),
            init: function () {
                this.el.on('click', '.btn-filter', function () {
                    Chart.get();
                    BizDetail.init()
                });
                this.el.find('.time-start').datetimepicker({
                    format: 'YYYY-MM-DD',
                    locale: 'zh-cn',

                }).on('dp.change', function (e) {
                    var date = e.date.format('YYYY-MM-DD');
                }).on('hide', function (e) {
                });
                this.el.find('.time-end').datetimepicker({
                    locale: 'zh-cn',
                    format: 'YYYY-MM-DD',
                }).on('changeDate', function (e) {
                }).on('changeYear', function (e) {
                });
                return this;
            },

            getData: function () {
                return this.el.serializeArray();
            }
        };

 <script id="each_detail" type="text/html">
        <tr>
            <th><%=date%></th>
            <th><%=register_num%></th>
            <th><%=income%></th>
            <th><%=visit_num%></th>
            <th><%=join_num%></th>
        </tr>
    </script>

var BizDetail = {
            api: '{% url 'each_biz_api'%}' + '?id=' + biz_id,
            tmpl_detail: _.template($('#each_detail').html()),
            onData: function (json) {
                if (json.status === 200) {
                    var chain = _.sortBy(json.data,'date');
                    var html_detail = _.map(chain, function (item, idx) {
                        return this.tmpl_detail(item);
                    }.bind(this)).join('');
                    $('#biz_detail').html(html_detail);
                }
            },

            init: function () {
                var data = QueryForm.getData();
                console.log(data)
                $.get(this.api, data, this.onData.bind(this), 'json');

            }
        };