[code]
/*
* This source file is free software, under either the GPL v2 license or a
* BSD style license, as supplied with this software.
*
* This source file is distributed in the hope that it will be useful, but
* WITHOUT ANY WARRANTY; without even the implied warranty of MERCHANTABILITY
* or FITNESS FOR A PARTICULAR PURPOSE.
* Parameters:
*/
jQuery.fn.dataTableExt.oApi.fnSearchHighlighting = function(oSettings) {
// Initialize regex cache
oSettings.oPreviousSearch.oSearchCaches = {};
oSettings.oApi._fnCallbackReg(oSettings, 'aoRowCallback', function(nRow, aData, iDisplayIndex, iDisplayIndexFull) {
// Initialize search string array
var searchStrings = [];
var oApi = this.oApi;
var cache = oSettings.oPreviousSearch.oSearchCaches;
// Global search string
// If there is a global search string, add it to the search string array
if (oSettings.oPreviousSearch.sSearch) {
searchStrings.push(oSettings.oPreviousSearch.sSearch);
}
// Individual column search option object
// If there are individual column search strings, add them to the search string array
if ((oSettings.aoPreSearchCols) && (oSettings.aoPreSearchCols.length > 0)) {
for (var i in oSettings.aoPreSearchCols) {
if (oSettings.aoPreSearchCols[i].sSearch) {
searchStrings.push(oSettings.aoPreSearchCols[i].sSearch);
}
}
}
// Create the regex built from one or more search string and cache as necessary
if (searchStrings.length > 0) {
var sSregex = searchStrings.join("|");
if (!cache[sSregex]) {
// This regex will avoid in HTML matches
cache[sSregex] = new RegExp("(" + sSregex + ")(?!([^<]+)?>)", 'i');
}
var regex = cache[sSregex];
}
// Loop through the rows/fields for matches
$('td', nRow).each(function(i) {
// Take into account that ColVis may be in use
var j = oApi._fnVisibleToColumnIndex(oSettings, i);
// Only try to highlight if the cell is not empty or null
if (aData[j]) {
// If there is a search string try to match
if ((typeof sSregex !== 'undefined') && (sSregex)) {
this.innerHTML = aData[j].replace(regex, function(matched) {
return "" + matched + "";
});
}
// Otherwise reset to a clean string
else {
this.innerHTML = aData[j];
}
}
});
return nRow;
}, 'row-highlight');
return this;
};
[/code]
please check if you have de necessary css code
[code]
/*
SearchHighlighting
*/
.filterMatches
{
background-color: #BFFF00;
}
[/code]
oSettings.oApi._fnCallbackReg( oSettings, 'aoRowCallback', function( nRow, aData, iDisplayIndex, iDisplayIndexFull) {
// Initialize search string array
var searchStrings = [];
var oApi = this.oApi;
var cache = oSettings.oPreviousSearch.oSearchCaches;
// Global search string
// If there is a global search string, add it to the search string array
if (oSettings.oPreviousSearch.sSearch) {
searchStrings.push(oSettings.oPreviousSearch.sSearch);
}
// Individual column search option object
// If there are individual column search strings, add them to the search string array
if ((oSettings.aoPreSearchCols) && (oSettings.aoPreSearchCols.length > 0)) {
for (var i in oSettings.aoPreSearchCols) {
if (oSettings.aoPreSearchCols[i].sSearch) {
searchStrings.push(oSettings.aoPreSearchCols[i].sSearch);
}
}
}
// Create the regex built from one or more search string and cache as necessary
if (searchStrings.length > 0) {
var sSregex = searchStrings.join("|");
if (!cache[sSregex]) {
var regRules = "("
, regRulesSplit = sSregex.split(' ');
First, I'll like to thanks everyone here that share all the knowledge, and special thanks to the creator of DataTables.
I've used DataTables before, but I never used plugins like this one, and I'm having some problems trying to implemento this highlighting function. I have the 1.9v and I'm using server-side procesing, DataTables filtering API example and MultiFilter.
function fnFilterColumn ( i )
{
$('#example').dataTable().fnFilter(
$("#col"+(i+1)+"_filter").val(),
i,
$("#col"+(i+1)+"_regex")[0].checked,
$("#col"+(i+1)+"_smart")[0].checked
);
}
$("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;
} );
Replies
[code]
...
"fnServerData": function(sSource,aoData,fnCallback) {
aoData.push( { "name": "name", "value": "value" } );
$.ajax( {
"dataType": 'json',
"type": "POST",
"url": sSource,
"data": aoData,
"success": fnCallback,
"complete":function(){
$filtro = $('.dataTables_filter input');
if ($filtro.val().length < 3) return;
$('#listado_alumnos').highlight($filtro.val());
}
} );
},
...
[/code]
on datatable config
here is the code i am trying:
[code]
dataSave = function() {
var aRowIndexes = new Array();
for(var i = 0; i < RowSize; i++){ aRowData = aoTable.fnGetData(aRowIndexes[i]); var testColumns = aRowData[i].toString().trim().split(','); for ( var j = 0; j < testColumns.length; j++) { if(testColumns[j].blank()){ alert("Invalid Data at Row : "+(i+1)+" Column:"+(j+1));
}
}
[/code]
Thanks in Advance
}
Thank you
Allan
[code]
/*
* This source file is free software, under either the GPL v2 license or a
* BSD style license, as supplied with this software.
*
* This source file is distributed in the hope that it will be useful, but
* WITHOUT ANY WARRANTY; without even the implied warranty of MERCHANTABILITY
* or FITNESS FOR A PARTICULAR PURPOSE.
* Parameters:
*/
jQuery.fn.dataTableExt.oApi.fnSearchHighlighting = function(oSettings) {
// Initialize regex cache
oSettings.oPreviousSearch.oSearchCaches = {};
oSettings.oApi._fnCallbackReg(oSettings, 'aoRowCallback', function(nRow, aData, iDisplayIndex, iDisplayIndexFull) {
// Initialize search string array
var searchStrings = [];
var oApi = this.oApi;
var cache = oSettings.oPreviousSearch.oSearchCaches;
// Global search string
// If there is a global search string, add it to the search string array
if (oSettings.oPreviousSearch.sSearch) {
searchStrings.push(oSettings.oPreviousSearch.sSearch);
}
// Individual column search option object
// If there are individual column search strings, add them to the search string array
if ((oSettings.aoPreSearchCols) && (oSettings.aoPreSearchCols.length > 0)) {
for (var i in oSettings.aoPreSearchCols) {
if (oSettings.aoPreSearchCols[i].sSearch) {
searchStrings.push(oSettings.aoPreSearchCols[i].sSearch);
}
}
}
// Create the regex built from one or more search string and cache as necessary
if (searchStrings.length > 0) {
var sSregex = searchStrings.join("|");
if (!cache[sSregex]) {
// This regex will avoid in HTML matches
cache[sSregex] = new RegExp("(" + sSregex + ")(?!([^<]+)?>)", 'i');
}
var regex = cache[sSregex];
}
// Loop through the rows/fields for matches
$('td', nRow).each(function(i) {
// Take into account that ColVis may be in use
var j = oApi._fnVisibleToColumnIndex(oSettings, i);
// Only try to highlight if the cell is not empty or null
if (aData[j]) {
// If there is a search string try to match
if ((typeof sSregex !== 'undefined') && (sSregex)) {
this.innerHTML = aData[j].replace(regex, function(matched) {
return "" + matched + "";
});
}
// Otherwise reset to a clean string
else {
this.innerHTML = aData[j];
}
}
});
return nRow;
}, 'row-highlight');
return this;
};
[/code]
please check if you have de necessary css code
[code]
/*
SearchHighlighting
*/
.filterMatches
{
background-color: #BFFF00;
}
[/code]
Joao Noronha
Have a look at this image: http://i.minus.com/iZyjtkGrrrPmg.png
[code]
// HIGHLIGHT FCT
jQuery.fn.dataTableExt.oApi.fnSearchHighlighting = function(oSettings) {
// Initialize regex cache
oSettings.oPreviousSearch.oSearchCaches = {};
oSettings.oApi._fnCallbackReg( oSettings, 'aoRowCallback', function( nRow, aData, iDisplayIndex, iDisplayIndexFull) {
// Initialize search string array
var searchStrings = [];
var oApi = this.oApi;
var cache = oSettings.oPreviousSearch.oSearchCaches;
// Global search string
// If there is a global search string, add it to the search string array
if (oSettings.oPreviousSearch.sSearch) {
searchStrings.push(oSettings.oPreviousSearch.sSearch);
}
// Individual column search option object
// If there are individual column search strings, add them to the search string array
if ((oSettings.aoPreSearchCols) && (oSettings.aoPreSearchCols.length > 0)) {
for (var i in oSettings.aoPreSearchCols) {
if (oSettings.aoPreSearchCols[i].sSearch) {
searchStrings.push(oSettings.aoPreSearchCols[i].sSearch);
}
}
}
// Create the regex built from one or more search string and cache as necessary
if (searchStrings.length > 0) {
var sSregex = searchStrings.join("|");
if (!cache[sSregex]) {
var regRules = "("
, regRulesSplit = sSregex.split(' ');
regRules += "("+ sSregex +")";
for(var i=0; i
but i must say it is not mine, someone else is due the original code (i confess not to remember who), my contribuition was small.
First, I'll like to thanks everyone here that share all the knowledge, and special thanks to the creator of DataTables.
I've used DataTables before, but I never used plugins like this one, and I'm having some problems trying to implemento this highlighting function. I have the 1.9v and I'm using server-side procesing, DataTables filtering API example and MultiFilter.
My code is something like this:
[code]
var asInitVals = new Array();
function fnFilterGlobal ()
{
$('#example').dataTable().fnFilter(
$("#global_filter").val(),
null,
$("#global_regex")[0].checked,
$("#global_smart")[0].checked
);
}
function fnFilterColumn ( i )
{
$('#example').dataTable().fnFilter(
$("#col"+(i+1)+"_filter").val(),
i,
$("#col"+(i+1)+"_regex")[0].checked,
$("#col"+(i+1)+"_smart")[0].checked
);
}
$(document).ready(function() {
var oTable = $('#example').dataTable( {
"iDisplayLength": 10,
"aLengthMenu": [[10, 25, 50, 100, -1], [10, 25, 50, 100, "Todos"]],
"bProcessing": true,
"bServerSide": true,
"sAjaxSource": "scripts/server_processing.php",
"oLanguage": {
"sSearch": "Search all columns:",
// "sProcessing": ""
"sProcessing": "Buscando resultados..."
}
} );
oTable.fnSearchHighlighting();
$("#global_filter").keyup( fnFilterGlobal );
$("#global_regex").click( fnFilterGlobal );
$("#global_smart").click( fnFilterGlobal );
$("#col1_filter").keyup( function() { fnFilterColumn( 0 ); } );
$("#col1_regex").click( function() { fnFilterColumn( 0 ); } );
$("#col1_smart").click( function() { fnFilterColumn( 0 ); } );
$("#col2_filter").keyup( function() { fnFilterColumn( 1 ); } );
$("#col2_regex").click( function() { fnFilterColumn( 1 ); } );
$("#col2_smart").click( function() { fnFilterColumn( 1 ); } );
$("#col3_filter").keyup( function() { fnFilterColumn( 2 ); } );
$("#col3_regex").click( function() { fnFilterColumn( 2 ); } );
$("#col3_smart").click( function() { fnFilterColumn( 2 ); } );
$("#col4_filter").keyup( function() { fnFilterColumn( 3 ); } );
$("#col4_regex").click( function() { fnFilterColumn( 3 ); } );
$("#col4_smart").click( function() { fnFilterColumn( 3 ); } );
$("#col5_filter").keyup( function() { fnFilterColumn( 4 ); } );
$("#col5_regex").click( function() { fnFilterColumn( 4 ); } );
$("#col5_smart").click( function() { fnFilterColumn( 4 ); } );
$("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]
I also have the version of the script that olragon posted above, before the tag.
The problem is that it simply doesn't work! =(
I also added the css style, but nothing happens... Does someone know what's the problem?
Thanks in advance!!
Cheers,
Luciano