My knowledge of frontend coding is limited, so please bear with me.
Initially, my website was using MVCContrib grid along with its own CSS style. Recently, I switched to Bootstrap which caused MVCContrib to stop working. I've been struggling to integrate MVCContrib into Bootstrap despite multiple attempts.
Now, I am utilizing straight HTML and Razor to display my table grid. I'm trying to incorporate my existing dataTable JS files for pagination, sorting, etc., but I keep encountering an error:
"Unable to get property 'pageButton' of undefined or null reference."
I'm not sure where I'm going wrong. This is a trimmed down version of how my page looks now - I've only changed the names.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
@model grepTMVC.Models.THeaderModelList
...
If someone could provide assistance...
The error mentioned above seems to be related to dataTables.bootstrap.js.
Below is the function in the JS file where the error is occurring:
/* Bootstrap paging button renderer */
DataTable.ext.renderer.pageButton.bootstrap = function ( settings, host, idx, buttons, page, pages ) {
var api = new DataTable.Api( settings );
var classes = settings.oClasses;
var lang = settings.oLanguage.oPaginate;
var aria = settings.oLanguage.oAria.paginate || {};
var btnDisplay, btnClass, counter=0;
...