Select2-避免在多个字段上重复数据

Question

我有两个select2字段，它们从同一数据库收集数据。我正在尝试过滤第一个字段的数据，以便当有人开始输入时，第二个字段中的数据将不可用。

这是我的代码：

jQuery(document).ready(function($) {

  $('.smart-select2').each(function() {
    $(this).attr('style', 'width:100%');
  });

  $(".cidades-atendidas").select2({
    tags: true,
    allowClear: true,
    delay: 250,
    minimumInputLength: 3,
    maximumSelectionLength: 3,
    ajax: {
      url: "getData.php",
      type: "post",
      dataType: 'json',
      delay: 250,
      data: function(params) {
        return {
          searchTerm: params.term // search term
        };
      },
      processResults: function(response) {
        return {
          results: response
        };
      },
      cache: true
    }
  });
});

<div class="row">
  <div class="col-sm-12 col-md-12 col-xs-12 mt40 text-left" style="padding: 0px 40px;">
    <div class="smart-forms">
      <div class="frm-row">
        <div class="section-n colm colm12">
          <select name="cidades_atendidas[]" style="width:100%" id="cidaten1" class="cidades-atendidas selUser smart-select2 select2-hidden-accessible" placeholder="Nome da Primeira Cidade...">
          </select>
        </div>
        <div class="section-n colm colm12">
          <select name="cidades_atendidas[]" style="width:100%" id="cidaten2" class="cidades-atendidas selUser smart-select2 select2-hidden-accessible" placeholder="Nome da Segunda Cidade...">

          </select>
        </div>
        <div class="section-n colm colm12">
          <select name="cidades_atendidas[]" style="width:100%" id="cidaten3" class="cidades-atendidas selUser smart-select2 select2-hidden-accessible" placeholder="Nome da Terceira Cidade...">
          </select>
        </div>
      </div>
    </div>
  </div>
</div>


<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.6-rc.0/js/select2.min.js"></script>

这是我要避免的情况的图片：