Unable to Validate multiple Inputs

Unable to Validate multiple Inputs

I have a simple 5 input boxes where user can select 5 different cities from Autocomplete. I want to Validate if any user is entering same city name more than once or not. And highlight that box with a color.

I tried with two input boxes it works fine. For more than two it does not work.


html

  1. <html>
  2. <input type="text" name="country1" id="country1"/>
  3. <input type="text" name="country2" id="country2"/>
  4. <input type="text" name="country3" id="country3"/>
  5. <input type="text" name="country4" id="country4"/>
  6. <input type="text" name="country5" id="country5"/>
  7. <input value="Draw Chart" type="submit" id="submit"/>
  8. </html>
  9.  
Javscript

  1. $( function() {
  2.     var availableTags = [
  3.       "London",
  4.       "New York",
  5.       "Tokyo",
  6.       "Manila",
  7.       "Hong Kong",
  8.       "Taipei",
  9.       "New Delhi",
  10.       "Colombo",
  11.       "Dubai",
  12.       "Paris",
  13.       "Berlin",
  14.       "Stockholem",
  15.       "Madrid",
  16.       
  17.     ];
  18.     $( "#country1,#country2,#country3" ).autocomplete({
  19.       source: availableTags
  20.     });
  21.   } );
  22.   
  23.   $("#submit").click(function(){
  24.   // Works for Two Input
  25.   /*if ($('#country1').attr('value') == $('#country2').attr('value')){
  26. alert("You are not allowed to Select Same city multiple times");
  27.    $("#submit").button("disable");
  28.    return false;
  29. }*/
  30.             //Does not Work for more than two
  31. if ($('#country1').attr('value') == $('#country2').attr('value')==('#country3').attr('value')){
  32. alert("You are not allowed to Select Same city multiple times");
  33.    $("#submit").button("disable");
  34.    return false;
  35. }