Hi skp,
To clear sessionStorage use delete $sessionStorage.
Or you can use $sessionStorage.$reset()
AngularJS ngStorage example: Access LocalStorage and SessionStorage using ngStorage
Using the above article i have created the example. Now please take its reference and correct your code.
HTML
Login
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>Clear Session Storage</title>
<link type="text/css" rel="stylesheet" media="screen" href='https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.0.3/css/bootstrap.min.css' />
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.6.8/angular.min.js"></script>
<script type="text/javascript" src="https://cdn.jsdelivr.net/ngstorage/0.3.6/ngStorage.min.js"></script>
<style type="text/css">
body
{
background: -webkit-linear-gradient(left, #1143a6, #00c6ff);
}
</style>
<script type="text/javascript">
var LoginApp = angular.module('LoginApp', ['ngStorage']);
LoginApp.controller('LoginController', function ($scope, $http, $window, $sessionStorage) {
$scope.submit = function () {
var UserData = { username: $scope.Username, password: $scope.Password }
$http.post('Login.aspx/ValidateUser', UserData)
.then(function (response) {
// Checking condition for authorization.
if (response.data.d == 22) {
// Setting $sessionStorage.
$sessionStorage.User = UserData;
$window.location.href = 'Details.aspx';
}
else {
// Clearing $sessionStorage.
//delete $sessionStorage; //Or
$sessionStorage.$reset();
$window.alert("You are not authorized.");
}
});
}
});
</script>
</head>
<body ng-app="LoginApp" ng-controller="LoginController">
<form id="form1" runat="server">
<section class="container">
<div class="main_cont register">
<div class="login-panel">
<h3 class="login-heading"></h3>
<div class="row">
<div class="col-md-12 col-sm-12">
<div class="form-group">
<input type="text" class="form-control" ng-model="Username" name="Name" placeholder="Username" value="" autocomplete="off" required/>
</div>
<div class="form-group">
<input type="password" class="form-control" ng-model="Password" name="Password" placeholder="Password" value="" autocomplete="off" required/>
</div>
<div class="float-right">
<input type="button" class="btn btn-primary" ng-click="submit()" value="Login" />
<div style="color: red">{{message}}</div>
</div>
</div>
</div>
</div>
</div>
</section>
</form>
</body>
</html>
Details
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.6.8/angular.min.js"></script>
<script type="text/javascript" src="https://cdn.jsdelivr.net/ngstorage/0.3.6/ngStorage.min.js"></script>
<script type="text/javascript">
var app = angular.module('MyApp', ['ngStorage'])
app.controller("MyController", function ($scope, $sessionStorage, $window) {
var user = $sessionStorage.User;
$window.alert("User Name : " + user.username);
});
</script>
<div ng-app="MyApp" ng-controller="MyController">
</div>
Code
C#
[System.Web.Services.WebMethod]
public static int ValidateUser(string username, string password)
{
int userid = 1;
if (username.ToLower() == "ananth")
{
userid = 22;
}
//Return UserId.
return userid;
}
VB.Net
<System.Web.Services.WebMethod>
Public Shared Function ValidateUser(ByVal username As String, ByVal password As String) As Integer
Dim userid As Integer = 1
If username.ToLower() = "ananth" Then
userid = 22
End If
'Return UserId.
Return userid
End Function
Screenshot
