title: Check for dupe value in dropdown
body: <p>I have some code that adds items to a select list which works fine. However, what I need to do is compare a value that has already been entered so the user cannot enter dupe values. I know how to compare values but cannot get my head round how to check for value already entered.</p>
  
  <p>I would be grateful if someone could shed some light on how to do this. Many thanks</p>
  
  <p>js</p>
  
  <pre><code>$(function() {
    $(document).on('click', '#add', function() {
      var boxvalue = $("#box_input").val();
      if (boxvalue == '') {
        $("#niinputmessage").fadeIn(3000).html('No blank entries').fadeOut(5000).css({
          'color': 'red',
          'margin-left': '5px',
          'margin-top': '5px'
        });
        return false;
      }
      count = $('#box_ni').children('option').length;
      $("#counter").html("Total selected boxes for intake: " + '&lt;span style="font-size: 14px; color: black;"&gt;' + '( ' + count + ' )' + '&lt;/span&gt;').css('color:, black');
      if (count &gt; 2) {
        $("#counter").html("No more than 3 items per intake. Please remove items from the list.");
        return false;
      } else {
        count++;
        $("#counter").html("Total selected boxes for intake: " + '&lt;span style="font-size: 14px; color: black;"&gt;' + '( ' + count + ' )' + '&lt;/span&gt;').css('color:, black');
      }
      $("#box_ni").append("&lt;option&gt;" + boxvalue + "&lt;/option&gt;");
      $("#box_input").val('');
    });
  });
  </code></pre>
  
  <p>js remove function</p>
  
  <pre><code>$(function() {
    $(document).on('click', '#remove', function() {
      $("#box_ni &gt; option:selected").each(function() {
        $("#box_ni option:selected").remove();
        count--;
      });
      $("#counter").html("Total selected boxes for intake: " + 
        '&lt;span style="font-size: 14px; color: black;"&gt;' + '( ' + count + ' )' + 
        '&lt;/span&gt;').css('color:, black');
    });
  });
  </code></pre>