Featured
-
Top 10 Template Engines for JavaScript
What is a Template engine? Template Engines are
by nishant.mishra -
jQuery Accordion
Hello readers! In this Blog we will gain knowled
by vishwanath.rana -
How to make Numbered and bulleted list in HTML Editor with JavaScript
Hello all, Working with HTML Editor we wanted t
by gaurav.gautam -
How to hide particular div with just one click?
Hi, you want a condition in which the particula
by abhishek.tiwari.458 -
How to Create and Retrieve Array in Javascript?
If you want to store multiple values in a single v
by siddharth.shahi
Tags
Client side validation using JQuery
If you want to add client side validation in your web project using jQuery instead of server side validation like PHP, ASP.NET and JSP, then You have to include jQuery validate library in the head section of HTML.
jQuery library offer customize...
How to use ng-repeat loops through array from scope?
ng-repeat is used to iterate over the properties of an object. I am showing how you can use ng-repeat loops through an array from scope variables.
The below code uses ng-repeat in a list that takes values through an array from scope.
Here i...
Cleint side pagination using jQuery
If you want to perform table pagination using jQuery instead of server side script like PHP, ASP.NET and JSP, then You can use the below code for paginatng a table:
<table class="data">
<tr>
<th>Name</th>
&...
load javascript files asynchronously?
To load javascript asynchronously, If we have latest browser where HTML5 supported then we need only to add "async" tag having the value true.
In case of having old browser, we need to create a js function that will add our javascript asynchr...
How to use password strength indicator on slider?
In this example, we used a variable named score to calculate the strength of password. If password contain 6 chars the score increases with 10 points, if it has at least one digit 10 points, has
at least one ASCII symbol (!@#$%^&*) 10, mix...
How to retain the sorted value after refresh div?
Here, we are using both sessionStorage and localStorage to retain the values after refresh a div. The div named refresh (#refresh) get refresh after a time interval of 5s. Values in the array sort using updateContent(arr,$opts) function. These so...
jQuery bind() Method
Hello Readers,
bind() is the jquey method which is used to attaches one or more event handlers for selected elements and specifies a function to run when the event occurs.
syntax:
$(selector).bind(event,data,function)
event: event i...
How to get classname using Jquery
Hello Readers,
When we apply CSS class to HTML element sometimes we don't know that which CSS applied to HTML element.
So, below we use jquery to get the class name.
Here, we use the Jquery .attr() function which returns the class attrib...
logout from facebook with javascritp SDK - facebook logout
For creating logout from facebook we need the facebook javascript SDK.
Code snippets to logout from Facebook is given below :
<script>window.fbAsyncInit = function() {
FB.init({
appId : "FACE...
Adding CSS on a click in AngularJs
If you want to add some css or change css on a button click in angularjs,you need to use angular directive mg-class for this.
It is very simple you just need to bind a variable into the directive mg-class and change it from the controller.
...
Displaying and Adding server-supplied data into your drop down list using AngularJs.
If you want to extract data from the server through hitting an api and display it in your dropdown list of select box using angular js, you need make a service(factory) with some functions and then inject this into your controller.
Here is the...
Abort the current XMLHttpRequest in AJAX?
For this operation we have a function abort().
Here is the process code.
var xhr;
xhr = $.ajax({
url: 'ajax/userDetails/user_id/3',
success: function(data) {
console.log(data);
}
})
fn();
//Abort the Ajax...
Closures in javascript?
Whenever we defined a function within another function, the inner function has accessibility for the variables in the outer function.
Following is the example of closure.
function mainFunction(outerData) {
var mainFuncData = 3;
...
Include a JavaScript file in another JavaScript file using jquery?
We can achieve this using javascript or using jquery.Below methods demonstrate it.
Method 1: Use any JavaScript to include another js file.
Step 1: Add following function in your page.
function includeScript(url)
{
var head = ...
Event Loop in node.js?
As we know that , Node js is a single threaded application but it also support concurrency based on concept of event and callbacks.
Every api that we are doing using node.js are asynchronous and single thread,node js uses asynchronous fu...
error-first callback in node.js?
If user pass errors and data then we use Error-first callbacks .There are two argument in callbacks. first argument is always an error object which is for to check if something went wrong. and we use additional argument along with this paramete...
How to perform TinyMCE Form Submission
Whenever textarea is replaced by TinyMCE, at that time it will hidden and TinyMCE editor which is an iframe is display in place of this.
When we make standard form submission then it is handled by TinyMce. But in case of Ajax form submission,w...
Generate Dynamic Table content by using form fields in AngularJs
Generate Dynamic Table content by using form fields in AngularJs
We all know that "AngularJs" is adopting vastly. We already found so many example of AngularJs and Application in AngularJS.
We had created an example of "AngularJs" relate ...
Draggable and resizable a block using HTML5 and Javascript
If you want your block draggable and resizable, the following code will help you for the same:
HTML:
<section class="map">
<div class="container-fluid">
<div class="this-week panel-group dayListing" id="ac...
Make a line in Canvas on mouse click
HTML5 Canvas element is used for making 2D graphics in browser. Canvas has several methods to draw 2D graphics path, boxes, line, circle, rectangle etc. One of these we are using here is line method.
<!DOCTYPE html>
<html>
<he...
Function() constructor in javascript.
You can use function constructor along with new keyword when you want to define your function dynamically. Function constructor accepts any number of string arguments.
This is the syntax for it:
var variablename = new Function(Arg1, Arg2......
How to retain the selected value in the dropdown after page refresh ?
To retain the selected value in the dropdown on refresh, sessionStorage is used to store the value within the user's browser. First, the values have to be set using sessionStorage.setItem("SelItem", selVal); SelItem is a variable in which we are ...
How to add an iscroll on a page for smooth scrolling?
We can simply add an iscroll in our page so that the scrolling becomes smooth in iphone. You simply need to download the js file and inject it into your HTML.
Here is an example code:
<html>
<header>
<h1 class="...
Drag and drop using Javascript
If you want to drag your element from one point to another, here is the code below using Javascript:
HTML:
<div id="dragElement">Drag me!</div>
CSS:
#dragElement {
width:100px;
height:100px;
background-color:#66...
Javascript popup boxes
Hello Readers
Javascript has three kind of popup boxes:
Alert box
Confirm box.
Prompt box.
Alert box: If you want the information comes through the user then we use the alert popup box.
Syntax of alert box:
window.alert("som...
Create a Realistic, Ticking Analog Clock in SVG using the Math Functions
With the help of SVG you can create the clock, by using both the Date object and the Math objects, in addition to a timer to manage the clock hands.
The JavaScript manage the hands as a derivative of other applications that also implement analo...
Finding the Radius and Center of a Circle to Fit Within a Page
With given width and height of a page element, you need to find the radius and its center point of the largest circle that fits within that page element.
Find the smaller circle of the width and height; divide this by 2 to find the radius:
...
Javascript seach box with matched case
Here is the example for making a search box with a matched case which shows the searched text with the highlighted matches available. You have to paste your paragraph text in the text-area and enter the searching keyword in input box given below ...
Math.pow() Method in javascript
The Math.pow() function calculates the power of x to y, x ^ y. Matrix exponentiation is supported for square matrices x, and positive integer exponents y. It returns the base to the exponent power, that is, base exponent. It Gets a number raised ...
Math exp Method
This Method calculates the exponent of the value. Returns enumber, where enumber is the argument, and e is Euler's constant, the base of the natural logarithms. For matrices, the function is evaluated element wise.
Syntax:-
Math.exp(numbe...
How to set form action via ajax
Hello Reader's
If you want to make your form reusable and set the action dynamic via ajax, Then you can make the ajax call like in the example below:-
<form id = 'idForm'>
...
</form>
and the script will go like this...
jQuery Simple Responsive PopupBox or Modal Box
In this blog, we have created an example of a very simple and responsive jQuery popup box. Popup box is used frequently in the webpages for various purpose (Notification message, Alert message etc. ). If you need a simple and ele...
How to modify the URL of the current page without reloading the page in JavaScript?
To modify the URL without reloading,a pushState method has come in HTML5 which is quite same as window.location but does not refresh or reloads the page.
This method will first check if the browser supports HTML5,then the state object containi...
What is the use of % in javascript
using the '%' will make the modular opera, Function of % is return the remainder of the two numbers:-
Lets see the example below:-
<script>
var x = 100; //var 1
var y = 30; //var2
var z = x % y; // z will be the remainder
a...
How to detect a mobile device in jQuery and javascript?
Using jQuery you can use the following code:
$.browser.device = (/android|webos|iphone|ipad|ipod|blackberry|iemobile|opera mini/i.test(navigator.userAgent.toLowerCase()));
This will return "device" for all devices.
You can use the belo...
How to shuffle an array in javascript?
To shuffle(randomize) an array in javascript, there is an algorithm called Fisher-Yates devised and Don Knuth popularized algorithm.
Below is the code for using it:-
Array.prototype.shuffle = function() {
var input = this;
for (...
How to convert a integer to binary using Javascript
Hello, If you need to convert the interger to binary then by using Javasript you can perform it very fast, Let see the example below:-
var binary = (56 >>> 0).toString(2);
console.log(binary);
console.log(parseInt(binary, 2) >&...
How to make lazy load of html page contents using Javascript
Hello Reader's!
If you are looking to make your website pages more dynamic and light that loads the html sections as user scrolls down, Then you can use the code below:-
First thing is to make some corrections on the html page like. you need...
How to get query string values in JavaScript?
A query string is an optional part of a URL that goes after the file name and begins with a question mark (?). For example, the following URL has a query string ?quryEg after the HTML file name:
http://www.findnerd.com/file.html?quryEg
Here...
How to create a basic plugin using jquery
If you want to make a functionality that can be used anywhere in the code. For example, you want some method that can be called on the jquery selection and it can perform number of operations on the selection. For this, you can write a plugin.
...
How to refresh the web page using Angular JS
Hello Reader's if you need to refresh the webpage using the Javascript then Angular js offers you many ways but you can use the best and the shorted way , as below:-
var PageLandURL = "http://www.abc.com"; //Just set ur URL
$window.location.h...
How to make a redirect page using jQuery and javascript?
If you want to redirect to another page,simply use window.location property of javascript. You can use window.loacation.replace or window.loaction.href to accomplish this purpose.
If you use window.location.replace,the replace() method do not ...
Creating a Random Number Generator
Use a combination of JavaScript Math methods: random to generate a random value
between 0 and 1, which is then multiplied by 255.
var randomNumber = Math.floor(Math.random() * 255);
console.log(randomNumber);
The random method generates...
How to clone an object in JavaScript?
The best way to clone an object in javascript is to use $.extend(). We can use it in two ways:-
1.Shallow copy
2.Deep copy
1.The syntax for shallow copy is: var newObject = jQuery.extend({}, oldObject);
2.The syntax for deep copy is: ...
JavaScript Closure Need or Uses of JavaScript Closure
Why we need JavaScript Closure or uses of JavaScript Closure?
In previous blog(Introduction to JavaScript Closure and Elements for Closure Pattern), we talked about the Closure and Elements. In this blog we are going to c...
Math.log Function
Math.log() function compute a natural logarithm. The method returns the natural logarithm (base E) of a number if the value of number is negative, the return value is always NaN or If the number is 0, the function returns -Infinity.
Syntax
...
Dynamically access object property using variable.
There are two ways to dynamically access object property:-
1.Dot Notation
2.Bracket notation
var eg = {first1: "101", second: "202"};
console.log(eg.first1);
var key1 = first+1; alert(eg1); // first1
console.log(eg[key1]);
The d...
How to Disable Submit Button Until all Fields have Values?
To make the submit button disable until all the fields have some values, we will be using keyup() function that provide handler to check not null values.
We disabled the register button in the starting and according to the value from handler, ...
.keyup() method in jquery
.keyup() method is used to bind an event handler with the keyup javascript event. Suppose we have an input field and we want to invoke an alert box for each key we press. Then, the event handler should be bind to that input field.
Example:
...
Introduction to JavaScript Closure and Elements for Closure Pattern
JavaScript Closure and Uses of Closure
What is JavaScript Closure?
In simple words Closure means- to bind local variables in a function.
A Closure is a logical statement or function that can have free variables composite with an ent...
