mardi 1 septembre 2015

Typeahead multiple remote datasets - unable to select via If statement

I am using v0.10.5 of the Twitter Typeahead library and have used the remote dataset example to connect to two datasets, but I am having problems when trying to run code based upon which dataset the user has searched on.

I have tried using an If statement but this doesn't seem to work (nothing appears in the console log).

Is there anything obvious I am doing wrong? Is there a different way to specify a particular dataset in the on:selected event?

var addresses = new Bloodhound({
  name: "addresses",
  datumTokenizer: Bloodhound.tokenizers.obj.whitespace('ADDRESS'),
  queryTokenizer: Bloodhound.tokenizers.whitespace,
  remote: {
    url: 'php/search_addresses.php?query=%QUERY',
    wildcard: '%QUERY',
    ajax: {
      beforeSend: function (jqXhr, settings) {
        $("#searchicon").removeClass("fa-search").addClass("fa-refresh fa-spin");
      },
      complete: function (jqXHR, status) {
        $('#searchicon').removeClass("fa-refresh fa-spin").addClass("fa-search");
      }
    }
  },
  limit: 50
});

var planning = new Bloodhound({
  name: "planning",
  datumTokenizer: Bloodhound.tokenizers.obj.whitespace('APPLICATION_NUMBER'),
  queryTokenizer: Bloodhound.tokenizers.whitespace,
  remote: {
    url: 'php/search_planning.php?query=%QUERY',
    wildcard: '%QUERY',
    ajax: {
      beforeSend: function (jqXhr, settings) {
        $("#searchicon").removeClass("fa-search").addClass("fa-refresh fa-spin");
      },
      complete: function (jqXHR, status) {
        $('#searchicon').removeClass("fa-refresh fa-spin").addClass("fa-search");
      }
    }
  },
  limit: 50
});

addresses.initialize();
planning.initialize();

$("#searchbox").typeahead({
  minLength: 5,
  hint: false
},
{
  name: 'addresses',
  displayKey: 'ADDRESS',
  source: addresses.ttAdapter(),
  templates: {
    header: "<h4 class='typeahead-header'>Addresses</h4>"
  }
},
{
  name: 'planning',
  displayKey: 'APPLICATION_NUMBER',
  source: planning.ttAdapter(),
  templates: {
    header: "<h4 class='typeahead-header'>Planning Applications</h4>"
  }
}).on("typeahead:selected", function (obj, datum) {
  if (datum.name === "addresses") {
    console.log("address selected"); 
  }
  if (datum.name === "planning") {
    console.log("planning selected");
  }
});

Aucun commentaire:

Enregistrer un commentaire