无法在Bootstrap手风琴上捕捉点击事件

时间:2015-03-19 16:53:34

标签: javascript jquery ajax twitter-bootstrap-3

我正在使用Bootstrap将数据绑定到表,然后尝试捕获手风琴节目事件。我的计划是获取div id来调用ajax调用以获取有关该项的更多信息

到目前为止,我没有运气,我的表就是这样构建的

<table class="table table-condensed" style="border-collapse:collapse;">
                                    <thead>
                                        <tr data-bind='foreach: headers'>
                                            <td data-bind='click: $parent.sort, text: title'></td>
                                        </tr>
                                    </thead>
                                    <tbody data-bind='foreach: packages'>
                                     <tr data-toggle="collapse" class="accordion-toggle" data-bind="attr: {'data-target': '#collapse-' + msg_id }">
                                            <td><button class='btn btn-success btn-6 btn-6g'
                                                    data-bind='text: msg_id'></button></td>
                                            <td data-bind='text: subject'></td>
                                            <td data-bind='text: sender_addr'></td>
                                            <td data-bind='date: created'></td>
                                            <td></td>
                                        </tr>
                                        <tr>
                                        <td colspan="5" class="hiddenRow">
                                                <div  class="accordian-body collapse"  data-bind="attr: { id: 'collapse-' + msg_id }">
                                            opened
                                            </div>
                                            </td>
                                        </tr>
                                    </tbody>
                                </table>

我正在尝试使用

$(document).ready(function() {

  ko.applyBindings(new PackagesViewModel()); 

  $(document).ready(function() {
         $('div').on('show.bs.collapsing', function (e) {
             alert("Event fired on " + e.currentTarget.id);
            });
    });

});

赶上事件。我的视图模型是在页面加载时根据ajax请求构建的。任何帮助都会很棒。

1 个答案:

答案 0 :(得分:0)

好的,我发现为什么它不像小提琴那样工作。 jquery试图将事件绑定到尚未创建的表。它正在等待ajax调用,然后是knockout viewmodel来构建表。当这一切都发生时,我添加了一个按钮来再次运行jQuery事件绑定,这工作,我抓住了手风琴上的show事件。所以我的解决方案是在ajax请求之后将jquery事件查找器移动到我的java脚本中。我实际上把它放在了AJAX请求的响应中。我现在可以赶上这个事件了。