Javascript questions which don't deserve their own thread.

The Something Awful Forums > Discussion > Serious Hardware/Software Crap > The Cavern of COBOL > Javascript questions which don't deserve their own thread.

Sointenly: Sep 7, 2008

I'm trying to do a little work for my buddies site, and teach myself JS at the same time. Running into a snag though with one little form.

Basic set up of the form is like this:

Enter Username:_______ (which is checked by if/else if for correct length)

Enter Email: ________
Verify Email: _______

Not having any problem with the username, but rather with verifying the email addy.

I know ill have to create a function and then i'm assuming if statements where Email = verify email. But i'm not exactly sure how to start it. I've tried googleing it, but not luck.

If someone could give me a quick example of something like this i'd appreciate it.

in case this makes a diff, here is the code of the username verification

function checkInput(usernameId) {
var usernameValue = document.getElementById(usernameId).value;
alert("username is : " + usernameValue);
if (usernameValue.length < 4)
{
alert("the username is too short");
}
else if (usernameValue.length > 8)
{
alert ("the username is too long");
}
else
{
alert("the username is ok");
}

Sointenly fucked around with this message at 18:55 on Oct 11, 2009

# ¿ Oct 11, 2009 18:53

Adbot: ADBOT LOVES YOU

# ¿ May 3, 2024 19:25

Sointenly: Sep 7, 2008

Word, ill deff look into that.

but i'd still like to know how to just code that out as is, it seems like it should be pretty simple... and i'd just like to know for my own knowledge.

# ¿ Oct 11, 2009 19:01

Sointenly: Sep 7, 2008

actually, all im really concerned with right now is making sure that the two emails that are entered are the same.

after the username is entered, and the email is entered twice, the user presses a submit button which tests everything against the constraints.

i know it may sound kind of counter productive... but all i need to know how to do is once the button is clicked, to check and see if both emails match... not really worried about the format of the email addy at this time.

# ¿ Oct 11, 2009 21:49

Sointenly: Sep 7, 2008

golgo13sf posted:

Combine it with the other code to do a full verification (email addresses match and are in a valid format)

Sick, thank you!

one last thing though, this is my HTML for the button used in the form... i initially wrote it to do the username verification.

<input type="button" value ="checkIt" onclick = "checkInput('username');" />

do i need to make any changes to the html so that it will check email as well? thank you

Sointenly fucked around with this message at 22:34 on Oct 11, 2009

# ¿ Oct 11, 2009 22:27

Sointenly: Sep 7, 2008

Im sorry, i don't mean to ask you to code my entire page... im still having problems linking everything together. Let me just show you everything i'm working with and maybe you can show me how to put everything together.

Doing everything in Visual Studio, I have an HTML file and a JS file. The HTML for the structure of the input boxes and the check button is:

code:

User name: 
  <input type="text" id="username" maxlength="12"/>
  <br />
  Email: 
  <input type="text" id="email1" />
  <br />
  Verify Email: 
  <input type="text" id="emial2" />
  <br />
  <input type="button" value ="CheckIt" onclick = "checkInput('username');" />

Now for the JS, what i have so far, is the validation of the username:

code:

function checkInput(usernameId) {
    var usernameValue = document.getElementById(usernameId).value;
    alert("username is : " + usernameValue);
    if (usernameValue.length < 4) 
    {
        alert("the username is too short");
    } 
    else if (usernameValue.length > 8)
    {
        alert ("the username is too long");
    }
    else 
    {
        alert("the username is ok");
    }

so now i need to have the same button that checks the username, also check the emails as well... I understand the code that was given above, but now i'm stuck on how to link that code to the same check button as the username validation.

# ¿ Oct 12, 2009 07:21

Sointenly: Sep 7, 2008

acht! can you spot where I'm loving up here

HTML

code:

Please enter username and Email.
<br />
  User name: 
  <input type="text" id="username" maxlength="12"/><br />
  Passowrd: 
  <input type="text" id="Email1" maxlength="24"/><br />
  Verify password: 
  <input type="text" id="Email2" /><br />
  <input type="button" value ="checkIt" onclick="wrapperfunction('username')"; />
</form>
</body>
</html>

JavaScript

code:


function wrapperfunction(usernameId){
  checkInput(usernameId);
  checkemail();
    var usernameValue = document.getElementById(usernameId).value;
     var email1 = document.getElementById('email1').value;
     var email2 = document.getElementById('email2').value;

  
    if (usernameValue.length < 4) {
        alert("the username is too short");
    } else {
        alert("the username is ok");
    }

    if(email1 != email2) {
          alert('The two emails do not match!');
          return false;
     }
     else {
          return true;
     }
}

maybe best to mention this now, but when all requirements of the form are met, I need to alert a message that states something like "Username and Password accepted"

Sointenly fucked around with this message at 01:28 on Oct 13, 2009

# ¿ Oct 13, 2009 01:26

Sointenly: Sep 7, 2008

golgo13sf posted:

If you're dead set on a "success" alert on this page, stick it right before the "return true;" in the "validateForm();" function.

he wants all of the JS done via external file, does much change if i move everything out of the HTML?

# ¿ Oct 13, 2009 02:38

Sointenly: Sep 7, 2008

Sointenly posted:

he wants all of the JS done in an external file and then linked, does much change if i move everything out of the HTML and into a separate .JS file?

# ¿ Oct 13, 2009 02:40

Sointenly: Sep 7, 2008

golgo13sf posted:

Nope.

Just for clarification sake...

In the code you posted above, what is it that links those functions to the submit/verification button? Im used to VB where you just code everything individually using common names. I cant seem to find the connection here.

# ¿ Oct 13, 2009 03:57

Sointenly: Sep 7, 2008

golgo13sf posted:

Nope.

First of all, thank you very much for all the help.

Everything is working with the exception of one little bug.

If both email fields are left blank, it will alert the user to enter an email, but then it also alerts the user that inputs were accepted (because it then goes on to check that email1==email2 and i assume it accepts two blank fields as being == )

code:

function checkInput(usernameId, emailId, varemaildId) {
    var usernameValue = document.getElementById(usernameId).value;
    var email1= document.getElementById(emailId).value;
    var email2= document.getElementById(varpemailId).value;
      if (usernameValue.length <4 || usernameValue.length > 8) {
            alert("the username must be between 4 and 8 characters long");
 }
      if(email2.length == 0) {
			 alert("Please confirm your email");
 } 
      if(email1 != email2) {
              alert('The two emails do not match!');
 }      
      else {
              alert("User name and Email accepted");

 }
}

# ¿ Oct 13, 2009 19:19

Adbot: ADBOT LOVES YOU

# ¿ May 3, 2024 19:25

Sointenly: Sep 7, 2008

quote:

"return <value>" ceases all execution of that function and returns that value, kind of like an "exit function" statement in VB, except it returns a value. So you have a bunch of statements that return false on error and at the very end have a "return true;", if it gets to that point everything is ok and processing should continue.

success!

thank you

# ¿ Oct 13, 2009 20:23

The Something Awful Forums > Discussion > Serious Hardware/Software Crap > The Cavern of COBOL > Javascript questions which don't deserve their own thread.