Custom HTML for paging divs about datatable HOT 14 CLOSED

I just added an option pagingPages on the standalone branch (I am only working on this branch right now, which will become the main branch soon): https://github.com/Holt59/datatable/tree/standalone

You can use the option as follow (with jQuery);

$('table').datatable({
    pagingPages: function (startPage, endPage, currentPage, firstEntry, lastEntry) {
        return $('<li />').append($('<a />').html(startPage + '-' + endPage)) ;
    }
});

If you are already using the standalone branch and do not use jQuery, you just need to return a HTMLElement (li) or an array of HTMLElement (li).

Hope it'll do what you were looking for, let me know if it does not!

from datatable.

@Holt59 Thanks for the fast response! I tried copying your latest datatable.min.js but now I'm getting datatable is not a function error. Any ideas?

from datatable.

@haggy You need to go to the standalone branch (https://github.com/Holt59/datatable/tree/standalone) and copy (and includes) both the datatable.min.js and datatable.jquery.min.js files in your page (and maybe the new CSS files if you don't use bootstrap). You can download a ZIP file with the standalone version here: https://github.com/Holt59/datatable/archive/standalone.zip

from datatable.

@Holt59 Even when I include both files from your standalone.zip above I get datatable is not a function error. I think at this point I'm going to wait for it to get finalized and pushed to master before I use it since this will be in a production app. Thanks for the fast responses and I look forward to you next updates!

from datatable.

Can you show me the line of the error and the code were you call datatable?

from datatable.

Hi Mikael,

Sorry work has been super busy. Have the latest changes been released?

On Thu, Apr 30, 2015 at 12:33 PM Mikaël Capelle [email protected]
wrote:

Can you show me the line of the error and the code were you call datatable?

—
Reply to this email directly or view it on GitHub
#10 (comment).

from datatable.

Hi @haggy,

The standalone branch is ready to be realeased, but I will not merge it to the master branche because I still have to update the whole documentation (which may take some time... ).

I did not make any big change since our last talk, so I am afraid you may still encounter the same issue. I will put a working sample at the end of this comment, if you still encounter the same error, please give me a bit more details about the error you are getting.

Mikaël

<script type="text/javascript" src="http://code.jquery.com/jquery-1.11.3.min.js" ></script>
<script type='text/javascript' src="datatable/js/datatable.min.js"></script>        
<script type='text/javascript' src="datatable/js/datatable.jquery.min.js"></script> 
<script type="text/javascript">

$('#table').datatable({
    pageSize: 7,
    sort: [
        true, 
        function (a, b) { 
            return a.length < b.length ? -1 : (a.length > b.length ? 1 : 0) ; 
        }, 
        true, 
        true, 
        true, 
        false
    ],
    filterEmptySelect: 'Select... ',
    lineFormat: lineFormat = function (i, d) {
        var tr = $('<tr/>');
        for (var k in d) {
            tr.append($('<td/>').html(d[k]));
        }
        return tr ;
    },
    pagingPages: function (start, end, current, first, last) {
        return $('<li />').html(first + ' - ' + last) ;
    }
});

</script>

from datatable.

Hi Mikaël,

I am still unable to get the standalone branch to work. I loaded the

datatable and jquery plugin and kept all of the code the same. When using
the standalone branch, the table bodies don't even render when I call the
datatable() method passing in data. If I switch back to the original
version (making no code changes) everything works fine again. I think we're
going to have to pair on this at some point to see what is going on. Let me
know what your schedule is like. Thanks again!

On Tue, May 19, 2015 at 10:54 AM Mikaël Capelle [email protected]
wrote:

Hi @haggy https://github.com/haggy,

The standalone branch is ready to be realeased, but I will not merge it to
the master branche because I still have to update the whole documentation
(which may take some time... ).

I did not make any big change since our last talk, so I am afraid you may
still encounter the same issue. I will put a working sample at the end of
this comment, if you still encounter the same error, please give me a bit
more details about the error you are getting.

Mikaël

<script type="text/javascript" src="http://code.jquery.com/jquery-1.11.3.min.js" ></script> <script type='text/javascript' src="datatable/js/datatable.min.js"></script> <script type='text/javascript' src="datatable/js/datatable.jquery.min.js"></script> <script type="text/javascript">$('#table').datatable({ pageSize: 7, sort: [ true, function (a, b) { return a.length < b.length ? -1 : (a.length > b.length ? 1 : 0) ; }, true, true, true, false ], filterEmptySelect: 'Select... ', lineFormat: lineFormat = function (i, d) { var tr = $(''); for (var k in d) { tr.append($('').html(d[k])); } return tr ; }, pagingPages: function (start, end, current, first, last) { return $('

').html(first + ' - ' + last) ; }});</script>

—
Reply to this email directly or view it on GitHub
#10 (comment).

from datatable.

Seems really strange, could you post here the part of your code where you are loading and using the plugin? Did you check that the new datatable.js file is loaded? Maybe it is only a cache issue.

Anyway, I am available any evening (CET time), if you want to discuss a bit more directly.

from datatable.

I posted a very small subset of the code below but it is the most relevant
part. Like I said the code currently in the released branch works great
with this code. When I simply switch to the standalone branch, the table
body doesn't render at all.

var TableAPI = {

• datatableOptions: {*

•  identify: 'id',*
  

•  pagingDivSelector: '.componentPaging',*
  

•  pageSize: 10,*
  

•  sort: [true, true, true, true, true, true, true],*
  

•  // Disabling filters for now since they don't work*
  

•  filters: false,*
  

•  sortKey : "lastModifiedDate",*
  

•  sortDir: "desc",*
  

•  filterText: 'Type to filter...',*
  

•  data: [],*
  

•  // Line format fn declared above*
  

•  lineFormat: lineFormatFn,*
  

•  // Paging controls fn declared above*
  

•  pagingPages: createPagingControls*
  

• },*
• /***
• * @params {{data}} - This is an array of objects for the table*
• * @params {function} - Called when rendering is complete*
• /
• refreshDataTable: function(data, onComplete) {*

•  var $table = $('#component-search-table');*
  

•  if($table.data('dtable_init') === true) {*
  

•    $table.datatable('destroy');*
  

•    // Add in table class since it is destroyed*
  

•    $table.addClass('alm-table');*
  

•  }*
  

•  // datatableOptions contains all the table options*
  

•  this.datatableOptions.data = data || this.datatableOptions.data;*
  

•  $table.datatable(this.datatableOptions);*
  

•  // Set to true in order for init ops to only*
  

•  // occur once*
  

•  $table.data('dtable_init', true);*
  

•  if(typeof onComplete === 'function') {*
  

•    onComplete();*
  

•  }*
  

• }*
  *}; *

On Mon, Jun 1, 2015 at 1:11 PM Mikaël Capelle [email protected]
wrote:

Seems really strange, could you post here the part of your code where you
are loading and using the plugin? Did you check that the new datatable.js
file is loaded? Maybe it is only a cache issue.

Anyway, I am available any evening (CET time), if you want to discuss a
bit more directly.

—
Reply to this email directly or view it on GitHub
#10 (comment).

from datatable.

Your code looks correct, did you include the datatable,js ANDdatatable.jquery.js scripts? (You need both files). If so, did you include datatable.jquery.js AFTER datatable.js AND jquery.js? And finally, did you check that the datatable.js file which is load is the correct one? (Doing a simple Ctrl+F5 does not work most of the time, you need to force the browser cache update by going to the scripts url).

from datatable.

Hi,

I know this is short notice but would you have any time today to

connect about this? I have tried everything I can think of but I just can't
get it working. I am in US, Eastern timezone. We can Skype or I also have
Joinme pro so we could screenshare and conference. Any help is much
appreciated. Thanks!

On Mon, Jun 1, 2015 at 2:02 PM Mikaël Capelle [email protected]
wrote:

Your code looks correct, did you include the datatable,js AND
datatable.jquery.js scripts? (You need both files). If so, did you
include datatable.jquery.js AFTER datatable.js AND jquery.js? And
finally, did you check that the datatable.js file which is load is the
correct one? (Doing a simple Ctrl+F5 does not work most of the time, you
need to force the browser cache update by going to the scripts url).

—
Reply to this email directly or view it on GitHub
#10 (comment).

from datatable.

Hi,

I will be available from 1 p.m to 3 p.m (ET) if you want, if joinme is not
that hard to install we could use it, we will try Skype if you want but I
am not an english native speaker.

Send me following information at [email protected].

Mikaël

On Mon, Jun 8, 2015 at 4:10 PM haggy [email protected] wrote:

Hi,

I know this is short notice but would you have any time today to
connect about this? I have tried everything I can think of but I just can't
get it working. I am in US, Eastern timezone. We can Skype or I also have
Joinme pro so we could screenshare and conference. Any help is much
appreciated. Thanks!

On Mon, Jun 1, 2015 at 2:02 PM Mikaël Capelle [email protected]
wrote:

Your code looks correct, did you include the datatable,js AND
datatable.jquery.js scripts? (You need both files). If so, did you
include datatable.jquery.js AFTER datatable.js AND jquery.js? And
finally, did you check that the datatable.js file which is load is the
correct one? (Doing a simple Ctrl+F5 does not work most of the time, you
need to force the browser cache update by going to the scripts url).

—
Reply to this email directly or view it on GitHub
#10 (comment).

—
Reply to this email directly or view it on GitHub
#10 (comment).

from datatable.

I'm closing this issue, again thanks for the feedback! If you have any more issue, do not hesitate to open a new request or send me an email!

from datatable.