0

I have textbox and drop-down I want to compare both the values and trigger alert every time when something changes and both are not equal. Suppose If I select six from my drop-down and If I don't enter 6 numbers in my textbox it should trigger alert and also I should get alert if I enter 6 numbers in textbox and select 12 numbers in my drop-down. How do I write single function to check both the conditions?

  $(document).ready(function () {
            $('#myDropdown').change(function () {
            
             var sixNumeric = /^[0-9]{6}$/;
              var twelveNumeric = /^.[0-9]{12}$/;
              
             var dropdown = $("#myDropdown").val();
             var textval = $("#myInput").val();
            
            if (myDropdown == 'text' ) {
               alert("enter only text");
                   
                }
                if (dropdown == "six") {
                    if (sixNumeric.test(textval) ==false ) {
                        alert("Must be 6 numeric");
                    }
                } 
                if (dropdown == "tweleve") {
                    if (twelveNumeric.test(textval) ==false ) {
                        alert("Must be 12 numeric");
                    }
                } 
            });
<select id="myDropdown">
    <option value="six">SixNumeric</option>
    <option value="tweleve">TwelveNumeric</option>
</select>
<input type="text" id="myInput"  value="" />
jina
  • 115
  • 11

2 Answers2

0

Your dropdown variable is not well defined. It refers to the value of stateCode where it should be referring to the dropdown value. If you change this line

var dropdown = $("#stateCode").val();

to

var dropdown = $("#myDropdown").val();

it should work.

You should also remove or change this part :

if (myDropdown == 'text' ) {
     alert("enter only text");
}

As myDropdown is not defined in your code.

Dimitri Mockelyn
  • 1,535
  • 2
  • 11
  • 17
  • Sorry! I made mistake while pasting my code. Edited my code above – jina May 13 '19 at 19:23
  • What is the problem you are experiencing ? nothing happens on the dropdown change ? – Dimitri Mockelyn May 13 '19 at 19:25
  • I am Getting alert if I add 4 digits and select six from dropdown. but I also want to check the vice versa. that is first I select dropdown value is six now and if i enter 12 digits I should get alert. – jina May 13 '19 at 20:15
  • This means you would get an alert everytime a user changes the input ? if you enter 6 characters you would get 5 alerts before finally having a correct result ? or you want to reverse check only if you get to 6 or 12 chars ? – Dimitri Mockelyn May 13 '19 at 20:20
  • I am not sure how can I achieve this, which is the correct way to check both the conditions. – jina May 13 '19 at 20:34
0

What your asking for is not very clear, but I feel like you're trying to do more than you need to.

If 'sixnumeric' just means a 6 digit number, you could do something like pull the value from the textbox, use isNaN to determine if it is a valid number, and if it passes that check validate it against the dropdown value.

Heads up, isNaN will return true on a string of spaces or an empty string so you will need to check those cases as well.

isNaN: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/isNaN

isNaN and empty strings: Why does isNaN(" ") equal false

Nagilum
  • 65
  • 1
  • 1
  • 5