this.render骨干删除jquery nav丸类

时间:2015-07-29 07:42:24

标签: jquery css twitter-bootstrap backbone.js

我的骨干视图有以下结构

主图表视图如下:

<div id="id-main-charts">
<div id="id-time-tab">
    <ul class="nav nav-pills nav-justified nav-prima">
        <li><a href="#" type="Daily" class="agraphType" data-toggle="tab">Daily</a></li>
        <li><a href="#" type="Weekly" class="agraphType" data-toggle="tab">Weekly</a></li>
        <li><a href="#" type="Monthly" class="agraphType" data-toggle="tab">Monthly</a></li>
        <li class="active"><a href="#" class="agraphType" type="Quarterly" data-toggle="tab">Quarterly</a></li>
        <li><a href="#" type="Yearly" class="agraphType" data-toggle="tab">Yearly</a></li>
    </ul>

</div>

<div class="col-lg-5" id="id-sales-pie">

</div>

<div class="col-lg-7" id="id-sales-line">

</div>

MainChartView:

    var $ = require('jquery'),
    Handlebars = require('handlebars'),
    Backbone = require('backbone'),
    mainchartTemplate = require('../../templates/dashboard/ChartsContainer.html'),
    pieChartView = require('../../views/dashboard/PieChartView'),
    lineChartView = require('../../views/dashboard/LineChartView'),
    moment = require('moment');

var MainChartView = Backbone.View.extend({
    el: $('#id-charts-stats'),

    initialize: function() {

        this.pie = new pieChartView();
        this.line = new lineChartView();
    },
    events: {
        'click a.agraphType': "changeGraphData"
    },

    changeGraphData: function(ev) {
        ev.preventDefault();
        var type = $(ev.target).attr('type');
        sessionStorage.setItem("typeOfGraph", type);
        this.render();

    },

    render: function() {
        this.$el.html(mainchartTemplate);
        this.line.setElement(this.$('#id-sales-line')).delegateEvents().render();
        this.pie.setElement(this.$('#id-sales-pie')).delegateEvents().render();

    }
});

module.exports = MainChartView;

当我点击导航丸时,它会重新渲染视图,我的选定标签不再被选中。

我尝试删除this.render然后就可以了。但我需要渲染来重新加载我的其他子视图。

请帮忙。

0 个答案:

没有答案