Q: How to read JSON data and compare it with a variable I have two sets of data in a JSON file as :
Admins = [{"Admin":"jhonmorris"},{"Admin":"clarkechris"}]
UIDS = [{"password":"Jhon", "username":"jhonmorris"}, {"password":"Jean", "username":"jeanheadly"}, {"password":"Clarke", "username":"clarkechris"}]

I have an HTML with a user LogIn Page as : 
<html>
<head>
<script type="text/javascript" src="data.json" ></script>
<script type="text/javascript" src="checking.js" ></script>
</head>
<body>

<form name="myForm" method="post">
UserName<input type="text" id="uid" value="uid"/>
UserPassword<input type="password" id="pwd" value="pwd"/>
<input type="submit" value="Submit" onclick="fnCheck()"/>
</form>

</body>
</html>

I have two types of users, one is an admin (Adminsin JSON) and the other is a regular user (any other user username apart from Admins in the JSON). When the submit button is clicked, I want to take the userID entered in a var x and check if it has the correct password corresponding to it from the UIDS in the JSON. Further I want to check if the same username belongs to the Admins set of data in the JSON. If yes, I want to redirect him to google. If not, I want to redirect him to yahoo. 
I am reading the JSON data using JavaScript as follows : 
function fnCheck(){
    alert("in fnCheck()");
    if(checkUP() == true){
        alert("checkUP returned true! UserID and Password are correct");
        if(checkAdmin() == true){
            alert("checkAdmin() returned true! going to admin page now");
            window.location = 'http://www.google.com';
        }
        else if(checkAdmin() == false){
            alert("checkAdmin() returned false! going to userIndex page now");
            window.location = 'http://www.yahoo.com';
        }
    }
    else{
        alert("checkUP() returned false. Creds are Invalid!");
    }
}

function checkAdmin(){
    alert("in checkAdmin()");
    //var adminJSON = JSON.parse(Admins); 
    //length = adminJSON.length;
    x = document.forms["myForm"]["uid"].value;

    for(var key in Admins){
        var admin = Admins[key]
        //alert(""+admin.Admin)

        if(admin.Admin == x){
            alert("Admin match found. Returning true!");
            return true;
        }

        else{
            alert("Admin match not found. Returning false");
            return false;
        }
    }
}

function checkUP(){
    alert("hello!!");
    var x = document.forms["myForm"]["uid"].value;
    var y = document.forms["myForm"]["pwd"].value;
    alert("In checkUP, value of x = "+x+" calue of y = "+y);

    for(var key in UP){
        var user = UP[key]

        //if(user.username == x && user.password == y){
        if(x.match(user.username) && x.match(user.password)){
            alert("user.username = "+user.username+"user.password = "+user.password+" User Id and password matched. Returning true now");
            //alert("Matching "+x+ "with "+user.username"+ and "+y+" with user.password"+ y);
            //break;
            return true;
        }

        else{
            //alert("User ID and password did not match. Returning false now. user.username = "+user.username+" user.password = "+user.password);
            //break;
            return false;
        }
    }
}

Ive tried putting alerts to find out what is going wrong at all places, but I still cant figure out what is going wrong. Help is much appreciated!

A: Your function is not called here, don't use onclick event of the submit button, better use the onsubmit event of the form onsubmit="fnCheck()":
<form name="myForm" method="post" onsubmit="fnCheck(event)">

Note:


*

*Storing passwords in JSON is a very bad practice which makes your page very weak and unsecure.

*The given file doesn't provide a valid JSON structure, these are only JavaScript objects, assuming that you have a valid JSON, use JSON.parse(json) to parse your json objects/arrays.

*There are some errors in your functions such as using undefined variables, for example the case of UP.

*This is a DEMO where you can test that your function is correctly called with onsubmit but you still need to remove/correct the undefined variables.




var Admins = [{
  "Admin": "jhonmorris"
}, {
  "Admin": "clarkechris"
}];
UIDS = [{
  "password": "Jhon",
  "username": "jhonmorris"
}, {
  "password": "Jean",
  "username": "jeanheadly"
}, {
  "password": "Clarke",
  "username": "clarkechris"
}];


function fnCheck(e) {
  e.preventDefault();
  console.log("in fnCheck()");
  if (checkUP() == true) {
    console.log("checkUP returned true! UserID and Password are correct");
    if (checkAdmin() == true) {
      alert("checkAdmin() returned true! going to admin page now");
      window.location = 'http://www.google.com';
    } else if (checkAdmin() == false) {
      alert("checkAdmin() returned false! going to userIndex page now");
      window.location = 'http://www.yahoo.com';
    }
  } else {
    alert("checkUP() returned false. Creds are Invalid!");
  }
}

function checkAdmin() {
  alert("in checkAdmin()");
  //var adminJSON = JSON.parse(Admins); 
  //length = adminJSON.length;
  x = document.forms["myForm"]["uid"].value;

  for (var key in Admins) {
    var admin = Admins[key]
      //alert(""+admin.Admin)

    if (admin.Admin == x) {
      console.log("Admin match found. Returning true!");
      return true;
    } else {
      console.log("Admin match not found. Returning false");
      return false;
    }
  }
}

function checkUP() {
  console.log("hello!!");
  var x = document.forms["myForm"]["uid"].value;
  var y = document.forms["myForm"]["pwd"].value;
  console.log("In checkUP, value of x = " + x + " calue of y = " + y);

  for (var key in UP) {
    var user = UP[key]

    //if(user.username == x && user.password == y){
    if (x.match(user.username) && x.match(user.password)) {
      console.log("user.username = " + user.username + "user.password = " + user.password + " User Id and password matched. Returning true now");
      return true;
    } else {

      return false;
    }
  }
}
<form name="myForm" method="post"  onsubmit="fnCheck(event)">
  UserName
  <input type="text" id="uid" value="uid" />UserPassword
  <input type="password" id="pwd" value="pwd" />
  <input type="submit" value="Submit" />
</form>


EDIT:
In your function you are returning true/false in the if-statement so it will always leave the function in the first iteration.
You should use a boolean flag and change its value accordingly in the if-statement and return it only in the end of the function:
function checkUP() {
  console.log("hello!!");
  var bool = false;
  var x = document.forms["myForm"]["uid"].value;
  var y = document.forms["myForm"]["pwd"].value;
  console.log("In checkUP, value of x = " + x + " calue of y = " + y);

  for (var key in UP) {
    var user = UP[key]
    if (x === user.username && y === user.password) {
      console.log("user.username = " + user.username + "user.password = " + user.password + " User Id and password matched. Returning true now");
      return true;
    }
  }
  return bool;
}

