小编dav*_*rad的帖子

jQuery数据表Twitter/facebook样式分页

我一直在寻找一个很好的资源,如何做到这一点没有运气.我正在使用jQuery datatables插件与服务器端处理以及启用流水线(示例).我在我的asp.net webforms项目中工作,并将转向MVC以用于未来的项目.我正在使用此处找到的类来处理服务器端处理.我也一直在查看这里发现的与分页相关的文章.

基本上我需要做的是使用datatables插件和服务器端处理创建这种类型的分页(流水线在这里不一定重要)

注意: 通过twitter/style分页我指的是:

  • 表格底部的单个按钮可将附加结果附加到表格中的现有内容中
  • 当用户通过滚动到达当前结果时,无限加载其他结果(注意:我发现此功能内置于datatables插件中,因此我需要关注前面的方法).

最后,我想在上面的两种分页风格之间做出选择.

Doest有没有任何好的建议和/或样品/教程分享?

ajax jquery jquery-datatables

5
推荐指数
1
解决办法
1376
查看次数

Bootstrap popover不显示内容

我试图让bootstrap popover在网站上工作,我有点成功.单击链接时我可以显示弹出窗口但是除了标题之外我没有在框中看到任何内容.我试过两种方法:

<a class="btn btn-link login-popover" rel="popover" data-placement="bottom" data-title="Sign in to the website builder" data-html="true" data-content="Lo4545445"> Sign in  <span class="caret"></span></a>
Run Code Online (Sandbox Code Playgroud)

$('.login-popover').popover({
    placement: 'bottom',
    title: 'Sign in to the website builder',
    content: 'testing 123',
    trigger: 'click'
});
Run Code Online (Sandbox Code Playgroud)

但是,实际上没有人在框中显示内容.你可以通过访问http://www.onemobi.net/new并点击Sign in顶部来查看我的意思.

编辑:我不是同时做这两件事.我试了一个然后另一个.

html javascript jquery popover twitter-bootstrap

5
推荐指数
1
解决办法
1万
查看次数

带有动态html和控制器的AngularStrap选项卡

我正在使用AngularStrap创建标签,并希望动态加载每个html片段,如下面的问题所示,但也想指定一个动态控制器.

请参阅: AngularStrap选项卡加载html片段

这是我的javascript和html.

function WorkspaceCtrl($scope, $window, $location) {
  // Tab directive
  $scope.tabs = [
    {
        title:'Search',
        page: 'templates/workspace/search.ejs',
        controller: SearchCtrl
    },
    {
        title:'My Searches',
        page: 'templates/workspace/my_searches.ejs',
        controller: MySearchesCtrl
    },
    {
        title:'Community Searches',
        page: 'templates/workspace/community_searches.ejs',
        controller: CommunitySearchesCtrl
    }
  ];
  $scope.tabs.activeTab = 1;
}
Run Code Online (Sandbox Code Playgroud)
<body ng-controller="WorkspaceCtrl">
    <div class="container">
        <section id="tab">
            <div class="bs-docs-example">
            <div ng-model="tabs.activeTab" bs-tabs>
                <div ng-repeat="tab in tabs" data-title="{{ tab.title }}">
                </div>
                <div ng-include src='tabs[tabs.activeTab].page' ng-controller="tabs[tabs.activeTab].controller"></div>
            </div>
            </div>
        </section>
    </div>
</body>
Run Code Online (Sandbox Code Playgroud)

动态页面工作正常,但控制器不仅不起作用,而且还阻止加载动态片段.角带标签是否支持此行为?提前致谢.

angularjs angular-strap

5
推荐指数
0
解决办法
2464
查看次数

如何禁用DataTables/TableTools按钮

我正在使用DataTable 1.10和TableTools 2.2.1.

鉴于以下剪辑,我想禁用/启用编辑按钮.

var myTable = $("#myTable ").DataTable({
tableTools : {
    "aButtons" : [ {
        "sExtends" : "text",
        "sButtonText" : "Edit",
        "fnClick" : function(nButton, oConfig, oFlash) {
            /* some stuff */    
        }
    }]
  }
})
Run Code Online (Sandbox Code Playgroud)

是否有可能在运行时执行此操作?

非常感谢

tabletools jquery-datatables

5
推荐指数
1
解决办法
4044
查看次数

数据表1.10 - TD中的HTML5"数据顺序"attr不起作用

我在订购包含HTML的列时遇到问题.在1.10的文档中说明,默认情况下应该这样做,但事实并非如此.然后我查看了1.10的新功能,并看到如果同一列中的每个TD元素都有"数据顺序"属性,则可以通过所述属性进行排序.完善!问题是,我无法让它发挥作用.

奇怪的是,当页面是静态时,它们具有此示例的示例正在按预期工作,但不是在动态加载数据和表时.

我正在使用以下选项和更改来启动表以添加属性.失效是为了告诉Datatables它需要重绘它(我看到它需要在某处):

"createdRow": function ( row, data, index ) {
                if ( data[6] ) {
                    cell = $('td', row).eq(6);
                    value = cell.text();
                    if(value == "Ej fakturerad") {
                        cell.attr('data-order', 1);
                    }
                    else if(value == "Nej") {
                        cell.attr('data-order', 2);
                    }
                    else if(value == "Kredit") {
                        cell.attr('data-order', 3);
                    }
                    else if(value == "Ja") {
                        cell.attr('data-order', 4);
                    }
                }
                oTable
                    .row( index )
                    .invalidate()
                    .draw();
            },
Run Code Online (Sandbox Code Playgroud)

我正在使用Laravel项目中Chumper/datatables的composer包实现这个DataTable,这意味着数据源是Ajax,并使用服务器端处理.

提前致谢!

sorting jquery html5 jquery-datatables datatables-1.10

5
推荐指数
1
解决办法
7279
查看次数

jQuery dataTables - TableTools无效

我 在我的本地主机(wamp服务器)中使用 http://datatables.net/extensions/tabletools/.它工作正常,但当我在我的在线服务器上放置相同的代码时,它无法正常工作.

我正在使用所有最新版本的数据表

tableTools: {
    "sSwfPath": "https://datatables.net/release-datatables/extensions/TableTools/swf/copy_csv_xls_pdf.swf",
    "sRowSelect": "os",
    "sRowSelector": 'td:first-child',
    // "aButtons": [ "copy", "csv", "xls","pdf","print","select_all", "select_none" ]
    "aButtons": [
        "copy",
        "print", {
            "sExtends": "collection",
            "sButtonText": "Save", // button name 
            // "aButtons":    [ "csv", "xls", "pdf" ]
            "aButtons": [
                "csv",
                "xls", {
                    "sExtends": "pdf",
                    "sPdfOrientation": "landscape",
                    "sPdfMessage": "List of product."
                },
                "print"
            ]
        }
    ]
}    
Run Code Online (Sandbox Code Playgroud)

首先没有点击copy,pdf,csv,xls按钮.因此,我教我的路径或瑞士法郎不工作,因此我用在线链接替换了链接.因此,现在我点击了,但是当我点击"复制"按钮时,它会给我一条消息......但是当我在记事本中过去时,它给了我"空白".我的pdf,csv,xlsx也没有用.只有Print才能完美运行.请告诉我这是什么问题,因为我的localhost一切正常.它在我的在线服务器中创建问题.

csv flash datatables tabletools jquery-datatables

5
推荐指数
1
解决办法
3万
查看次数

jquery datatables:columnFilter()不是函数错误

我正在使用数据表与自定义服务器端过滤,搜索和排序...为什么columnFilter()返回错误"TypeError:$(...).DataTable(...).columnFilter不是一个函数"

这是我如何使用columnFilter:

var table = $('#item-table').DataTable({
    ajax: '<?= site_url("price_update"); ?>',
    serverSide: true,
    processing: true,
    paging: true
}).columnFilter();
Run Code Online (Sandbox Code Playgroud)

没有".columnFilter()"的代码工作正常.

jquery-datatables datatables-1.10

5
推荐指数
1
解决办法
8651
查看次数

隐藏jQuery dataTables中的列

我有隐藏jQuery datatable列的问题.我希望该列检索数据,但我不希望它显示在显示页面上.我想隐藏我的第8列,所以从CSS我试图隐藏它,它给了我可折叠的div.

图像获取+显示页面上的图标

下面是我的数据表代码和隐藏类是"hideCol".

 var userTable = $('#user').dataTable( {
      "processing": true,
      "serverSide": true,
      "ajax":"admin/getData.php",
      "responsive" : true,
      "lengthMenu": [10, 25],
      "paginationType" : "input",
      columns: [
              { data:'param0'},
              { data: 'param1' },
              { data: 'param2' },
              { data: 'param3' },
              { data: 'param4' },
              { data: 'param5' },
              { data: 'param6' },
              { data: 'param7'},
          ],
      fnRowCallback:function(nRow,aData, iDisplayIndex, iDisplayIndexFull){
        var seenReportedVal =Number($('td:eq(7)', nRow).text());
        $('td:eq(7)', nRow).addClass('hideCol');
        if(seenReportedVal==0)
        {
         $(nRow).addClass('bold');
        }
      },
       "columnDefs": [
                       { "visible": false, "targets": 7 }
                     ],
    });  
Run Code Online (Sandbox Code Playgroud)

jquery-datatables

5
推荐指数
1
解决办法
2万
查看次数

jQuery dataTables:单击 thead 应该对所有列进行降序排序,然后升序排序

我正在尝试更改默认排序方向。默认顺序是升序然后降序。我正在努力扭转它。

排序方向应该是独立的,并且应该适用于所有列(列数随不同表而变化)我必须启动数据表的脚本是通用的。

排序应该仅在点击时应用。

我发现了一些例子,但它们是特定于列的https://datatables.net/examples/advanced_init/sort_direction_control.html

这是我的脚本

jQuery(function($) {
   $(".datatable").dataTable({
    "paging": false,
    "searching": false,
    "info": false,
    "orderCellsTop": true
  });
});
Run Code Online (Sandbox Code Playgroud)

sorting datatable datatables

5
推荐指数
1
解决办法
3379
查看次数

即使被禁用,数据表排序asc图标仍会显示在第一列上

嗨,我有以下表格设计.我不希望第一列和最后一列可以排序.我已经相应地设置了.但是图标asc仍然出现在第一列而不是最后一列.但是当我尝试对第二列进行排序时,它就会消失.

<table id="userTable" name='userTable' class="table table-striped table-bordered bootstrap-datatable " data-column-defs='[{"sortable": false, "targets": [0,3]}]' style='table-layout: fixed;'>
  <thead>
    <tr>
      <th class="no-sort" style='width: 10%;'>No.</th>
      <th style='width: 25%;'>First Name</th>
      <th style='width: 20%;'>last Name</th>
      <th style='width: 25%;'>Details</th>
    </tr>
  </thead>
</table>
Run Code Online (Sandbox Code Playgroud)

php jquery datatables-1.10

5
推荐指数
1
解决办法
6139
查看次数