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
How to add, remove and check the class using angularJS
We can add, remove or check classes through our angular code:
The following is the syntax for adding a class and the corresponding CSS related to that class:
HTML:
<div ng-app="addRemove" ng-controller="myCtrl"&g...
What is $rootScope and how is it related with $scope?
$rootscope is the parent of all scopes. Values exposed there will be used in all controllers and templates. It acts as a parent object of all “$scope” angular objects created in a web page.
Now, let us understand how the “$ro...
How to populate options in select in angularjs with example
The dynamically generated option in the select box with angularjs is done with the following code :
We can populate the options inside the select box and on selecting any value from the select box it reflect to some event. It will sh...
AngularJS http (ajax)
AngularJS has provided a $http service that works as an ajax call in jquery. It performs a function of reading data from the server. $http makes a call to the database and retrieves the desired data or records.
How to use?
1. you need to in...
What problems does AngularJS solves?
AngularJS is a framework ( client-side ) for web applications that embeds HTML, CSS and Javascript. It basically focuses on:-
1.Coding data access, Reading, form validations - are some functions in which many people are not good at while doing...
Simple Javascript form validation
Here i have written JS code to validate form, for example:
checking empty fields, checking email, password user-name etc.
function valid()
{
var name = document.getElementById('name').value;
var passwd = document.getElementById('...
$watch() , $digest() and $apply() in AngularJS
There is an important concept of angularjs $scope function like:
$watch
$digest
$apply
As to understand angularjs more better we have to go throught the central function in angularjs.
Lets discuss them one by one:
...
Different ways of using array filters in AngularJS
AngularJS provides a filter feature to format input value and an array based on certain criteria. Here, we will see the ways of array filtering.
For example-below is the array:-
$scope.movies = [
{id: 1,title: Airlift, genre: real ...
AngularJS $apply
AngularJS $apply comes into play when it invokes digest cycle to watch the scope model changes. Angular wraps the function call within the $scope.$apply. It means it executes a complete new life cycle. If the execution of the function is normal, ...
AngularJS $digest
Since AngularJS has a popular concept of two way data binding. But how does it comes to know that a value has changed? Here comes the role of $digest.
AngularJS executes in cycles which is called as $digest cycle. Suppose we ch...
jquery methods: addClass toggleClass and Remove class
jQuery has Basically three methods for CSS manipulation Following methods is explained using below example:
1.addClass() - Adds one or more classes to the selected elements
2.removeClass() - Removes one o...
Understanding Angular $watch
AngularJS has a concept of powerful data binding. It accomplishes this by keeping a watch on its scope variables. When we change the the variable on $scope object, the $scope object gets automatically changed and vice-versa. Most of the time angu...
Animations in AngularJS using CSS
Animations are the effects that makes the visualization attractive and illusionary moving. In AngularJS we can use animations with the following directives :-
Directive
Animation Type
ngRepeat
enter, leave and m...
AngularJS $timeout and $interval
$timeout and $interval are two AngularJS timer services. We use these services to call functions and these are similar to javascript’s setTimeout and setInterval functions.
$timeout- This is used to call a function and schedules a single c...
Iterate json data in angularJS
While working for an autocomplete funtionality in angularJS encountered a problem where instead of the JSON we need to iterate each element and have to make an Array of string.
For iterating the JSON data(from server side), we used:
$scop...
AngularJS expressions
Expressions in AngularJS is represented using double curly braces-{{ }}. Expressions are used to bind the data to the HTML in the same way as the ng-bind directive of angular.
Expressions using-
1.numbers:-
syntax- <p>Price...
Underscore.Js
"Underscore.js" a tiny and powerful library with a minified size of 5.7kb. You can download this library from
http://underscorejs.org/underscore-min.js
This library support over hundred of functions which can be very useful in our...
Understanding Angular UI-Router
In Angular we are provided with a routing framework named Angular UI-Router. It enables us to make transitions based on states rather than routes URL (which is used in ngRoute),i.e. it is organized around states. It supports nested states and mul...
Introducing addClass method and toggle function in jquery
addClass() method adds one or many methods or class to the paragraph or the element you are using,This method will not remove the class but it adds another class by using different attributes. Users and also add toggle function to it. It will add...
jQuery.param() method in jQuery
jQuery.param()
Syntax:
$.param(object,traditional)
object: object parameter in param method is an array, a plain object, or a jQuery object which needs to be serialized.
traditional: This parameter is a boolean indicating...
The difference between == and === in jQuery/Javascript?
double (==) : This operator is used for checking equality, no strict comparison is done i.e this operator first converts the values to specific type then comparison is done and this conversion is done by the javascri...
MVC architecture in angular
Model View Controller is abbreviated as MVC. MVC is the popular web design architecture because it separates the business logic from its view or presentation.
It has three components:-
Model- an object carrying data.
View- visualization ...
Single Page Applications using Angular
Single page applications are the applications that separates the model and the view layer i.e, model layer handles the data and view layer reads from the models.
SPA’s are becoming popular because it retrieves all the code(JS,HTML,CSS) on ...
.empty() vs .remove() vs .detach() - jQuery
.empty() : All the child element of the matched element are removed by this method i.e the element will not be removed only the content of all DOM elements in the matched set are removed.
.remove() : This method removes the matched e...
How Page Re-direction Works
The implementations of Page-Redirection are as follows:
Example 1:
In Java script we can simply do page redirect at client side. if any visitors visit the website then you can redirect your website visitors to new page , For that you just n...
.detach() method in jQuery
The detach() method removes the selected elements, including all text and child nodes. However, the advantage of using this method is that it keeps data and events i.e keeps a copy of the removed elements, which allows them to be reinserted ...
Trigger the change event for select that gets the text for each selected option and writes them in the div?
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>selected demo</title>
<style>
div {
color: red;
}
</style>
<script src="https://code.jquery.com...
Using Loopback API Explorer
Hello All,
In this blog we will discuss about how to use Loopbacks explorer.
LoopBack basically provides the developer portal / API Explorer which consits of the methods defined for performing CRUD application with the database. You can use...
Remote Methods in Loopbackjs
Hello All,
In this blog we will discuss about the remote methods of loopback js.
Remote methods are the static methods of a model, It is basically used to perform operations not defined in Loo...
Parent() and Parents() method in jquery
Many times I stuck in an issue of getting parent elements or specific elements to build a specific functionality over it. So that I went through the jquery library, where I found 2 relevant methods to get the specific elements or parent elements....
How to check if function exists or not in Javascript and jQuery
There might be some cases when we need to call a function without checking if function's definition is loaded or not. If loaded then that will be fine but if not loaded then it will throw an error as undefined function. We can handle this in ...
Difference between $('div/') and $('div') in jQuery?
Example of $('div/') in jQuery:
$('<div/>').addClass('test');
Example of $('div') in jQuery:
$('div').addClass('test');
Explanation of difference between $('div') and $('<div/&...
How to create clone of any object using jQuery?
Cloning of Object using jQuery
For cloning any any object using jQuery, jQuery provides clone() method which is performing a deep copy of the set of matched elements i.e clone method not only copies the matched elements but also all descendant...
Difference between $(this) and 'this' in jQuery?
Example of $(this) in jQuery:
$(document).ready(function(){
$('#div1').mouseover(function(){
alert($(this).text());
});
});
Example of this in jQuery:
$(document).ready(function(){
$('...
AngularJS Dependency Injection in detail
Dependency Injection allows the removal of hard-coded dependencies and makes it possible to change them. It helps in making components testable,reusable and maintainable.
We are provided with in built dependency injection mechanism by AngularJs....
Page Redirection in Javascript
What are the different ways to redirect page in javascript?
Page Redirection is a situation when a user locates from one page to another. There are two kinds of redirect :
Server side redirect : In this, ser...
Interactive line chart with NVD3
NVD3 is a very powerful java script library to render web based graphs. It automatically handles the scaling and plotting by itself. We just need to concern the data.
NVD3 just takes data and render the graph.
Data Format : NVD3 expect an a...
Toggle method
This method is used to show() and hide the content of selected elements. show() method is execute when selected element content is hide while hide() method is execute when selected element content is visible.
The toggle() method toggles ...
Profanity filter for multiple languages
To check the profanity in the text for multilanguage, here we use WebPurify web service. This web service provide various callable methods including check, checkcount, replace, return etc. But here we are using the replace method (webpurify.live....
How to use filters in AngularJS?
A filter is used to format data to be displayed to the user. These can be used in controllers,templates or services and we can also easily define our own filters. Some of the built-in filters in AngularJS are :-
1.uppercase - formats or converts...
Difference between jQuery text() method and jQuery html() method?
jQuery text()
Syntax:
To return text content:
$(selector).text()
To set text content:
$(selector).text(content)
To set text content using a function:
$(selector).text(function(index,currentcontent))
jQu...
Useful built-in directives in AngularJS
A Directive helps us to control the rendering of the HTML inside an AngularJS application. It makes AngularJS responsive. It adds functionality to the application. AngularJS has its built in set of directives. Some commonly used directives ...
How to calculate time between two time using Dropdown box
Hello Reader's!,if you want get difference between two time, then I wrote this blog for you.It only contain JAVASCRIPT and HTML code.
First you need to create your HTML code where you will get your time difference
Put this HTML Code insid...
Understanding $emit, $broadcast and $on in AngularJS
Sometimes we need to send data from one controller to another. There are services provided by AngularJS for communication(event-based) between the controllers. $on, $emit, $broadcast are the services for the communication between the controllers....
How to traverse html elements in a DOM using Jquery
Here we will learn how to traverse and change the style of the cell next to each cell that contains the specific text or content. Here we will see how we can customize the styles of the cells using some specific conditions with the help of the fo...
To show the current date month and year using javascript
Hi,
Below code example will help you to "show the current date month and year using javascript".
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0
Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-tr...
Javascript:Exchanging data between a document in an iframe and a parent document.
Hii,
I am providing a very simple javascript code by which we can access variables and invoke functions in the parent document and vice-versa.
Please go through the given example below and understand the concept.I hope it will be...
Promises in Angularjs
Promises - AngularJS's promise provides a built-in service $q. It provide a way to execute asynchronous call in series by registering it with a promise object.
Let us now elaborate promise and deferred.
Deferred - It represent the ...
Events and Methods in jQuery
jQuery is a javascript library used to solve various task by writing less number of codes.
JQUERY EVENT- An event express the particular moment when something happens.
List of events:-
Mouse Events
Keyboard Events
Form Ev...
How to check if the password is same as one typed before.
Here we will learn how to check if the password entered in the two input boxes, is correct or not using jquery. In the below example initially there will be two input box with labels password and confirm password. When we type a password in eithe...
