how to call a function based on the input value in javascript?

Question

Below is my Html sample code in which there is a single input field which accepts numbers as well as alphabet.

I need to call function according to the values entered by the user i.e if user enter pure 10 dgits phone number then call function number() if user enters email call function email() else mix then error.

I need only one input element for both phone number and email.

Html

<div>
<input type="text" id="contact"/>
<button onClick()="???">Submit</button>
</div>

<script>
function number(){
  // call when input value is a number;
}

function email() {
 // call this when input value is an email;
}
</script>

you call the same function and do a check within it with if/then/else — Dellirium
– Dellirium, Commented Jun 12, 2018 at 6:40
Add only a single handler, and validate the input, then call either number or email, if that would be necessary anymore. — Teemu
– Teemu, Commented Jun 12, 2018 at 6:40

A. Llorente · Accepted Answer · 2018-06-12 08:33:32Z

2

<button onclick="number()">Submit</button>

If you don't know which function to call you need to determine that:

HTML:

<button onclick="decideFunction()">Submit</button>

JS:

function decideFunction() {
    const value = document.getElementById('contact').value;
    if (!Number.isNaN(value)) {
        number();
    } else if (isEmail(value)) { // check with regexp
        email(); //etc..
    }
}

edited Jun 12, 2018 at 8:33

user6247920

answered Jun 12, 2018 at 6:41

A. Llorente

1,1826 silver badges18 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Ankit Agarwal · Accepted Answer · 2018-06-12 06:48:45Z

You can use regex for checking the email values and use parseInt() with length validation for checking the phone number value

function checkInput(){
  var contact = document.getElementById('contact').value;
  if(contact.length === 10 && parseInt(contact)){
    number();
  } else if(!parseInt(contact)){
    var reg = /^(([^<>()[\]\\.,;:\s@\"]+(\.[^<>()[\]\\.,;:\s@\"]+)*)|(\".+\"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
    if(reg.test(contact)){
       email();
    } else {
       mix();
    }
  } else {
     mix();
  }
  
}
function number(){
  console.log("number");
}

function email() {
 console.log("email");
}

function mix() {
  console.log("Error");
}

<div>
<input type="text" id="contact"/>
<button onClick="checkInput();">Submit</button>
</div>

Sebastian Speitel · Accepted Answer · 2018-06-12 06:41:50Z

1

Just call another function which checks if the value is a number and act accordingly:

function func() {
  let val = document.getElementById("contact").value;
  if (!isNaN(parseInt(val))) number();
  else email();
}

function number() {
  // call when input value is a number;
  console.log("number() called");
}

function email() {
  // call this when input value is an email;
  console.log("email() called");
}

<input type="text" id="contact" />
<button onclick="func()">Submit</button>

answered Jun 12, 2018 at 6:41

Sebastian Speitel

7,3772 gold badges21 silver badges38 bronze badges

Comments

Sanju Kaniyamattam · Accepted Answer · 2018-06-12 06:49:26Z

0

Try this....

 <div>
    <input type="text" id="contact"/>
    <button onClick()="decideFun();">Submit</button>
    </div>

    <script>
    function decideFun(){
      var inputVal = $("#contact").val();

      if($.isNumeric(inputVal)==true) number();
      else email();
    }
    function number(){
      // call when input value is a number;
    }

    function email() {
     // call this when input value is an email;
    }
    </script>

answered Jun 12, 2018 at 6:49

Sanju Kaniyamattam

5051 gold badge4 silver badges14 bronze badges

Collectives™ on Stack Overflow

how to call a function based on the input value in javascript?

4 Answers 4

Comments

Comments

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

Comments

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related