Sometimes, an autocomplete widget doesn't map directly to one data source. Take video for instance. Imagine the user needs to pick a video, but the two data sources are DVD and Blu-ray. If we were to use autocomplete to select a video, we would need a way to assign multiple data sources. Furthermore, the mechanism would need to be extensible enough to support adding more data sources, especially since there is a new video format born every other year.
The default implementation of the autocomplete widget is expecting a single data source – an array or an API endpoint string. We'll give the widget a new sources option to allow for this behavior. This is how we'll extend autocomplete and create an instance of the widget that has two video data sources – one for DVDs, and one for Blu-ray discs.
( function( $, undefined ) {
$.widget( "ab.autocomplete", $.ui.autocomplete, {
options: {
sources: []
},
_create: function() {
...