Skip to main content

Posts

Showing posts from February, 2015

Auto Refresh div using setTimeout() jQuery

Hello Everyone, I am going to share the how to auto refresh a particular div using jQuery.  In jQuery, we are using setTimeout () function for auto refresh a div without reloading your page each and every 5 seconds.  Click for live demo The HTML code sample as given below. 1 2 3 4 5 6 7 8 //The HTML code sample   <div>      <input type= "button" id= "btnShow" value= "Click for Show div" />    </div>    <div class= "fonts" id= "divShow" >      <h2>Hi, Welcome you to code-sample.com.</h2> It will disappear in 5 seconds!    </div> //The HTML code sample <div> <input type="button" id="btnShow" value="Click for Show div" /> </div> <div class="fonts" id="divShow"> <h2>Hi, Welcome you to code-sample.com.</h2> It will disappear in 5 seconds! </

Auto Refresh div using $interval() in AngularJs

Hello Everyone, I am going to share the how to auto refresh a particular area using angularjs.  In AngularJs, we are using $ interval () function for auto refresh a div without reloading your page each and every 5 seconds.  Click for Live demo The HTML code sample as given below. 01 02 03 04 05 06 07 08 09 10 11 12 //HTML code sample <div ng-app= "autoRefreshApp" >    <div ng-controller= "autoRefreshController" >      <div>        <input type= "button" ng-click= "stopTimer()" value= "Stop Count" >      </div>      <div style= "color:green;" >        {{displayMsg}}      </div>    </div> </div> //HTML code sample <div ng-app="autoRefreshApp"> <div ng-controller="autoRefreshController"> <div> <input type="button" ng-click="stopTimer()"

How to hide column in AngularJs ng grid?

Hi, I am going to share the code sample for "How to hide column in ng grid "? and after hide the column some question keep in mind as given below. After hiding the your columns, may I get the columns value when I select some row? Answers is Yes!! Click for live demo  In AngularJs, we can achieve this using column property visible: false . i.e. 1 2 3 4 5 6 //We can achieve this using the property visible: false. i.e.   columnDefs: [          { field: 'UserId' , displayName: 'UserId' , visible: false },          { field: 'Name' , displayName: 'UserName' },          { field: 'Qualification' , displayName: 'Education' }] //We can achieve this using the property visible: false. i.e. columnDefs: [ { field: 'UserId', displayName: 'UserId', visible: false }, { field: 'Name', displayName: 'UserName' }, { field: 'Qualification&

What are scope and scope inheritance?

Scope :  Click for live demo The scope is an object of JavaScript. The scope is provide the connection between controller to view. The model data contain by the scope and all the model data access by the $scope. i.e. //assign value in scope and access it. var parentApp = angular.module( "myParentApp" , []);   parentApp.controller( "MyParentController" , [ '$scope' , function ($scope) {      $scope.name = 'Anil Singh' ;      $scope.Age = 30;    } }]); //assign value in scope and access it. var parentApp = angular.module("myParentApp", []); parentApp.controller("MyParentController", ['$scope', function ($scope) { $scope.name = 'Anil Singh'; $scope.Age = 30; } }]); Scope Inheritance : The Scope Inheritance work like JavaScript Inheritance. The parent scope and child scope attached with taggers. By default, The child scope prototype inherit from the parent scope

What is the difference between ng-app vs. data-ng-app and x-ng-app?

Today, I am going to share the difference between the some powerful  angularjs prefix like ng-app vs. data-ng-app vs. x-ng-app . This powerful  prefix are used to decide when we need to use data.* , x.* and ng.* . This is basic concept and use to validate the HTML template without using the data.* and x.* not possible to validate HTML template. That means you can say that when we need to validate HTML Template that time we are using data.* or x.* otherwise we are using simple ng.* . One other things on that:  Some time throw error on a property like ng-app but don't throw an error with data-* or x.* like data-ng-app or x-ng-app . For the conclusion we can say the only difference regarding HTML 5 validation and the best practice is used to data-ng-app or x-ng-app not ng-app. KnockoutJs also uses data-* attributes. 01 02 03 04 05 06 07 08 09 10 11 12 //The normalization process of elements or attributes as give

What are filters in AngularJs?

The AngularJs Filters are used to display or modify the live data as per your filter text. We can write the filter expression using the pipe (|) character. i.e. {{ yourData| filterTypes }} There are different types of filter which as given below. 1. Uppercase Filter                                     click for live demo on punker 2. Lowercase Filter 3. Currency Filter 4. OrderBy Filter 5. Filter Uppercase Filter : This is used to convert a input text to uppercase. 1 2 3 4 5 ///The Uppercase angular Filter First name:<input type= "text" ng-model= "employee.firstName" > Last name: <input type= "text" ng-model= "employee.lastName" > Display Upper Case: {{employee.fullName() | uppercase}} ///The Uppercase angular Filter First name:<input type="text" ng-model="employee.firstName"> Last name: <input type="text" ng-model="employee.lastName">