JSFiddle - React, Tailwind, and code Playground

by nikhil rotke

HTML

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.13/angular.min.js"></script>
<link rel="stylesheet" href="http://getbootstrap.com/dist/css/bootstrap.min.css">
<script src="http://code.jquery.com/jquery-1.10.2.min.js"></script>
<script src="http://rohanghatwai.in/js/angularls.js"></script>
<div id="login_resp">
  <div ng-app="LocalLogin" ng-controller="LoginCtrl">
    <center><h3> Angular JS Local storage Login Example</h3> </center>
      <form ng-submit="login()">
      <div class="form-group">
        <input required  type="text" class="form-control" ng-model="uname" placeholder="Enter name: nikhil">
      </div>
      <div class="form-group">
        <input required  type="password" class="form-control" ng-model="upasswd" placeholder="Enter password: test">
      </div>
          <center><button type="submit" class="btn btn-success">LOGIN</button></center>        
      </form>
    </div>
    </div>

JavaScript

var localstorageApp = angular.module('LocalLogin', ['LocalStorageModule']);

var Gname = "nikhil", Gpass = "test";

localstorageApp.controller('LoginCtrl', ['$scope', 'localStorageService', function($scope, localStorageService) {
  $scope.login = function() {
	
	localStorageService.add('UNAME',$scope.uname); // User name added to local storage	
	localStorageService.add('UPASS',$scope.upasswd); // Password name added to local storage
	
	var UN = localStorageService.get('UNAME');
	var UP = localStorageService.get('UPASS');
	
	if(Gname==UN && Gpass==UP){
		$scope.uname = UN;
		$scope.upasswd = UP;
        var resp_success = '<div class="alert alert-success"  style="color:green;"><button class="close" data-dismiss="alert">×</button><strong>Welcome! '+UN+'</strong></div>';
   $("#login_resp").html(resp_success).show();
	}else{
		var resp_success = '<div class="alert alert-error"  style="color:red;"><button class="close" data-dismiss="alert">×</button><strong>Login Failed!</strong></div>';
   $("#login_resp").html(resp_success).show();
		$scope.uname = '';
		$scope.upasswd = '';
	}
  };
}]);