Since changing to a new theme I have some probs including DataTables. jQuery is only called once and it is placed at the correct position, so basically everything correct.
I receive messages like
TypeError: $(...).DataTable is not a function
or
TypeError: $ is undefined
Beneath the DataTables I have a different JS with load() and with a similar problem. There I could fix it while putting this:
jQuery(document).ready(function($){
before this:
$("#tmp").load("tmp.htm")
I've read on some boards, that there could be an issue with the place-holder $. Anyway, the part above solves my problem. But back to the DataTables. I think it's the same problem, but I'm unable to understand the problem.
My Table starts with:
$(document).ready(function() {
var tabelle = $('#mytable').DataTable(
But with this before..
jQuery(document).ready(function($){
I do only get errors. Could somebody please help me?
++++++++ UPDATE ++++++++
<script type="text/javascript" language="javascript" class="init">
$.fn.dataTable.pipeline = function ( opts ) {
// Configuration options
var conf = $.extend( {
pages: 5, // number of pages to cache
url: '', // script url
data: null, // function or object with parameters to send to the server
// matching how `ajax.data` works in DataTables
method: 'GET' // Ajax HTTP method
}, opts );
// Private variables for storing the cache
var cacheLower = -1;
var cacheUpper = null;
var cacheLastRequest = null;
var cacheLastJson = null;
return function ( request, drawCallback, settings ) {
var ajax = false;
var requestStart = request.start;
var requestLength = request.length;
var requestEnd = requestStart + requestLength;
if ( settings.clearCache ) {
// API requested that the cache be cleared
ajax = true;
settings.clearCache = false;
}
else if ( cacheLower < 0 || requestStart < cacheLower || requestEnd > cacheUpper ) {
// outside cached data - need to make a request
ajax = true;
}
else if ( JSON.stringify( request.order ) !== JSON.stringify( cacheLastRequest.order ) ||
JSON.stringify( request.columns ) !== JSON.stringify( cacheLastRequest.columns ) ||
JSON.stringify( request.search ) !== JSON.stringify( cacheLastRequest.search )
) {
// properties changed (ordering, columns, searching)
ajax = true;
}
// Store the request for checking next time around
cacheLastRequest = $.extend( true, {}, request );
if ( ajax ) {
// Need data from the server
if ( requestStart < cacheLower ) {
requestStart = requestStart - (requestLength*(conf.pages-1));
if ( requestStart < 0 ) {
requestStart = 0;
}
}
cacheLower = requestStart;
cacheUpper = requestStart + (requestLength * conf.pages);
request.start = requestStart;
request.length = requestLength*conf.pages;
// Provide the same `data` options as DataTables.
if ( $.isFunction ( conf.data ) ) {
// As a function it is executed with the data object as an arg
// for manipulation. If an object is returned, it is used as the
// data object to submit
var d = conf.data( request );
if ( d ) {
$.extend( request, d );
}
}
else if ( $.isPlainObject( conf.data ) ) {
// As an object, the data given extends the default
$.extend( request, conf.data );
}
settings.jqXHR = $.ajax( {
"type": conf.method,
"url": conf.url,
"data": request,
"dataType": "json",
"cache": false,
"success": function ( json ) {
cacheLastJson = $.extend(true, {}, json);
if ( cacheLower != requestStart ) {
json.data.splice( 0, requestStart-cacheLower );
}
json.data.splice( requestLength, json.data.length );
drawCallback( json );
}
} );
}
else {
json = $.extend( true, {}, cacheLastJson );
json.draw = request.draw; // Update the echo for each response
json.data.splice( 0, requestStart-cacheLower );
json.data.splice( requestLength, json.data.length );
drawCallback(json);
}
}
};
$.fn.dataTable.Api.register( 'clearPipeline()', function () {
return this.iterator( 'table', function ( settings ) {
settings.clearCache = true;
} );
} );
$(document).ready(function() {
var tabelle = $('#mytable').DataTable(
{
"processing": true,
"serverSide": true,
"ajax": $.fn.dataTable.pipeline(
{
url: 'source.htm',
pages: 1
}
),
.....
}
);
} );
</script>
Since changing to a new theme I have some probs including DataTables. jQuery is only called once and it is placed at the correct position, so basically everything correct.
I receive messages like
TypeError: $(...).DataTable is not a function
or
TypeError: $ is undefined
Beneath the DataTables I have a different JS with load() and with a similar problem. There I could fix it while putting this:
jQuery(document).ready(function($){
before this:
$("#tmp").load("tmp.htm")
I've read on some boards, that there could be an issue with the place-holder $. Anyway, the part above solves my problem. But back to the DataTables. I think it's the same problem, but I'm unable to understand the problem.
My Table starts with:
$(document).ready(function() {
var tabelle = $('#mytable').DataTable(
But with this before..
jQuery(document).ready(function($){
I do only get errors. Could somebody please help me?
++++++++ UPDATE ++++++++
<script type="text/javascript" language="javascript" class="init">
$.fn.dataTable.pipeline = function ( opts ) {
// Configuration options
var conf = $.extend( {
pages: 5, // number of pages to cache
url: '', // script url
data: null, // function or object with parameters to send to the server
// matching how `ajax.data` works in DataTables
method: 'GET' // Ajax HTTP method
}, opts );
// Private variables for storing the cache
var cacheLower = -1;
var cacheUpper = null;
var cacheLastRequest = null;
var cacheLastJson = null;
return function ( request, drawCallback, settings ) {
var ajax = false;
var requestStart = request.start;
var requestLength = request.length;
var requestEnd = requestStart + requestLength;
if ( settings.clearCache ) {
// API requested that the cache be cleared
ajax = true;
settings.clearCache = false;
}
else if ( cacheLower < 0 || requestStart < cacheLower || requestEnd > cacheUpper ) {
// outside cached data - need to make a request
ajax = true;
}
else if ( JSON.stringify( request.order ) !== JSON.stringify( cacheLastRequest.order ) ||
JSON.stringify( request.columns ) !== JSON.stringify( cacheLastRequest.columns ) ||
JSON.stringify( request.search ) !== JSON.stringify( cacheLastRequest.search )
) {
// properties changed (ordering, columns, searching)
ajax = true;
}
// Store the request for checking next time around
cacheLastRequest = $.extend( true, {}, request );
if ( ajax ) {
// Need data from the server
if ( requestStart < cacheLower ) {
requestStart = requestStart - (requestLength*(conf.pages-1));
if ( requestStart < 0 ) {
requestStart = 0;
}
}
cacheLower = requestStart;
cacheUpper = requestStart + (requestLength * conf.pages);
request.start = requestStart;
request.length = requestLength*conf.pages;
// Provide the same `data` options as DataTables.
if ( $.isFunction ( conf.data ) ) {
// As a function it is executed with the data object as an arg
// for manipulation. If an object is returned, it is used as the
// data object to submit
var d = conf.data( request );
if ( d ) {
$.extend( request, d );
}
}
else if ( $.isPlainObject( conf.data ) ) {
// As an object, the data given extends the default
$.extend( request, conf.data );
}
settings.jqXHR = $.ajax( {
"type": conf.method,
"url": conf.url,
"data": request,
"dataType": "json",
"cache": false,
"success": function ( json ) {
cacheLastJson = $.extend(true, {}, json);
if ( cacheLower != requestStart ) {
json.data.splice( 0, requestStart-cacheLower );
}
json.data.splice( requestLength, json.data.length );
drawCallback( json );
}
} );
}
else {
json = $.extend( true, {}, cacheLastJson );
json.draw = request.draw; // Update the echo for each response
json.data.splice( 0, requestStart-cacheLower );
json.data.splice( requestLength, json.data.length );
drawCallback(json);
}
}
};
$.fn.dataTable.Api.register( 'clearPipeline()', function () {
return this.iterator( 'table', function ( settings ) {
settings.clearCache = true;
} );
} );
$(document).ready(function() {
var tabelle = $('#mytable').DataTable(
{
"processing": true,
"serverSide": true,
"ajax": $.fn.dataTable.pipeline(
{
url: 'source.htm',
pages: 1
}
),
.....
}
);
} );
</script>
-
1
The errors you state imply that either jQuery (
$) or DataTables ($.DataTable) are not being loaded correctly, or are being accessed in the wrong order. Can you please add your full initialisation code and the HTML which includes these scripts. – Rory McCrossan Commented Dec 18, 2014 at 11:58 - can you check whether datatable library is included below jquery library. – Hoja Commented Dec 18, 2014 at 11:59
- @Hoja.M.A As I said in the introduction, the sorting is correct. – Sebastian Commented Dec 18, 2014 at 12:02
2 Answers
Reset to default 4I had same problem and the code below solves the issue
jQuery(document).ready(function($){
This solves the problem. Adding the line below the initiating body-tag:
<script> $ = jQuery; </script>
发布者：admin，转转请注明出处：http://www.yc00.com/questions/1745048577a4608245.html
评论列表（0条）