Search results not updated for custom widget

I’ve been working on a calendar-like widget using connectors. To get this to work, I updated instantsearch.js from 1.x to 2.x. I am now able to facet according to date, I think.

The stats are updated with the nbHits and processingTimeMS values, but the hits are not updated. The old results remain visible.

Is this because of the updated instantsearch.js or am I doing something else wrong?

Hits widget:

search.addWidget(
	instantsearch.widgets.hits({
		container: '#algolia-hits',
		hitsPerPage: 10,
		templates: {
			empty: 'Geen resultaten gevonden',
			item: wp.template('instantsearch-hit')
		},
		transformData: {
			item: function (hit) {

				function replace_highlights_recursive (item) {
				  if( item instanceof Object && item.hasOwnProperty('value')) {
					  item.value = _.escape(item.value);
					  item.value = item.value.replace(/__ais-highlight__/g, '<em>').replace(/__\/ais-highlight__/g, '</em>');
				  } else {
					  for (var key in item) {
						 item[key] = replace_highlights_recursive(item[key]);
					  }
				  }
				  return item;
				}

				hit._highlightResult = replace_highlights_recursive(hit._highlightResult);
				hit._snippetResult = replace_highlights_recursive(hit._snippetResult);

				return hit;
			}
		}
	})
);

Custom datepicker widget:

const datePicker = instantsearch.connectors.connectRange(
	(options, isFirstRendering) => {
		if (!isFirstRendering) return;

		const { refine } = options;

		$('#uitspraakdatum').change(function() { 
			var value = $(this).val();
			var parts = value.split('-');
			var date = new Date(parts[0], ( parseInt(parts[1]) - 1 ), parts[2]);

			if ( isNaN( date.getTime() ) ) {
				refine(undefined);
			} else {
				var start = ( date.getTime() / 1000 ) + 3600;
				var end = start + ( 24 * 3600 - 1 );
				refine([start,end]);
			}
		});
});

search.addWidget(
	datePicker({
		attributeName: 'uitspraakdatum',
	})
);

Hi @n.wenting, would it be possible to setup a working example from the code above? It will help us to better understand where the issue come from. We provide template to avoid you the boilerplate part. You can find it on CodeSandbox.

Thanks!

Ah great, will use that next time :slight_smile: I just found the issue:

I was using data._highlightResult.xyz[0] values in the results, where xyz is not present in the resulting data object. For some reason Firefox doesn’t complain (which is why I didn’t spot it) but, luckily, Chrome does.

Sorry to bother you :roll_eyes:

No worries, glad to see that you solved your issue!

1 Like