You are here

The primary use of JavaScript is to write functions that are embedded in or included from HTML pages and that interact with the Document Object Model (DOM) of the page.
snippet - Create and Post HTML Form using Javascript
20 Mar, 2019
This snippet creates html form and submits it, the same way as browser submits form "with redirect". If you need the redirect not an ajax solution, for example credit card payment.
snippet - Convert to Integer in JavaScript
8 Nov, 2018
There are multiple ways to convert values to integer in javascript. Using Math.trunc gives the most accurate results.
written tutorial - React ES6: Styled Components
6 Oct, 2018
Styled components are the best way to give some visual aid to your components. The heavy lifting should be done by a library, it can be either material design, bootstrap, semantic, etc... To adjust...
snippet - jQuery form submit error detection
20 Dec, 2017
Snippet shows you how to catch errors like 404 when you submit form using jQuery.
snippet - React: Warning: Failed context type: The context `router` is marked as required in `Link`, but its value is `undefined`
25 Jul, 2017
Testing React components with Jest I got an error: "Warning: Failed context type: The context `router` is marked as required in `Link`, but its value is `undefined`.". I am using Link from react-...
snippet - Javascript: move item to end of array (of objects), by property value
29 May, 2017
The snippet shows how to move item to the end of array. In a case where we have an array of objects and we want to move the array item by property value. In this example I am using lodash/underscore...
snippet - JavaScript ES6: Clone Object
13 May, 2017
The Object.assign() method copies all properties from one or more source objects to a target object. It returns the target object. This can be used for cloning an object in ES6, just create an empty...
snippet - React: Wait for full render in snapshot testing
5 May, 2017
If you use full render not shallow in your tests, your tests might be rendered before the actual component and its subcomponents are fully loaded. In that case you need to delay the output, while...
snippet - Highcharts: full width lines
19 Apr, 2017
Highcharts has paddings and spacings that will make the area charts line appear inside of the chart element. To get full width line you need to disable some spacings and lines. You have to disable...
snippet - Highcharts: Hide link from footer
23 Mar, 2017
Highcharts comes with a credits link by default. This snippet shows how to hide the link using the configurations.
snippet - Highcharts: display no data message on top of the grid
22 Mar, 2017
No data is actually a module that needs to be loaded separately from the highcharts library. For some reason highcharts no data message is displayed below the grid. There is an easy fix of enabling...
snippet - Highcharts: Create a vertical line on highlighted value
21 Mar, 2017
You can create a vertical line on highlighted value in Highcharts. This might give a better visual when you have multiple lines. You could also use "shared: true" option in your tooltip to display...
snippet - webpack: Minify CSS in production
14 Mar, 2017
You can achieve this by adding a library that supports css minify to "webpack.config.js". In this snippet I use "optimize-css-assets-webpack-plugin" which uses cssnano for minimizing by default. The...
snippet - Delete object key and value in javascript
12 Oct, 2016
Deleting object value with key in javascript. For this you can use the delete operator. Permits you to remove a property from an object.
snippet - jQuery: Using selectionStart, selectionEnd, setSelectionRange
21 Jun, 2016
Using selectionStart, selectionEnd, setSelectionRange in jQuery example. You can't use DOM commands on jQuery objects directly, you have to get the first value of the object.
snippet - jQuery: Input - focus and select all
18 Apr, 2016
How to focus and select all using javascript. This snippet shows it in an example of "jQuery: Toggle input text using checkbox". For an example you can extend this to any event or action where you...
snippet - jQuery: Toggle input text using checkbox
18 Apr, 2016
Snippet shows how to toggle input text using checkbox. Sometimes you need to show text field only when a checkbox is checked, that can be called conditional text field. So you need a checkbox and a...
snippet - jQuery: Run something after $.each has completed
12 Apr, 2016
JavaScript runs asynchronously, that means when you initialize $.each every bit of code that comes after that will not be executed when $.each has finished. Sometimes you need your code to be...
snippet - Minify JavaScript from command line
8 Mar, 2016
This snippet shows how to minify javascript files from command line. Minifying JavaScript is useful in many respects. Most important are security and performance. Security is increased due to the...
snippet - Get previous / next element using JavaScript
8 Mar, 2016
This snippet shows how to get element next to your element / selector. This a part of dom traversal. Using javascript for next element parsing can be used to create some powerful dynamic content. I...
snippet - AddThis: Popup instead of hover box
25 Nov, 2015
AddThis is an awesome social sharing tool. It is fully customizable. I suggest using addthis module for loading add this library, this has performance options for the javascript loading.
snippet - Get cursor position in CKEditor
12 Jun, 2015
Get cursor position in CKEditor is simple if you know some facts. You have to have the instance initiated, so simple jQuery ready would not work. You can get selection and use that functionality to...
snippet - Uncaught TypeError: Cannot read property 'msie' of undefined
29 Jan, 2015
I had an error in "jquery.ui.mouse.min.js" when using jQuery 1.9 (or newer) with jQuery UI 1.8 (or older). This jquery plugin is used to restore deprecated functionalities in jQuery and removed as of...
written tutorial - Embed PDF in HTML
24 Oct, 2014
In general we are going to embed pdf in html. For this tutorial I am going to use PDF.js. It is a web platform for parsing and rendering PDF files. Canvas support is one of the main things that is...
snippet - Check if variable is a jQuery object
2 Jan, 2014
Checking that variable is a jQuery object. We are going to use instanceof and it returns true if the statement is true.
snippet - jQuery Catch Form Submit
29 Oct, 2013
Form submitting is really simple with jQuery. You can use submit function to submit form or catch a form submission and do something else.
snippet - Alter URL GET parameters using JavaScript
14 Aug, 2013
This function alters url get parameters using javascript. The function takes to consideration all aspects of url (parameter existis, hash, parameter doesn't exist). For an example if you need to be...
snippet - jQuery - Check if selector is disabled
7 Mar, 2013
You can use "is" to see if the form element is disabled.
snippet - Message before leaving the page - JavaScript / jQuery
8 Feb, 2013
How to display message before closing the page or moving to another page. Don't use this to annoy people. Sometimes this functionality is still useful, for an example if you have some sort of unsaved...
snippet - jQuery - Animate .prepend
2 Feb, 2013
Rather than simply dumping the HTML into the page you might want it to be animated. You can .hide() the content before doing a .prependTo(), then call .slideDown() on the element.
snippet - Get URL variables with JavaScript
21 Nov, 2012
This function gets URL variables in JavaScript. Current page url parameters will be parsed into array, that will be returned.
snippet - Monochrome Google Maps
19 Nov, 2012
This example shows how to create monocrome Google Maps. Where the map will be using only shades of grey (with or without black and/or white). It might also be called grayscale or black-and-white.
snippet - Get date on mouseover from cell in jQuery UI datepicker
14 May, 2012
This snippet shows you how to get date on mouseover from cell in jQuery UI datepicker.
snippet - Get current URL using jQuery
5 Apr, 2012
This shows you how to get the path of the current URL and assign it to a variable. This is achieved by taking url from location object. The location object also has other properties, like host, hash...
snippet - Checkboxes as radio buttons using jQuery
4 Dec, 2011
Make a group of checkboxes behave like radiobuttons.
snippet - Round numbers in JavaScript
1 Oct, 2011
This snippet shows you how to round a number to a specified number of decimal places in JavaScript.
snippet - Print JavaScript object
21 Sep, 2011
This snippet shows how to print JavaScript object.
snippet - Redirection in JavaScript
16 Aug, 2011
There are many ways of doing redirect in JavaScript this should be the standard implementation for changing the current window's location.
snippet - jQuery send form via AJAX using post method
29 Jun, 2011
This snippet sends form with id contactform using ajax via post method. When it's send and result is returned. It writes result into #feedback-form.
snippet - Always have latest jQuery version
29 Jun, 2011
To always have latest jQuery version, you can use this fast loading jQuery library from Google.
snippet - jQuery selector exists
16 Jun, 2011
This snippet shows how to check if jQuery selector exists.
written tutorial - Get and save jQuery window scroll position
24 May, 2011
Getting and save window scroll position with jQuery. You also need cookie plugin to store the position value in cookies, so it can be used after browser page changes.
snippet - Get text area value or text with jQuery
29 Apr, 2011
This snippet shows how to get html element textareas value or text with jQuery.
written tutorial - Switching Images With Arrows in JavaScript
7 Apr, 2011
This tutorial shows how to make image switcher with javascript. You can switch images by using arrows.
written tutorial - Searchbox Background Text with jQuery
24 Feb, 2011
This tutorial shows how to create background text to your search box that will dissapear on click/focus.
written tutorial - jQuery - Send Single Form Field via Post on Blur
19 Feb, 2011
This tutorial shows how to send a single form field/input of a form. We are going to use jQuerys ajax features to do that.
written tutorial - Get Values of Checkboxes Group with jQuery
9 Feb, 2011
This tutorial shows you how to get values of checkbox array using jQuery. You can use this to send selected checkboxes values with ajax or add those to url variable(like in this example). If you...
written tutorial - jQuery Change Image src Attribute
4 Feb, 2011
You can use these examples to change img tags src attribute or any attribute of any tag.
written tutorial - Parsing JSON With jQuery
25 Sep, 2010
Getting data from JSON with jQuery is really simple.
written tutorial - Add Form Fields With jQuery
26 Aug, 2010
This tutorial is about adding form fields, more precisely how to add textboxes dynamically with JavaScript. To make the code easier I use jQuery library.
written tutorial - Loading AJAX Page / Dynamic Content
25 Aug, 2010
Tutorial about loading page with AJAX between any HTML tags. We are using jQuery JavaScript library to do this.
written tutorial - Popup Contact Form With jQuery UI
25 Jul, 2010
Making beautiful pop-up contact form with jQuery and jQuery UI. If JavaScript is disabled the form is usual.
written tutorial - jQuery: Create a function
5 Jul, 2010
Tutorial about creating your own functions using jQuery JavaScript library.