asked on

Apply code from JSFiddle to actual page

OK... I am a simpleton in JavaScript.

I was given a viable solution from an expert with a link to JS Fiddle

How do I apply that on a .Net aspx page which has a masterpage?

Does it go at the top?
Bottom?

Does it need anything added onto the front end of the tags?

There is HTML Code

password :
<input type=password id=pwd1> again
<input type=password id=pwd2>
<br>
<input type=checkbox id=chkUpper>Upper?
<br>
<input type=checkbox id=chkLower>Lower?
<br>
<input type=checkbox id=chkSpec>Special?

Open in new window

Here is the script code

function chkPassword() {
  var c;
  var pwd1 = $("#pwd1").val();
  var pwd2 = $("#pwd2").val();

  $("#chkUpper").prop('checked', false);
  $("#chkLower").prop('checked', false);
  $("#chkSpec").prop('checked', false);
  $("#chkMatch").prop('checked', false);
  $("#btnSubmit").prop('disabled', true);

  console.log(pwd1 + "-" + pwd1.length);

  for (i = 0; i < pwd1.length; i++) {
    c = pwd1.charCodeAt(i);
    console.log(c);
    //65-90:A-Z
    if ((c >= 65) && (c <= 90)) $("#chkUpper").prop('checked', true);
    //97-122:a-z
    if ((c >= 97) && (c <= 122)) $("#chkLower").prop('checked', true);
    if ((c < 65) || (c > 122) || ((c > 90) && (c < 97))) $("#chkSpec").prop('checked', true);
  }
  $("#chkMatch").prop('checked', (pwd1 == pwd2) && (pwd1 != ""));
  var canSubmit = $("#chkUpper").prop('checked') && $("#chkLower").prop('checked') && $("#chkSpec").prop('checked') && $("#chkMatch").prop('checked');
  $("#btnSubmit").prop('disabled', !canSubmit);
}

$("#pwd1").on("keyup", function() {
  chkPassword();
});

$("#pwd2").on("keyup", function() {
  chkPassword();
});

Open in new window

Chris Stanyon

If you already have Javascript file added to your site, then just add the function there. As for the keyup events, they need adding into a document ready block. Again, if you already have one, then add them in there. If not, then add one to your javascript file:

$(document).ready(function() {
  $("#pwd1").on("keyup", function() {
    chkPassword();
  });

  $("#pwd2").on("keyup", function() {
    chkPassword();
  });
});

Open in new window

Larry Brister

ASKER

Chris,
Where does this actually go on the aspx page?

After the ContentPlaceHolder
and Inside a <script type="text\JavaScript">.... tag?

At the bottom?

Those are my actual questions

ASKER CERTIFIED SOLUTION

Chris Stanyon

membership

This solution is only available to members.

To access this solution, you must be a member of Experts Exchange.

Start Free Trial

Larry Brister

ASKER

That works
Thanks