Setting HTML date input value
How to set the default value to a HTML date input using vanilla JS or jQuery, including a method to set the date to be 1 month from now. The…
Tag: jQuery
Show & hide Bootstrap modal with jQuery
Opening and closing a Bootstrap modal using the traditional button method and then with jQuery targeting with a button click. CodePen example. Traditional way Opening (showing) the modal the traditional…
Bootstrap cards as selectable radio buttons
Turning bootstrap cards into selectable radio buttons with active states using jQuery. CodePen example. To do this you will need Bootstrap and jQuery. Function to unselect (uncheck) all of the…
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…
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…
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…
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…
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:…
HTML MySQL Table edit with no page reloading via Ajax
An example of updating or editing an HTML table from MySQL data without reloading or changing pages thanks to Jquery and Ajax. The Ajax requests are done API style to…