Pre-populate with remote data source , using transport, processResults and tempateResult

How Do I...
#1

Hi ,

I am trying to pre-populate a select2 from a remote data source.
My data source is not a standard ajax ( it is a graphql datasource) and I am using processResults and templateResults

How would I best pre-populate the select2 dropdown ?
Is there a way to call the transport function, with the params argument I need for the initial population of the dropdown.
What would I pass as success and failure functions in this case ?

below is my select2 ajax setup

thanks

  ajax: {
    transport: (params, success, failure) => {
      if (params.data['term']) {
        if (params.data['term'].length > 1) {
          ClassCode.get(params.data['term']).then(data => { success(data.classCodes) })
        }
      }
      return null
    },
    processResults: function (data) {
      data = data.map((x) => { return { id: x.code, text: x.code + "|" + x.descriptions[0].description } })
      return {
        results: data
      };
    },
  },
  templateSelection: function (state) {
    return state.id
  },
  templateResult: function (data) {
    var r = data.text.split('|');
    var result = $(
      '<div class="row">' +
      '<div class="col-md-3">' + r[0] + '</div>' +
      '<div class="col-md-9">' + r[1] + '</div>' +
      '</div>'
    );
    return result;
  }
#2

If you know the specific query term that will retrieve the data you wish to pre-populate the results list with, you should be able to programmatically “stuff” that query term into the Select2’s input field with some jQuery code like this:

let queryTerm = 'your query term goes here';
$("#my-select").select2("open"); // You must open the dropdown to create the search field.
$("input.select2-search__field").eq(0).val(queryTerm);

That should trigger the Select2 to send your query term to your AJAX data source.