title: how to not add repeated data using jquery
body: <pre><code>&lt;div class="span6"&gt;
  &lt;div class="control-group"&gt;
  &lt;label class="control-label"&gt;User Name&lt;span class="required"&gt;*&lt;/span&gt;&lt;/label&gt;
  &lt;div class="controls"&gt; 
  &lt;?php
  foreach($res as $key=&gt;$value){
  foreach($value as $ind=&gt;$username){
  echo '&lt;div class="controls users"&gt;'.form_checkbox('username[]', $username).$username.'&lt;/div&gt;';
  }
  }
  ?&gt; 
  &lt;/div&gt;
  &lt;/div&gt;
  &lt;/div&gt;
  &lt;div class="span6"&gt;
  &lt;div class="control-group"&gt;
  &lt;label class="control-label"&gt;Programs&lt;span class="required"&gt;*&lt;/span&gt;&lt;/label&gt;
  &lt;?php 
  $ids = explode(',', $program_id);
  foreach($programs as $value){
  ?&gt;
  &lt;div class="controls programs"&gt; 
  &lt;?php echo '&lt;label class="radio"&gt;'.form_radio('programs', $value-&gt;id).$value-&gt;program_name.'&lt;/label&gt;' ?&gt;
  &lt;div class="listings &lt;?php echo $value-&gt;id ?&gt;"&gt;&lt;/div&gt;
  &lt;/div&gt;
  &lt;?php } ?&gt;
  &lt;input type="button" name="reset" value="Reset" id="reset"/&gt;
  &lt;input type="button" name="submit" value="Ok" id="oksubmit"/&gt;
  &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>I have users and programs. I want to add users to programs and I am using jquery.I have added multiple users to programs.The problem is I dont want to add user twice for same program.How to do it.I tried the following in jQuery but to no avail.</p>
  
  <pre><code>&lt;script type="text/javascript"&gt;
      $(document).ready(function(e) {
           $('.programs div.listings').slideUp();
  
          $('#oksubmit').click(function(){
              var error = false;
              var temp = '';
              var selusers = $('div.users span.checked input').map(function(_,el){
                  return $(el).val();
              }).get();
              var prgm = $('div.programs span.checked input').val();
  
              if(selusers == ''){
                  alert('Select at least 1 user.');
                  var error = true;
                  return false;
              }
              if(prgm == ''){
                  alert('Select 1 program.');
                  var error = true;
                  return false;
              }
              if( ! error){
                  $('div.'+prgm).slideDown();
                  $('div.users span.checked').each(function(){ 
                      var value=$(this).find('input[type="checkbox"]').val();
                      if($('div.'+prgm).children().length &gt; 0){
                          $('div.'+prgm).children().each(function(){
                              var childval = $('div.list input').val();
                              if(value == childval){alert('a');
                                  alert('Error');
                                  var error = true;
                                  return false;
                              }else{
  
                                  alert('n');
                              }
                          })
                          if( ! error){
                              temp += '&lt;div class="list"&gt;&lt;input type="text" value="'+value+'" readonly&gt;&lt;/input&gt;&lt;a class="delete" id="'+value+'"&gt;X&lt;/a&gt;&lt;/div&gt;';
                          }
                      }else{
                          temp += '&lt;div class="list"&gt;&lt;input type="text" value="'+value+'" readonly&gt;&lt;/input&gt;&lt;a class="delete" id="'+value+'"&gt;X&lt;/a&gt;&lt;/div&gt;';
                      }
  
                  })
                  $('div.'+prgm).append(temp);
  
  
              }
  });
  &lt;/script&gt;
  </code></pre>
  
  <p>Any suggesstions/help is welcome.Thanks in advance.</p>
  
  <p>My solution:</p>
  
  <pre><code>$('#oksubmit').click(function(){
      $('div.users span.checked').each(function(){
                          var flag = true; 
                          var value = $(this).find('input[type="checkbox"]').val();
                          var child = $('div.'+prgm).find('.list').size();
                          var temp = '&lt;div class="list"&gt;&lt;input type="text" name="selusers['+prgm+'][]" value="'+value+'" readonly&gt;&lt;/input&gt;&lt;a class="delete btn-danger" id="'+value+'"&gt;&lt;i class="icon-remove icon-white"&gt;&lt;/i&gt;&lt;/a&gt;&lt;/div&gt;';
                          $('div.'+prgm).find('div.list').each(function(ind,val){
                              var childval = $(this).find('input').val();
                              if(value == childval){
                                  flag =false;
                                  alert('Cant add '+value+' twice in same program');
                                  return false;
                              }
                          });
                          if(flag){
                              $('div.'+prgm).append(temp);
                          }else{
                              //alert('b')
                          }
                      })
  })
  </code></pre>