Passing multiple strings from html form to javascript function?

Question

I'm trying to pass 2 values from an HTML form into a javascript function, using a button and the Onclick="myfunction(value1,value2)". So far I'm having no luck.

You can view the website and the source code here: View Page

Here's my code:

Javascript - Ajax Call:

<script type="text/javascript">
function verification_email(name,email) {

    var xmlhttp;
    if (window.XMLHttpRequest) {// code for IE7+, Firefox, Chrome, Opera, Safari
      xmlhttp=new XMLHttpRequest();
    }
    else {// code for IE6, IE5
      xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
    }
    xmlhttp.onreadystatechange=function() {
      if (xmlhttp.readyState==4 && xmlhttp.status==200) {
        document.getElementById("result").innerHTML=xmlhttp.responseText;
      }
    }

    xmlhttp.open("POST","send_verification_email.php?",true);
    xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded");
    xmlhttp.send("name="+name+"++email="+email);

}
</script>

HTML Form:

            <h3 class="subtitle">Verification Details:</h3>
            <p><input type="text" class="form-control" placeholder="First Name" id="name" /></p>
            <p><input type="text" class="form-control" placeholder="Email Address" id="email"/></p>

            <p><button class="btn btn-primary" Onclick="verification_email('name','email')">Request Verifcation Code</button></p>

</form>

Is there a standard way to do this? Am I way off the mark?

Thanks for the help!

How are we supposed to help you if we don't know what you are doing? Please post your code. — Felix Kling, Jun 20 '15 at 23:58
I was trying to write it all on my mobile phone, it was damned near impossible, so I went and grabbed the good old laptop to add the code. I hope it makes more sense now. — Ryan Tirrell, Jun 21 '15 at 00:19
Well, you are literally passing the strings "name" and "email" to the function, not the values of the corresponding fields. So I guess your actual question is *"how can get the value of in input by name"*? — Felix Kling, Jun 21 '15 at 00:21
It's always grounding to come back and look at the types of questions I was asking 4 years ago - humble beginnings :) — Ryan Tirrell, Jul 16 '19 at 19:45

score 3 · Accepted Answer · answered Jun 21 '15 at 00:25

You are passing string literals "name" and "email" instead of appropriate values.

Unless you plan to call the verification function from multiple places within the same page, you can simply read the value into variables inside the function itself, and use no parameters whatsoever:

HTML

<p><button class="btn btn-primary" onclick="verification_email()">Request Verifcation Code</button></p>

JS

function verification_email() {
    var name = document.getElementById('name').value;
    var email = document.getElementById('email').value;
    var xmlhttp;
    etc...

BuzzCloudAU · Answer 2 · 2015-06-21T00:24:51.873

You need to get the values of the fields you want to send, collect those up and pass them to your function.

<button class="btn btn-primary" Onclick="verification_email(document.getElementById('name').value,document.getElementById('email').value)">Request Verifcation Code</button>

There are other - non best practice - ways of collecting this information, such as:

this.form.name.value    
this.form.email.vlaue

Passing multiple strings from html form to javascript function?

2 Answers2