Change progress bar colour based on progress value
Changing a progress bar colour based on what value its progress is at. This is done using jQuery and the default Bootstrap colour classes. CodePen example. The jQuery: $(document).ready(function ()…
jQuery autocomplete input example
How to do a jQuery autocomplete input element from an array source. autocomplete gives the ability to find and select from a compiled list of values, helping aid searching. CodePen…
DataTables link in column example
An example of putting links in DataTables columns that includes the rows data. This is done with column render whereby you want to modify the data being outputted by DataTables….
Draggable Bootstrap grid with order saving
A draggable Bootstrap grid that will save the order for future usage. The drag feature is implemented with gridstrap.js. The concept being on page load get the grid order from…
DataTables example with Ajax
How to use DataTables with Ajax calls to fetch and fill the table with data. There are multiple ways to source the data for your table, Ajax being one of…
Live toggle button status update with AJAX
How to make a live Bootstrap toggle button switch update by using Ajax and jQuery. The toggle button updates live to the database with no page reloading needed. I have…
Simple pretty URL’s with PHP and the htaccess file
An easy method of doing simplified or pretty URLs with PHP and a htaccess file. Using prettified URL’s looks good, clean, helps readability and is a positive for SEO. Two…
jQuery show, hide, remove and create element example
Using jQuery to show, hide and remove HTML content as well as the differences between using hide and remove. Hide In jQuery hide() sets the element to display: none; meaning…
DataTables example with PHP and PDO MySQL
DataTables is an advanced table plugin for jQuery which easily brings features like pagination, searching and ordering for many data sources. This post is showing how to use DataTables with…
Button click to fade in and out content with jQuery
Example of button click to fade in and out content with toggle state using jQuery. CodePen example. Firstly a couple of functions: The fade out and remove the element function:…