Problem with individual column sorting.

jasch2244

I currently have the code working fine with search filters for all and individual columns:
[code)var oTable;
var asInitVals = new Array();

$(document).ready(function() {
oTable = $('#example').dataTable( {
"sPaginationType": "two_button",
"bPaginate": true,
"bStateSave": true,
"bProcessing": true,
"bLengthChange": true,
"iDisplayLength": 15,
"bSort": true,
"oLanguage": {
"sSearch": "Search all columns:"
}

} );

$("tfoot input").keyup( function () {
/* Filter on the column (the index) of this element */
oTable.fnFilter( this.value, $("tfoot input").index(this) );
} );



/*
* Support functions to provide a little bit of 'user friendlyness' to the textboxes in
* the footer
*/
$("tfoot input").each( function (i) {
asInitVals[i] = this.value;
} );

$("tfoot input").focus( function () {
if ( this.className == "search_init" )
{
this.className = "";
this.value = "";
}
} );

$("tfoot input").blur( function (i) {
if ( this.value == "" )
{
this.className = "search_init";
this.value = asInitVals[$("tfoot input").index(this)];
}
} );
} );[/code]

My problem is when I want to have all the same functionality without a few colums not being able to be sorted (because they have e-mail gfx or other icons in the grid / table). When I change the above code to :
[code)oTable = $('#example').dataTable( {
"sPaginationType": "two_button",
"bPaginate": true,
"bStateSave": true,
"bProcessing": true,
"bLengthChange": true,
"iDisplayLength": 15,
"bSort": true,
"aoColumns": [
null,
null,
null,
null,
null,
{ "bSortable": true },
{ "bSortable": true },
{ "bSortable": true }
] "oLanguage": {
"sSearch": "Search all columns:"
}[/code]

The search all filter goes away and the page does not function properly. What am I missing here I'm not the best with java script, but did the best I could do after reading the documentation.

allan

Hi jasch2244,

It looks like you are settings quite a few parameters to their default value - this isn't really needed (bPaginate is true be default for example). Going further with this, the bSortable default is true, so if you want a column to be not sortable you need to set it to be false ( http://datatables.net/usage#bSortable ). The other thing is that you have a couple of syntax errors around "oLanguage"

How about:

[code]
oTable = $('#example').dataTable( {
"bStateSave": true,
"bProcessing": true,
"iDisplayLength": 15,
"aoColumns": [
{ "bSortable": false },
{ "bSortable": false },
{ "bSortable": false },
{ "bSortable": false },
{ "bSortable": false },
null,
null,
null
],
"oLanguage": {
"sSearch": "Search all columns:"
}
} );
[/code]

Allan

jasch2244

Hum, that still does not work as I'm losing my search all input tag and the inputs in the tfooter don't work properly either. I have included my table layout so you can see the structure (disregard coldfusion markup it's just running a query) also, I'm thinking the code error might be in what you included in the example file- this will be below the table in my example below:

TABLE:
[code]



Status
Address
First Name
Last Name
List Price
Expires
Delete
Modify





#Listings.Status#
#Trim(Listings.StreetAddress)#
#Listings.FirstName#
#Listings.LastName#
#replace(dollarFormat(Listings.ListPrice), ".00", "")#
#DateFormat(Listings.ExpirationDate, "m/dd/yy")#













 
 



[/code]

OTHER CODE INCLUDED IN YOUR EXAMPLE FILE (Keep in mind I don't want all of the columns to sort so I'm wondering if there is no input in a column maybe it's throwing the code for an endless loop of some sort)
[code]
"oLanguage": {
"sSearch": "Search all columns:"
}
} );

$("tfoot input").keyup( function () {
/* Filter on the column (the index) of this element */
oTable.fnFilter( this.value, $("tfoot input").index(this) );
} );



/*
* Support functions to provide a little bit of 'user friendlyness' to the textboxes in
* the footer
*/
$("tfoot input").each( function (i) {
asInitVals[i] = this.value;
} );

$("tfoot input").focus( function () {
if ( this.className == "search_init" )
{
this.className = "";
this.value = "";
}
} );

$("tfoot input").blur( function (i) {
if ( this.value == "" )
{
this.className = "search_init";
this.value = asInitVals[$("tfoot input").index(this)];
}
} );
} );


[/code]

jasch2244

Disregard I copied the code in the wrong place. It works great now. Awesome!

allan

Excellent stuff - good to hear you got it sorted :-)

Allan