I cant get my login form to work with the separate logins, the preview wont event show up. I think there is something wrong with my if-else statements.
HTML:
<body ng-app="myApplication" ng-controller="myController" ng-cloak>
<h3>Contact Us</h3>
<div id="showDiv" ng-show="firstPage">
<form>
<label for="name">Name:</label>
<input type="text" placeholder="Enter your name" ng-model="name"><br>
<label for="email">Email:</label>
<input type="email" placeholder="Enter your email" ng-model="email"><br>
<label for="number">Number:</label>
<input type="number" placeholder="Enter your number" ng-model="phoneNumber"><br>
<label for="issue">Issue:</label>
<textarea name="issue" rows="5" cols="20" placeholder="Enter your issue" ng-model="issue"></textarea>
<br>
<br>
<input type="submit" value="Submit" id="submit" ng-click="showHide()">
<input type="reset" value="Reset" id="reset">
</form>
</div>
<div id="hideDiv" ng-show="secondPage">
<p ng-bind="feedback"></p>
<p>Your contact details are:</p>
<p>Email: <span ng-bind='email'></span></p>
<p>Phone Number: <span ng-bind='phoneNumber'></span></p>
<p>Your issue is:</p>
<p><span ng-bind='issue'></span></p>
<input type="submit" value="Go Back" id="goBack" ng-click="hideShow()" />
</div>
Javascipt:
<script>
angular.module('myApplication', []).controller('myController', function($scope){
$scope.name = "";
$scope.email = "";
$scope.phoneNumber = "";
$scope.issue = "";
$scope.firstPage = true;
$scope.secondPage = false;
$scope.showHide = function()
{
$scope.firstPage = false;
$scope.secondPage = true;
$scope.feedback = "";
if ($scope.name = "Po Lu" && $scope.email = "Po.Tom@acc.ac.au" && $scope.phonenumber = "021") {
$scope.feedback = "Thanks for contacting, " + $scope.name + ". We're working to fix your issue already." ;
}
else if ($scope.name == "Mel Tom" && $scope.email = "Mel.Tom@acc.ac.au" && $scope.phonenumber = "0217") {
$scope.feedback = "Thanks for contacting, " + $scope.name + ". We're working to fix your issue already." ;
}
else {
$scope.firstPage = true;
$scope.secondPage = false;
alert("Please Enter valid details");
}
}
$scope.hideShow = function()
{
$scope.firstPage = true;
$scope.secondPage = false;
$scope.name = "";
$scope.email = "";
$scope.phoneNumber = "";
$scope.issue = "";
}
});
</script>