title: Names Picker using Select2 and REST Service control
body: <p>I'm trying to create a Names Picker using Select2, for this I want to pull data from ($VIMPeople) View by using a REST Service.</p>
  
  <p>The problem I have is that I need to filter my JSON source based on user input also I need to figure out how to pull new entries since If I don't set the 'Count' property from REST Service, it will get only the first 10 entries by default.</p>
  
  <p>This is how it looks based on this code; the right characters are underlined in the results, but nothing is filtered out.</p>
  
  <p><img src="https://i.stack.imgur.com/7y1cw.png" alt="enter image description here"></p>
  
  <p>
  
      
          
          
          
      
      
          
              
                  
                      
                      
                  
              
          
      </p>
  
  <pre><code>&lt;xp:br&gt;&lt;/xp:br&gt;
  Names Picker using REST Service
  &lt;xp:br&gt;&lt;/xp:br&gt;
  &lt;xp:inputHidden id="inputHidden1" /&gt;
  &lt;xp:scriptBlock id="scriptBlock1"&gt;
      &lt;xp:this.value&gt;&lt;![CDATA[
              x$( "#{id:inputHidden1}" ).select2({
                          placeholder: "Find someone",
                          minimumInputLength: 2,
                          allowClear : true,
                          quietMillis: 300,
                          width: '300px',
                          multiple: true,
                          ajax: {
                              dataType: 'json',
                              url: "./NamesPickerSelect2.xsp/namespicker",                             
                              //results: function (data) {
                              //  return {results: data};
                              //}
                              data: function (term, page) {
                                  return {
                                      q: term, // search term                                     
                                      page: page
                                  };
                              },
                              results: function (data, page) {
                                  return { results: data};
                              }
                          }
                      });
              ]]&gt;&lt;/xp:this.value&gt;
  &lt;/xp:scriptBlock&gt;
  </code></pre>
  
  <p></p>