bootstrap可折叠后展开后不会折叠

时间:2015-11-13 13:17:49

标签: javascript jquery twitter-bootstrap jquery-ui jquery-ui-accordion

折叠后展开后没有崩溃。它是在popover

中动态创建的

这是我的jsFiddle

$('.tooltiphelp').tooltip();
$('[data-toggle="tooltip"]').tooltip();
$('[data-toggle="popover"]').popover(); 
$('[data-toggle="collapse"]').collapse();

jQuery('document').ready(function() {
    jQuery('#accordionRank').on('show hide', function() {
    jQuery(this).css('height', 'auto');
});

jQuery('#accordionRank').collapse({ parent: true, toggle: true }); 
});

var popover = $("#noteListDiv").find('.positive').popover({
    trigger: 'click',
    placement: 'bottom',
    content: function () {
        return func_getRank($(this).closest('tr').prop('id'));
    }
});

var func_getRank = function (ID) {
    var Rankdata = {"Rank":[{"ID": "114077", "NL": "1 of 25", "OF": "1 of 30", "MLB": "1 of 240"}]};
    var cshtml;
    cshtml = '<div>'
        + '<div class="accordion" id="accordionRank">'
          + '<div class="accordion-group">'
            + '<div class="accordion-heading">'
              + '<a class="accordion-toggle" data-toggle="collapse" data-parent="#accordionRank" href="#collapseNL">'
                + 'NL Rank: ' + Rankdata.Rank[0].NL
              + '</a>'
            + '</div>'
            + '<div id="collapseNL" class="accordion-body collapse">'
              + '<div class="accordion-inner">'
                + 'Anim pariatur cliche...'
              + '</div>'
            + '</div>'
          + '</div>'
          + '<div class="accordion-group">'
            + '<div class="accordion-heading">'
              + '<a class="accordion-toggle" data-toggle="collapse" data-parent="#accordionRank" href="#collapseOF">'
                + 'OF Rank: ' + Rankdata.Rank[0].OF
              + '</a>'
            + '</div>'
            + '<div id="collapseOF" class="accordion-body collapse">'
              + '<div class="accordion-inner">'
                + 'Anim pariatur cliche...'
              + '</div>'
            + '</div>'
          + '</div>'
          + '<div class="accordion-group">'
            + '<div class="accordion-heading">'
              + '<a class="accordion-toggle" data-toggle="collapse" data-parent="#accordionRank" href="#collapseMLB">'
                + 'MLB Rank: ' + Rankdata.Rank[0].MLB
              + '</a>'
            + '</div>'
            + '<div id="collapseMLB" class="accordion-body collapse">'
              + '<div class="accordion-inner">'
                + '<table id="MiniLeaderboard">'
                    + '<thead><tr>'
                        + '<th>Rank</th>'
                        + '<th>Hitter</th>'
                        + '<th>BAVG</th>'
                        + '<th>Hits/AB</th>'
                    + '</tr></thead>'
                    + '<tbody><tr>'
                        + '<td>1</td>'
                        + '<td>Christian Yelich</td>'
                        + '<td>.470</td>'
                        + '<td>39-for-83</td>'
                    + '</tr>'
                    + '<tr>'
                        + '<td>2</td>'
                        + '<td>Ryan Braun</td>'
                        + '<td>.397</td>'
                        + '<td>27-for-68</td>'
                    + '</tr>'
                    + '<tr>'
                        + '<td>3</td>'
                        + '<td>Adam Eaton</td>'
                        + '<td>.370</td>'
                        + '<td>37-for-100</td>'
                    + '</tr>'
                    + '<tr>'
                        + '<td>4</td>'
                        + '<td>Joey Votto</td>'
                        + '<td>.369</td>'
                        + '<td>31-for-84</td>'
                    + '</tr>'
                    + '<tr>'
                        + '<td>5</td>'
                        + '<td>Edwin Encarnation</td>'
                        + '<td>.364</td>'
                        + '<td>28-for-77</td>'
                    + '</tr></tbody>'
                + '</table>'
              + '</div>'
            + '</div>'
          + '</div>'
        + '</div>'
    + '</div>'
    ;
    return $(cshtml).html();
};

数据文本应来自JSON。

以下是问题,请注意this screen cast

请帮忙!谢谢你的帮助。

1 个答案:

答案 0 :(得分:0)

我已更新我的jsFiddle,现在正在使用。也许不是一个好主意,但现在看起来不错。

<Serializable()> Public Structure structResult
    Public ResultID As Integer
    Public SurveyID As Integer
    Public QuestionID As Integer
    Public AnswerID As Integer
    Public Text As String

    Public ModifierID As Integer
    Public ModifiedDate As DateTime
End Structure

感谢所有帮助伙伴。