mardi 28 juin 2016

Typeahead only making one request

With the code below, an ajax request to the server will only be made once after the first letter of the first query after a page load.

So if i type product name into the input, the request will be /default.aspx?q=p&serveas=ajax and then no more requests will fire until I reload the page, no matter what I type into the input.

If I copy-paste a word that I know hits I will get a response, but again, only one and only once.

If I console.log on the onResult() callback I can see it is registering the query in the input correctly, it's just not making a request for a result.

I have to parse the Ajax result from HTML to an object because my host can't return JSON search results.

The debug output says everything is normal.

var parseResult = function (data) {

  var arr = [];

  $(data).find('.products').find('.item').each(function(i) {
    var item = $(this);
    arr.push({
      sku: item.prop('id').replace('catalogue-',''),
      name: item.find('.item_name').text(),
      image: item.find('.listing_thumb').find('img').prop('src'),
      url: item.find('a').eq(0).prop('href')
    });
  });

  return arr;

};

searchField.typeahead({

  delay: 300,
  display: ['sku','name'],
  order: "asc",
  minLength: 3,
  maxItem: 15,
  highlight: true,
  filter: false,

  template: "<a href='{{url}}'><img style='max-width:60px;' src='{{image}}'> {{name}} <small style='color:#999;'>{{sku}}</small></a>",
  emptyTemplate: 'No result for "{{query}}"',
  source: {
    items: {
      ajax: {
        type: 'GET',
        url: '/default.aspx',
        data: {
          q: '{{query}}',
          serveas: 'ajax'
        },
        dataType: 'text',

        callback: {
          done: parseResult
        }
      }
    }
  },

  debug: true
});

Aucun commentaire:

Enregistrer un commentaire