Develop Reference

How to fix my login issue with local storage?

Basically I have 2 files... register.html and login.js.... I am able to store user's registration details into local storage and then parsed it as objects in array.... I need to log in properly(when user and pass match, alert box indicates login successful and then PHP file will redirect user, and if no match, alert box will indicate for that separately) and then second alert box as you have successfully signed in and then it will not redirect me as the PHP file is meant to do so when the user and pass match local storage... Any clues??

You are just not iterating correctly through credentials, you have to wait until you are sure that the current login credentials are not equal to any of the stored credentials, so you have to get this part of code out of the for loop:
alert('Invalid Username or Password! Please try again.');
event.preventDefault();
window.location="Login.html";
try this code for validating the login:
function validlogin(event) {
var username = document.getElementById('username').value;
var password = document.getElementById('password').value;
var entriesJSON = localStorage.getItem('allEntries');
if (!entriesJSON) {
event.preventDefault();
alert("Nothing stored!");
return;
}
var allEntries = JSON.parse(entriesJSON);
var isCorrectCredentials=false;
for (var i = 0; i < allEntries.length; i++) {
var entry = allEntries[i];
var storedUserName = entry.user;
var storedPassWord = entry.pass;
var storedEmailAddress = entry.email;
if (username == storedUserName && password == storedPassWord) {
isCorrectCredentials=true;
alert("Successfully logged in!");
return;
} }
if(!isCorrectCredentials){
alert('Invalid Username or Password! Please try again.');
event.preventDefault();
window.location="Login.html";
}
}
this way you will login if the current username and password are correct and notify the rest of the code using:
isCorrectCredentials=true;
that the login info was true and you are successfully logged in.
and the part of code that should be executed if the login info is not true will be executed 1 time max.

Promise to execute a particular code first

I have the following scenario. Actual Page loading starts, user login is checked for authentication. If access granted, actual page loading completes and user can access the page. If access denied, actual page loading stops and user is redirected to 'access denied' page.
Infact the scenario should be like this. User authentication is checked. if access granted, actual page loading starts and user can access page. If access denied, user is directly directed to 'access denied' page.
can someone tell me how to include promise for this scenario. current code is as follows.
$q.when().then(function () {
return $rootScope.$emit('resetView', false, 'default');
}).then(function (result) {
loadNavBar(); //actual page loading starts here
}, function (error) {
$log.error("Caught an error:", error);
return $q.reject('New error');
});
the below function is loadNavBar() which gets executed. User authentication is done inside of this. Hence page loading starts and then user is checked. I want user to be checked first itself and then load page accordingly depending on his access rights.
var loadNavBar = function () {
//few functions here to display page.
//below code to check user authentication
var serviceURL_CheckUserExists = '/api/Pre/CheckUserExists';
//ajax to check if user exists in database. give/ deny access based on user present in DB and if user is set as blockuser in db.
$.ajax({
type: "GET",
url: serviceURL_CheckUserExists,
}).then(function (response) {
if (response.Results.length == 1 && response.Results[0].BlockUser == false) { //user has access if condition is satisfied.
$rootScope.myLayout.eventHub.emit('getUserName', response.Results[0].User_ID.trim());
$scope.role = "";
var details = response.Results[0];
for (var parameters in details) {
if (details[parameters] == true) {
$scope.role += parameters + ',';
}
}
$scope.role = $scope.role.replace(/.$/, ".");
var firstname = response.Results[0].FirstName;
firstname = firstname.replace(/\s/g, '');
$scope.$apply(function () {
$scope.username = response.Results[0].FirstName + " " + response.Results[0].LastName;
});
}
else { $window.location.href = '../../../BlockUser.html'; } //block access to actual page and redirect to 'access denied' page.
}
}
});
};

i think that the right approach to your problem is to use resolve property in the route, so the user can't navigate to certain pages if he isn't logged in and once he logged in you can inject the user object to the controller
for example to navigate to home page you must be logged in
.when("/home", {
templateUrl: "homeView.html",
controller: "homeController",
resolve: {
user: function(AuthenticationService){
return AuthenticationService.getUser();
}
}
})
app.controller("homeController", function ($scope, user) {
$scope.user = user;
});
https://www.sitepoint.com/implementing-authentication-angular-applications/

Here's a quick example of hiding the content until the user is authenticated to see it. Click the 'authenticate' button to trigger the function that you would run if the user is authenticated by your ajax call. Showing the content can be done with a fuction like:
function userIsAuthenticated(){
document.getElementById('pageContent').style.display = 'block';
}
See JsFiddle for a simple implementation.

result ok load page into div

I have written a little function to check if the username/password of a certain user is correct using a json query. If result is ok i want to load a certain page into a div, if the result is error i want to load a different page into a div.
Normally i would use $('#test').load("members.php"); to achieve this but it just isnt working (my div has an id of test - members is the page to be loaded).
function dologin(){
var email = $('#email').val();
var wachtwoord = $('#wachtwoord').val();
if($.trim(email) != '' && $.trim(wachtwoord) != ''){
$.post("login2.php", {email:email,wachtwoord:wachtwoord})
.done(function(data) {
var response = jQuery.parseJSON(data);
var result = response.result;
if(result == 'ok')
{
// logged on
$('#test').load("members.php");
}else{
// error
$('#test').load("loginfailed.php");
}
}, "json");
}
}

How to print a response from Express.js into the POST requesting html page?

I wanted to print the login validation messages on the login page itself. But the response is being printed on a new blank page. Is there any way to fetch the response and print in on any existing div tags?
I'm using Express.js to handle the login validation.
app.post('/login',function(req,res){
var user_name=req.body.user;
var password=req.body.pwd;
console.log("User name = "+user_name+", password is "+password);
if (user_name=="sudheesh" && password=="pass") {
sess = req.session;
sess.user=user_name;
console.log("Logged in..");
res.send('done');
}
else {
res.send('not_done');
}
});
The HTML script looks like this,
<script>
$(document).ready(function(){
var user,pwd;
$("#submit").click(function(){
email=$("#user").val();
pass=$("#pwd").val();
/*
* Perform some validation here.
*/
$.post("http://localhost:3000/login",{user:user,pwd:pwd},function(data){
console.log(data);
if(data=='done')
{
alert("you have logged in..!");
window.location.href="/about";
}
});
});
});
</script>

Javascript function "does not exist". Bad syntax but can't see it

The javascript is supposed to handle form submission. However, even if called with
script src="js/registerform.js"> Uncaught ReferenceError: sendreg is not defined .
The function is called onclick. Can be reproduced on www.r4ge.ro while trying to register as well as live edited. Tried jshint.com but no clue.
I will edit with any snips required.
function sendreg() {
var nameie = $("#fname").val();
var passwordie = $("#fpass").val();
var emailie = $("#fmail").val();
if (nameie == '' || passwordie == '' || emailie == '') {
alert("Please fill all the forms before submitting!");
} else {
// Returns successful data submission message when the entered information is stored in database.
$.post("http://r4ge.ro/php/register.php", {
numeleluii: nameie,
pass: passwordie,
mail: emailie
}, function(data) {
alert(data);
$('#form')[0].reset(); // To reset form fields
setTimeout(fillhome, 1000);
});
}
}
function sendpass() {
var oldpassw = $("#oldpass").val();
var newpassw = $("#newpass").val();
if (oldpassw == '' || newpassw == '') {
alert("Please fill all the forms before submitting!");
} else {
// Returns successful data submission message when the entered information is stored in database.
$.post("http://r4ge.ro/php/security.php", {
xoldpass: oldpassw,
xnewpass: newpassw
}, function(data2) {
alert(data2);
$('#passform')[0].reset(); // To reset form fields
});
}
}
function sendmail()
{
var curpass = $("#curpass").val();
var newmail = $("#newmail").val();
if (curpass == '' || newmail == '')
{
alert("Please fill all the forms before submitting!");
}
else
{
// Returns successful data submission message when the entered information is stored in database.
$.post("http://r4ge.ro/php/security.php", {
curpass: curpass,
newmail: newmail
}, function(data3) {
alert(data3);
$('#mailform')[0].reset(); // To reset form fields
});
}
}

I'm guessing here but... I imagine you are doing something like
...<button onclick="sendreg">...
And you have your <script> in the bottom on the code. Just put them on top or use $("#mybtn").click(sendreg)
Try using $("#mybtn").click(sendreg) instead of inline onclick.

The script wasn't called in the html. sorry for wasting time. A simple
<script src="js/registerform.js"></script> Fixed it.

There is no syntax error there, and I don't see any such error when trying the page.
The error that you get is that you can't make a cross domain call. Do the request to the same domain:
$.post("http://www.r4ge.ro/php/register.php", {
or:
$.post("/php/register.php", {