jQuery select closest text and input values example
Using jQuery to select text and input values based on closest parameters. CodePen example. closest() will get the first element matching by traversing up, whilst find() will descend until the…
Tag: JS
Vanilla Javascript basics; Adding and removing classes
Adding and removing classes to HTML elements with vanilla Javascript. Also included is a toggle and replace method. Adding a class name to an element with classList.add() document.getElementById(“theId”).classList.add(“green-text”); Add multiple…
Vanilla Javascript basics; Selecting elements based on id or class
Doing vanilla Javascript selecting or setting elements with their id or class name. Selecting Selecting a HTML element with its id with getElementById(): document.getElementById(“theId”); Selecting an element based on the…
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…
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…
Loading Javascript files after page has finished loading
How to load a javascript file only once the page has finished loading. This is done with a document event listener that will run when the content has been fully…
Doing an Ajax call without jQuery
How to make calls without Ajax in vanilla Javascript. Using Ajax requires jQuery, whilst it is a convenience, including the whole jQuery library for just Ajax is overboard. Here is…
Live time and date with vanilla Javascript
A live and active time and date with vanilla Javascript. CodePen example. Start by setting variables for the date string: var today = new Date(); var day = today.getDate(); var…
Infinite scrolling with AJax calls
A working example for an infinite scrolling page with a Jquery Ajax request. Upon reaching the bottom of the page the Ajax call function is used to retrieve random words…
Javascript click button to copy textarea or input
How to do a button click to copy for a text box or input with HTML and a little bit of Javascript. The HTML (bootstrap): <div class=”container”> <div class=”row mt-2″>…