Collectives™ on Stack Overflow

Find centralized, trusted content and collaborate around the technologies you use most.

Learn more about Collectives

Teams

Q&A for work

Connect and share knowledge within a single location that is structured and easy to search.

Learn more about Teams

I am new to JavaScript, and I'm trying to figure out how to pass user-inputted values as a parameter to a JavaScript function. Here is my code:

<h1>Adding 'a' and 'b'</h1> a: <input type="number" name="a" id="a"><br> b: <input type="number" name="b" id="a"><br> <button onclick="add(a,b)">Add</button> </form> <script> function add(a,b) { var sum = a + b; alert(sum); </script> </body> <h1>Adding 'a' and 'b'</h1> a: <input type="number" name="a" id="a"><br> b: <input type="number" name="b" id="b"><br> <button onclick="add(document.getElementById('a').value,document.getElementById('b').value)">Add</button> <script> function add(a, b) { var sum = parseInt(a, 10) + parseInt(b, 10); alert(sum); </script> </body> Okay, your solution is somewhat working. However, it is concatenating it as if a and b were strings. So sum is 12 instead of 3 where a=1 and b=2. – cdalto Jan 28, 2014 at 5:56

Firstly an elements ID should always be unique. If your element IDs aren't unique then you would always get conflicting results. Imagine in your case using two different elements with the same ID.

a: <input type="number" name="a" id="a"><br> b: <input type="number" name="b" id="b"><br> <button onclick="add()">Add</button> </form> <script> function add() { var a = document.getElementById('a').value; var b = document.getElementById('b').value; var sum = parseInt(a) + parseInt(b); alert(sum); </script>

1 IDs are meant to be unique

2 You dont need to pass any argument as you can call them in your javascript

a: <input type="number" name="a" id="a"><br> b: <input type="number" name="b" id="b"><br> <button onclick="add()">Add</button> </form> <script> function add() { var a = document.getElementById('a').value; var b = document.getElementById('b').value; var sum = a + b; alert(sum); </script>

   <form action="" onsubmit="additon()" name="form1" id="form1">
      a: <input type="number" name="a" id="a"><br>
      b: <input type="number" name="b" id="b"><br>
      <input type="submit" value="Submit" name="submit">
   </form>
  <script>
      function additon() 
           var a = document.getElementById('a').value;
           var b = document.getElementById('b').value;
           var sum = parseInt(a) + parseInt(b);
           return sum;
  </script>
  a: <input type="number" name="a" id="a"><br>
  b: <input type="number" name="b" id="b"><br>
  <button onclick="add()">Add</button>
</form>
<script>
  function add() {
    a = $('#a').val();
    b = $('#b').val();
    var sum = a + b;
    alert(sum);
</script>
</body>
  a: <input type="number" name="a" id="a"><br>
  b: <input type="number" name="b" id="a"><br>
  <button onclick="add()">Add</button>
</form>
<script>
  function add() {
    var m = document.getElementById("a").value;
    var n = document.getElementById("b").value;
    var sum = m + n;
    alert(sum);
</script>
</body>
I like how most answers here don't know that javascript accepts every input as string unless we use parseInt.
Yes, you can pass parameters in that way.
Just a little modification
Var sum = parseFloat(a)+parseFloat (b); 
Try it (⁠｡⁠•̀⁠ᴗ⁠-⁠)⁠✧
        
Thanks for contributing an answer to Stack Overflow!
Please be sure to answer the question. Provide details and share your research!
But avoid …
Asking for help, clarification, or responding to other answers.
Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.