I am trying to sort table where my first row is disable from sorting and should remain on top.
I am trying to sort table where my first row is disable from sorting and should remain on top.
tariqnawaz
Posts: 5Questions: 2Answers: 0
I have sucessfully achieved my row first row should not sort and remain on top , however my sorting in acsending and desending is not happening properly. I now this question is asked before also but I am unable to achieve it. Request you to please help me.
```
//var oTable;
var onTopValues = new Array("Weightages");
alert(onTopValues);
/* disable asc sorting for specific rows */
$.fn.dataTableExt.oSort["custom-asc"] = function(x,y) {
if( isOnTop(x) ){
return -1; // keep this row at top
}
//if (isOnTop(y)) return 1; // keep this row at top
if( isOnTop(y) ){
return 1; // keep this row at top
}
if((x < y)){
return -1;
}else if((x > y)){
return 1;
}else{
return 0;
}
// return ((x < y) ? -1 : ((x > y) ? 1 : 0));
};
$.fn.dataTableExt.oSort['custom-desc'] = function(x,y) {
if( isOnTop(x) ){
return -1; // keep this row at top
}
//if (isOnTop(y)) return 1; // keep this row at top
if( isOnTop(y) ){
return 1; // keep this row at top
}
if((x < y)){
return 1;
}else if((x > y)){
return -1;
}else{
return 0;
}
};
function isOnTop(s) {
// search for on top values
for (var i = 0; i < onTopValues.length; i++) {
if (s === onTopValues[i]) {
return true;
}
}
return false;
}
$.fn.dataTableExt.afnSortData['custom-ontop'] = function ( oSettings, iColumn )
{
console.log(iColumn);
var aData = [];
$('td:eq('+iColumn+')', _fnGetTrNodes1(oSettings)).each(function(){
if(isOnTop($(this).closest('tr').find('td:eq(0)').text())){
aData.push($(this).closest('tr').find('td:eq(0)').text());
}else{
aData.push($(this).text());
}
});
if(aData==null || aData==''){
$(_fnGetTrNodes1(oSettings)).each(function(){
if(isOnTop($(this).closest('tr').find('td:eq(0)').text())){
aData.push($(this).closest('tr').find('td:eq(0)').text());
}else{
aData.push($(this).text());
}
});
}
console.log(aData);
return aData;
};
function _fnGetTrNodes1 ( oSettings )
{
//alert("3 method to click on sort");
var aNodes = [];
var aoData = oSettings.aoData;
console.log(aoData);
console.log(aoData.length);
for ( var i=0, iLen=aoData.length ; i<iLen ; i++ )
{
if ( aoData[i].nTr !== null )
{
aNodes.push( aoData[i].nTr );
}
}
return aNodes;
}
$(document).ready(function() {
var typeName ='';
/* Apply custom classes to table headers */
$.fn.dataTableExt.oStdClasses.sSortAsc = "custom_asc";
$.fn.dataTableExt.oStdClasses.sSortDesc = "custom_desc";
var oTable = $('#table_id1').dataTable({
"iDisplayLength": 100,
"lengthMenu": [ 100, 250, 500, 750, 1000 ],
"order": [[ 1, "asc" ]],
"aoColumnDefs": [ { aTargets: [0,1,2,3,4,5,6,7,8,9,10,11,12,13,14], sType: "custom"}] ,
"aoColumns": [
null,
{ "sSortDataType": "custom-ontop" , "bSortable": true},
{ "sSortDataType": "custom-ontop" , "bSortable": true},
{ "sSortDataType": "custom-ontop" , "bSortable": true},
{ "sSortDataType": "custom-ontop" , "bSortable": true},
{ "sSortDataType": "custom-ontop" , "bSortable": true},
{ "sSortDataType": "custom-ontop" , "bSortable": true},
{ "sSortDataType": "custom-ontop" , "bSortable": true},
{ "sSortDataType": "custom-ontop" , "bSortable": true},
{ "sSortDataType": "custom-ontop" , "bSortable": true},
{ "sSortDataType": "custom-ontop" , "bSortable": true},
{ "sSortDataType": "custom-ontop" , "bSortable": true},
{ "sSortDataType": "custom-ontop" , "bSortable": true},
{ "sSortDataType": "custom-ontop" , "bSortable": true},
{ "sSortDataType": "custom-ontop" , "bSortable": true},
],
//"aaSorting": [],
initComplete: function () {
this.api().columns(0).every( function (index) {
var column = this;
var select = $('<select id="filterSelect"></select>')
.appendTo( $('#type').empty() )
.on( 'change', function () {
var val = $(this).val();
typeName = $(this).val();
//console.log(val);
fnShowHide( typeName );
column.search( val ? '^'+val+'$' : '', true, false ).draw();
} );
column.data().unique().sort().each( function ( d, j ) {
if(d == 'Consistent Performers - Debt funds'){
select.append( '<option selected value="'+d+'">'+d+'</option>' )
column.search( d ? '^'+d+'$' : '', true, false ).draw();
fnShowHide(d);
}else{
select.append( '<option value="'+d+'">'+d+'</option>' )
}
} );
} );
}
});
$('#type').change(function() {
oTable.fnDraw();
});
});
This discussion has been closed.
Answers
for hiding column dynamically I have used this logic.
function fnShowHide( val )
{
```
I know I have to put some logic in (custom-asc,custom-desc) , but how to do I am not getting it , since I am new in jquery.
Request you to please help me. please
can any one help me on this.. please urgent
hi every one.. I really need a help , can any please tell weather it can be done..!