186 comments

I have made a few changes that helped me implement.

DATATABLE-COLUMN-FILTER: assets/js/king-table.js

The example used defines the number of columns in the table to 5. I have updated to add filtering on any number of columns in the table:

/* column filters */
if( $('.datatable-column-filter').length > 0 ) {

var dtTable = $('.datatable-column-filter').DataTable({ // use DataTable, not dataTable
sDom: // redefine sDom without lengthChange and default search box
"t"+
"<'row'<'col-sm-6'i><'col-sm-6'p>>"
});

var cols = dtTable.columns().header().length;

var tr = document.createElement("tr");
tr.className = "row-filter";

for (i = 0; i < cols; i++) {

var th = document.createElement("th");

var inpt = document.createElement("input");
inpt.type = "text";
inpt.className = "form-control input-sm";

th.appendChild(inpt);

tr.appendChild(th);

};

$('.datatable-column-filter thead').append(tr);

MAIN NAVIGATION: assets/js/king-common.js

I replaced $('.main-menu .js-sub-menu-toggle').on('click', function(e){
with $(document).on('click', '.main-menu .js-sub-menu-toggle', function(e){

I have updated this because I add elements to the main-menu via DOM on document.ready, the supplied example doesn't work because the side-bar has already been rendered and when you click on the menu items nothing happens, this fixes that.

$(document).on('click', '.main-menu .js-sub-menu-toggle', function(e){

e.preventDefault();

$li = $(this).parent('li');
if( !$li.hasClass('active')){
$li.find(' > a .toggle-icon').removeClass('fa-angle-left').addClass('fa-angle-down');
$li.addClass('active');
$li.find('ul.sub-menu')
.slideDown(300);
}
else {
$li.find(' > a .toggle-icon').removeClass('fa-angle-down').addClass('fa-angle-left');
$li.removeClass('active');
$li.find('ul.sub-menu')
.slideUp(300);
}
});
Problem with DATATABLE-COLUMN-FILTER in my updated example, if you use colspan on any row then you will receive the error message "DataTables warning: table id=DataTables_Table_0 - Requested unknown parameter '1' for row 2. For more information about this error, please see http://datatables.net/tn/4".

Because I do not use colspan I don't care, so FYI
I didn't include an example, but you can put colspan and rowspan outside of tbody and thead and it will work, however, it may not be the fix all that you need.
Concept PURCHASED
good afternoon, I'm implementing the bar chart that has in the examples but when I put the same code exactly javascript the code does not stick with multiple bars, the graphic gets with a single bars with the three information..because I'm using the code exactly How are you in the sample? Please help me.

Write a comment

This is a great way to give the seller feedback and ask them questions about their item.

You must sign in to write a comment

Sign in or sign up to make a purchase

$14
2582Purchases

Licenses: Details »

Single application $14
Version:1.6.2
Type:
  • HTML Template
Bootstrap: Compatible with 3.3.x
Layouts:
  • Responsive
  • Fluid
Browsers:
  • IE 9, 10, 11
  • Latest Chrome
  • Latest Firefox
  • Latest Safari
Uses Less:No
Uses Sass:Yes
Category:
Topic: General
Labels: admin, admin dashboard, charts, components, dashboard, responsive dashboard, sass, ui, ux
Item#:WB09JXK43
Released:4 years ago
Updated:12 months ago
Sold exclusively on WrapBootstrap
thedevelovers

thedevelovers

Signed up 4 years ago

Need a front-end template?

About Bootstrap

Bootstrap is designed to help people of all skill levels – designer or developer, huge nerd or early beginner. Use it as a complete kit or use it to start something more complex.

Unlike other front-end toolkits, Bootstrap was designed first and foremost as a styleguide to document not only its features, but best practices and living, coded examples.

Built to support new HTML5 elements and syntax with progressively enhanced components.

Browser support

Bootstrap is tested and supported in major modern browsers like Chrome, Firefox, and Internet Explorer.

Tested and supported in Chrome, Safari, Firefox, Internet Explorer, and Opera.
  • Latest Chrome
  • Latest Firefox
  • Latest Safari
  • Latest Edge
  • Internet Explorer 9/10/11
  • Latest Opera

Features & includes

Bootstrap provides an unparalleled array of features and reusable components that let you hit the ground running: