Top AngularJS UI Frameworks to Get Your App Up and Running Quickly Time to get started on building your own web application with AngularJS. AngularJS made building a Javascript-based app more intuitive using directives, which works hand-in-hand with your HTML markups. If you feel building a web application from scratch seems overwhelming to you, not to worry. Some very generous developers…

How to Use ngDraggable in AngularJS? ngDraggable is drag and drop module for AngularJS, provided support for touch devices.   Usage Referenced scripts in head tag. [crayon-5a158736ec9f3953667309/] In dependencies of application use ngDraggable [crayon-5a158736eca0d882666918/] Add directive attributes ng-drag ng-drag-data ng-drag-success ng-center-anchor to your HTML: [crayon-5a158736eca17910557687/] Now add Drop area: [crayon-5a158736eca1f073897254/] Then create a controller: [crayon-5a158736eca27890610774/] Below is an example using Jquery UI:…

How to Use Templates in AngularJS? In AngularJS, specific elements and their attributes are written as templates with HTML. To render the dynamic view template AngularJS combines the template with information from the model and controller that is displayed for users in a browser. Below are the types of Angular elements and attributes which can used: Directive — An attribute…

What is Angular Modal Service? Modal service for AngularJS is a module which supports creating popups and modals through a service. Usage Minified script referenced in head: [crayon-5a158736edcf0494194591/] In dependencies of application use the modal service: [crayon-5a158736edcff296035602/] Now inject the modal service into preferred controller or service or directive where you need to show modal. [crayon-5a158736edd07383888699/]   References https://github.com/dwmkerr/angular-modal-service http://dwmkerr.github.io/angular-modal-service/  

How to Validate PHP Form? HTML form used for PHP Form Validations, contains various input fields: required and optional text fields, radio buttons, and a submit button: The validation rules for above form are as follows: Field Type Validation Rules First Name Required*. + Must contain only letters and whitespace Last Name Optional. Gender Required*. Must select at least one Email Required*.…

Resize Elements Using Jquery UI jQuery UI has resizable() method which is used to set if an element can be resizable or not. This resizable plugin makes selected elements resizable by dragging corners or sides of element. Draggable arrow will be displayed on hover of end points. This resizable() method can be used as in below methods: $(selector, context).resizable(options) $(selector, context).resizable(actions, [params]) Below is simple resizable widget using…

How to Use Cookies in AngularJS? AngularJS framework provides cookie module ngCookies. It also provides cookieStore object with get(), put() and remove() methods. This cookie feature is available in angular-cookies.min.js file. Below demo shows how to read and write cookie.

Using UI Bootstrap Tabs in AngularJS AngularJS UI-Bootstrap Tab is Native AngularJS (Angular) directives for Bootstrap. uib-tabset settings active (Default: Index of first tab) - Active index of tab. Setting this to an existing tab index will make that tab active. justified $ (Default: false) - Whether tabs fill the container and have a consistent width. template-url (Default: uib/template/tabs/tabset.html) -…

What is a Controller in AngularJS? In AngularJS, everything is associated with scope. Scopes are organized hierarchically. $rootScope object, the parent of all the scopes of the AngularJS application, and scopes are available created by directives. The scope hierarchy is consistent with the DOM tree hierarchy. A new scope is created whenever a scope-creating directive is encountered in the DOM tree. Instead of defining…

How to Bind data in AngulaJS? Two way data binding will be available when a model variable is bound to a HTML element which can display and change the value of the variable. Same variable can be bound to multiple HTML elements. We use ng-model directive to bind a model variable to one or more HTML elements, which can display and also update the value. In below example,…

12
Close