templates/CRM/common/jsortable.tpl

   1 {*
   2  +--------------------------------------------------------------------+
   3  | CiviCRM version 4.5                                                |
   4  +--------------------------------------------------------------------+
   5  | Copyright CiviCRM LLC (c) 2004-2014                                |
   6  +--------------------------------------------------------------------+
   7  | This file is a part of CiviCRM.                                    |
   8  |                                                                    |
   9  | CiviCRM is free software; you can copy, modify, and distribute it  |
  10  | under the terms of the GNU Affero General Public License           |
  11  | Version 3, 19 November 2007 and the CiviCRM Licensing Exception.   |
  12  |                                                                    |
  13  | CiviCRM is distributed in the hope that it will be useful, but     |
  14  | WITHOUT ANY WARRANTY; without even the implied warranty of         |
  15  | MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.               |
  16  | See the GNU Affero General Public License for more details.        |
  17  |                                                                    |
  18  | You should have received a copy of the GNU Affero General Public   |
  19  | License and the CiviCRM Licensing Exception along                  |
  20  | with this program; if not, contact CiviCRM LLC                     |
  21  | at info[AT]civicrm[DOT]org. If you have questions about the        |
  22  | GNU Affero General Public License or the licensing of CiviCRM,     |
  23  | see the CiviCRM license FAQ at http://civicrm.org/licensing        |
  24  +--------------------------------------------------------------------+
  25 *}
  26 {literal}
  27 <script type="text/javascript">
  28   CRM.$(function($) {
  29
  30     function getElementClass(element) {
  31       return $(element).attr('class') || '';
  32     }
  33
  34     // fetch the occurrence of element
  35     function getRowId(row,str) {
  36       var optionId;
  37       $.each( row, function(i, n) {
  38         if( str === $(n).attr('class') ) {
  39           optionId = i;
  40         }
  41       });
  42       return optionId;
  43     }
  44
  45     // for date sorting see http://wiki.civicrm.org/confluence/display/CRMDOC/Sorting+Date+Fields+in+dataTables+Widget
  46     var useAjax = {/literal}{if $useAjax}1{else}0{/if}{literal};
  47     var sourceUrl = '';
  48     var useClass  = 'display';
  49
  50     var tcount =1;
  51     if ( useAjax ) {
  52       {/literal}{if isset($sourceUrl)}sourceUrl = "{$sourceUrl}";{/if}{literal}
  53       useClass = 'pagerDisplay';
  54       tcount =5;
  55     }
  56
  57     var tableId = '';
  58     var count   = 1;
  59
  60     //rename id of table with sequence
  61     //and create the object for navigation
  62     $('table.' + useClass).each(function(){
  63       $(this).attr('id','option' + tcount + count);
  64       tableId += count + ',';
  65       count++;
  66     });
  67
  68     //remove last comma
  69     tableId = [tableId.substring(0, tableId.length - 1 )];
  70
  71     $.each(tableId, function(i,n){
  72       tabId = '#option' + tcount + n;
  73       //get the object of first tr data row.
  74       tdObject = $(tabId + ' tr:nth(1) td');
  75       var id = -1; var count = 0; var columns=''; var sortColumn = '';
  76       //build columns array for sorting or not sorting
  77       $(tabId + ' th').each( function( ) {
  78         var option = $(this).prop('id').split("_");
  79         option  = ( option.length > 1 ) ? option[1] : option[0];
  80         stype   = 'numeric';
  81         switch( option ) {
  82           case 'sortable':
  83             sortColumn += '[' + count + ', "asc" ],';
  84             columns += '{"sClass": "'+ getElementClass( this ) +'"},';
  85             break;
  86           case 'date':
  87             stype = 'date';
  88           case 'order':
  89             if ( $(this).attr('class') == 'sortable' ){
  90               sortColumn += '[' + count + ', "asc" ],';
  91             }
  92             sortId   = getRowId(tdObject, $(this).attr('id') +' hiddenElement' );
  93             columns += '{ "render": function ( data, type, row ) { return "<div style=\'display:none\'>"+ data +"</div>" + row[sortId] ; }, "targets": sortColumn,"bUseRendered": false},';
  94             break;
  95           case 'nosort':
  96             columns += '{ "bSortable": false, "sClass": "'+ getElementClass( this ) +'"},';
  97             break;
  98           case 'currency':
  99             columns += '{ "sType": "currency" },';
 100             break;
 101           case 'link':
 102             columns += '{"sType": "html"},';
 103             break;
 104           default:
 105             if ( $(this).text() ) {
 106               columns += '{"sClass": "'+ getElementClass( this ) +'"},';
 107             } else {
 108               columns += '{ "bSortable": false },';
 109             }
 110             break;
 111         }
 112         count++;
 113       });
 114       columns = [columns.substring(0, columns.length - 1 )];
 115       sortColumn = [sortColumn.substring(0, sortColumn.length - 1 )];
 116
 117       var currTable = $(tabId);
 118       if (currTable) {
 119         // contains the dataTables master records
 120         var s = $(document).dataTableSettings;
 121         if (s != 'undefined') {
 122           var len = s.length;
 123           for (var i=0; i < len; i++) {
 124             // if already exists, remove from the array
 125             if (s[i].sInstance = tabId) {
 126               s.splice(i,1);
 127             }
 128           }
 129         }
 130       }
 131
 132       var noRecordFoundMsg  = {/literal}'{ts escape="js"}There are no records.{/ts}'{literal};
 133
 134       oTable = null;
 135       if ( useAjax ) {
 136         oTable = $(tabId).dataTable({
 137           "bFilter"    : false,
 138           "bAutoWidth" : false,
 139           "aaSorting"  : sortColumn,
 140           "aoColumns"  : columns,
 141           "bProcessing": true,
 142           "bJQueryUI"  : true,
 143           "asStripClasses" : [ "odd-row", "even-row" ],
 144           "sPaginationType": "full_numbers",
 145           "sDom"       : '<"crm-datatable-pager-top"lfp>rt<"crm-datatable-pager-bottom"ip>',
 146           "bServerSide": true,
 147           "sAjaxSource": sourceUrl,
 148           "oLanguage":{
 149             "sEmptyTable"  : noRecordFoundMsg,
 150             "sZeroRecords" : noRecordFoundMsg
 151           },
 152
 153           "fnServerData": function ( sSource, aoData, fnCallback ) {
 154             $.ajax( {
 155               "dataType": 'json',
 156               "type": "POST",
 157               "url": sSource,
 158               "data": aoData,
 159               "success": fnCallback
 160             });
 161           }
 162         });
 163       } else {
 164         oTable = $(tabId).dataTable({
 165           "aaSorting"    : sortColumn,
 166           "bPaginate"    : false,
 167           "bLengthChange": true,
 168           "bFilter"      : false,
 169           "bInfo"        : false,
 170           "asStripClasses" : [ "odd-row", "even-row" ],
 171           "bAutoWidth"   : false,
 172           "aoColumns"   : columns,
 173           "bSort" : true,
 174           "oLanguage":{
 175             "sEmptyTable"  : noRecordFoundMsg,
 176             "sZeroRecords" : noRecordFoundMsg
 177           }
 178         });
 179       }
 180     });
 181   });
 182
 183   //plugin to sort on currency
 184   var symbol = "{/literal}{$config->defaultCurrencySymbol($config->defaultSymbol)}{literal}";
 185   cj.fn.dataTableExt.oSort['currency-asc']  = function(a,b) {
 186     var x = (a == "-") ? 0 : a.replace( symbol, "" );
 187     var y = (b == "-") ? 0 : b.replace( symbol, "" );
 188     x = parseFloat( x );
 189     y = parseFloat( y );
 190     return ((x < y) ? -1 : ((x > y) ?  1 : 0));
 191   };
 192
 193   cj.fn.dataTableExt.oSort['currency-desc'] = function(a,b) {
 194     var x = (a == "-") ? 0 : a.replace( symbol, "" );
 195     var y = (b == "-") ? 0 : b.replace( symbol, "" );
 196     x = parseFloat( x );
 197     y = parseFloat( y );
 198     return ((x < y) ?  1 : ((x > y) ? -1 : 0));
 199   };
 200 </script>
 201 {/literal}