Search
Search Code
jqueryui date selector with examples and code with custom date formatting
Datepicker using jquery ui with current date and date formatting. as dd-mm-yy Example Date formatting with selector
Add font awesome icons as placeholder text in inputs
An old one i found on codepen, works with only the old version of font awesome i think. Not tested on the later versions.
Are you sure you want to navigate away from this page? #JavaScript warning
You only need to include one of these scripts as the top one seems to work fine by its self not requiring any jquery. Javascript window.onbeforeunload = function (e) { return "You..
php validate email function
php function that can be used to validate an email address string
basic radio checklist - check and item and get its value in a textarea
a basic radio input type checklist, where you can only select one of the items in the list. Ok so no longer so basic. This script allows you to fil the value of a text area with the valu..
using the :user-valid CSS pseudo-class
It seems this is currently only working in firefox. Here is a test of the code in firefox, you can see if you add a "valid" email address it will add a border and a green tick.
bootstrap form basic
a nice simple bootstrap form layout example template
get directions from google maps form embed
this is a random form that posts back to google maps showing the directions needed to get from one address to another location, im not sure where this would be usefull. Maybe on a site where you neede..
Input Suggestions using a datalist
I found this cool piece of code here, looks very handy. Basically you can add the input and then provide it a data list with suggestions, which then will allow you to start typing the item and it wil..
validate email address from string with jquery working function
Here is a working example of this post validate email address from string. This has very basic checking of an email address by checking that the string has an @ and a . in it. Note: this is still no..
change selected color on input elements css
this can be useful if you are using darker form elements and they happen to have white on white text, so you can target the :focus on the input. here is the text input before the colour change, the c..
get the value from a range input field with javascript
this script will retrieve the current value from a range slider html input if you want the value to only update when the slider interaction has been stopped change the oninput to onchange then it w..
404 Error Page Codepen
found this in my links the other day, still looks cool...
for auto filled fields, need to change the text and background colours
for some reason bootstrap or the browser is doing this to auto filled fields. according to my searching there is a pseudo class added to auto filled fields CSS input:-webkit-autofill { col..
check box highlight text area css
i just wanted to be able to highlight a text field if a certain check box was checked on a form in this demo below, if you click on the check1 checkbox it will give you an alert saying if the box is ..
validate an email address from a form field - version 2
This javascript function will check if the email address in the text box has an @ and a . in it and return a message saying if its valid or not. This is pretty basic as it only includes checkin..
check if a checkbox is checked with javascript
checks if the box is checked and returns true or false reusable function that can check if a checkbox is checked or not just pass it the id of the checkbox Javascript Usage check_my_box('check1');
form submit override with javascript
if you need to run some additional checks on a form before submitting it
submit a form with javascript onclick
submit a form with javascript, good if you want to submit a form with a button that is not within that form. the form will require an id
dropdown change input box on select
changes the value of an hidden input depending on the selection of the dropdown
clear a input field when it looses focus using onblur
this will cause the input field to clear when it is not in focus
inline form field padding
I noticed this when doing this demo (get the value of an input form element). Looks like inline form elements look pretty average when a button is added to the same line. i think this should..
get the value of an input form element (input value)
add how to get the value of an input form element with javascript for some reason i can get this working with: Javascript console.log(document.getElementById("my_input").value); but when trying to..
minutes to decimal calculator javascript version
trying to do a more simple version of this post. https://kruxor.com/view/code/NIjAQ/quick-tool-to-convert-time-into-decimal/ the php version requires post back to the server, so i think this c..
slick carousel jump to a slide on element hover
jumps to a specific slider on hover over on an element this is working now, here is the example, mouse over the buttons to see the slide change. trying to add this: Javascript $( selector ).mous..
jquery page search [testing]
just testing this one at the moment for a in page search. Based on this: https://codepen.io/chriscoyier/pen/ExgqWab I would like to adapt this code to search through page elements and ma..
test page for the custom css 12 grid used on this site
This is my testing page for the grid used on this site, it shows elements and other things for use on the grid and other general formatting.
add a jquery date picker to your text box
This JQuery UI Date picker is good if you want to add a nice dropdown date selector to your input box, rather than having to type in the date manually. Requires: JQuery JQuery UI Documen..
play a sound every # of seconds
This plays a beep sound every # of seconds, to stop it just reload the page 4 Minutes is 240 4.5 Minutes is 270 5 Minutes is 300
Quick tool to convert time into decimal
I needed a quick tool that can convert say 20 minutes into decimal, as im doing this a lot these days. Here is what i come up with, well you can google it as well and that works, but this form is a bi..
Bootstrap 4 Center menu items in a navbar
Here we have an example bootstrap navbar you can find the original navbar here. I just want to center the menu item links so they dont appear over to the left on larger screens. Add the follow..
Bootstrap Darkmode Switch
I have tried this before without success but i googled "Bootstrap Darkmode Switch" and found this repo at the top of the list. So i thought i would give it a try on here and see how it looks. Demo pag..
hide parts of a form until the 1st item is selected
this code can be used when you just want to show the 1st field on a form then when it is selected it shows the rest of the form elements
Dropdown Box with Searchable Text
Here we have a dropdown select box, that you can type into to search the available options. No Javascript Required for this the browser does all the work. Press into the text box, and you will see a..
image Checkbox Replacement for Forms
Some sites like to be a bit tricky and have some complicated form checkbox replacement which is not all that hard, just can be a bit annoying as you have to extract the images for this to work. Demo ..
round number with js
Round a number to two decimal places. code var rounded = Math.round(num * 100) / 100; demo Result... function round_val() { var val = $("#rval").val(); var rounded = Math.r..
Slick Slider Carousel
Edit: Sorry this page was broken for a bit, its fixed now with working examples! 😛 Nice and simple slider / carousel
load google sheet data into json string with jquery
Just discovered this the other day, you can actually export google sheets data into json format and load it directly into your site, how good is that. A free mini basic database! Initially i was lo..
clipboard copy js
for copying things to the clipboard, like the click to copy. Basic Usage Include the script <script src="js/clipboard.min.js"></script> add a field to copy to the clipboard..
using regex with replace to replace all instances of something in a string
so you have a string and you want to replace a recurring character, use this to do it: String Example: var string = "a-string-with-dashes.txt"; var string = "a-string-with-dashes.txt"; string..
jqueryui date selector with examples and code
This has to be one of the most used date picker items from jquery ui. And its usually the reason i even include jquery ui. Without using a theme this one looks pretty good. This version of it does n..
emoji data - version 1.0
Emoji Data version 1.0 This is a better emoji list that you can search by title ctrl + f emoji-data.txt # Emoji Data for UTR #51 # # File: emoji-data.txt # Version: 1.0 # Date: 20..
