I'm creating a simple app using angularjs and ionicframework and I created a simple login page.
This page has a simple form:
and I need that the form is the first thing shown to the user when he arrives to that page, after he compiled the form I need to hide it and show a logout button.
This is my html code, as you can see I used ng-if="haveHash == true" to check if user compiled the form:
<div class="container" ng-if="haveHash == false">
<form class="form-horizontal" ng-init="setFormScope(this)">
<fieldset>
<legend>Dati di login</legend>
<div class="form-group">
<label class=" col-lg-2 control-label">Codice cliente</label>
<div class="col-lg-10">
<div class="input-group">
<div class="form-control-wrapper">
<input ng-model="myForm.codice" type="text" placeholder="Codice Cliente" class="form-control empty" value="{{codicecliente}}">
<span class="material-input"></span>
</div>
<span class="input-group-btn">
<button class="btn btn-default btn-raised withripple" ng-click="scanBarcode()">Scan</button>
</span>
</div>
</div>
</div>
<div class="form-group">
<label class="col-lg-2 control-label" for="inputPassword">Password</label>
<div class="col-lg-10">
<div class="form-control-wrapper">
<input ng-model="myForm.password" type="password" placeholder="Password" id="inputPassword" class="form-control empty">
<span class="material-input"></span>
</div>
</div>
</div>
<div class="form-group">
<div class="col-lg-10 col-lg-offset-2">
<button class="btn btn-primary" type="submit" ng-click="generaHash()">Salva</button>
</div>
</div>
</fieldset>
</form>
</div>
<div ng-if="haveHash == true">
<a href="#" ng-click="disconnetti()">disconnetti</a>
</div>
And this is my app.js
myApp.controller("ImpostazioniController", function($scope, $cordovaBarcodeScanner, $ionicPopup) {
$scope.haveHash = false;
$scope.setFormScope= function(scope){
this.formScope = scope;
}
$scope.scanBarcode = function() {
$cordovaBarcodeScanner.scan().then(function(imageData) {
$scope.codicecliente = imageData.text;
// alert(imageData.text);
// console.log("Barcode Format -> " + imageData.format);
// console.log("Cancelled -> " + imageData.cancelled);
}, function(error) {
console.log("An error happened -> " + error);
});
};
$scope.disconnetti = function(){
window.localStorage['auth_hash'] = "";
window.localStorage['codicecliente'] = "";
//Informo l'utente che ho salvato i dati
$ionicPopup.alert({
title: 'Disconnessione',
template: 'Logout effettuato correttamente.'
});
$scope.haveHash = false;
};
//Questa funzione viene richiamata quando si salva il form
$scope.generaHash = function($localstorage){
//Recupero codice e password
var codice = this.formScope.codice;
var password = this.formScope.password;
//Elimino la cache precedente
window.localStorage['auth_hash'] = "";
window.localStorage['codicecliente'] = "";
//Creo e salvo l'hash
window.localStorage['auth_hash'] = btoa(codice+':'+password);
window.localStorage['codicecliente'] = "codice";
//console.log(window.localStorage['auth_hash']);
//Informo l'utente che ho salvato i dati
$ionicPopup.alert({
title: 'Login salvato',
template: 'I tuoi dati sono stati salvati, ora puoi accedere alle tue cartelle cliniche.'
});
//Svuoto il form
$scope.myForm.codice = '';
$scope.myForm.password = '';
$scope.haveHash = false;
};
});
This is the firebug error:
Error: $scope.myForm is undefined
$scope.generaHash@http://localhost:8100/js/app.js:117:3
Parser.prototype.functionCall/<@http://localhost:8100/lib/ionic/js/ionic.bundle.js:18471:1
@http://localhost:8100/lib/ionic/js/ionic.bundle.js:43026:30
$RootScopeProvider/this.$get</Scope.prototype.$eval@http://localhost:8100/lib/ionic/js/ionic.bundle.js:20326:9
$RootScopeProvider/this.$get</Scope.prototype.$apply@http://localhost:8100/lib/ionic/js/ionic.bundle.js:20424:11
@http://localhost:8100/lib/ionic/js/ionic.bundle.js:43025:7
m.event.dispatch@http://localhost:8100/js/jquery-1.11.1.min.js:3:8380
m.event.add/r.handle@http://localhost:8100/js/jquery-1.11.1.min.js:3:5115
triggerMouseEvent@http://localhost:8100/lib/ionic/js/ionic.bundle.js:2648:3
tapClick@http://localhost:8100/lib/ionic/js/ionic.bundle.js:2637:3
tapMouseUp@http://localhost:8100/lib/ionic/js/ionic.bundle.js:2707:5
http://localhost:8100/lib/ionic/js/ionic.bundle.js
Line 17696
Basically I want to show the form if there is no auth_hash saved in localStorage and the logout button if it is stored