https://www.ville-vezinlecoquet.fr/wp-content/themes/noyau/assets/js/recherche.js

1jQuery(function ($) {
2
3    // Recherche - Autocomplétion
4    // ----------------------------------------------------------------
5    $('.recherche-autocompletion form .rechercher').autocomplete({
6        delay: 200,
7        minLength: 2,
8        appendTo: $('.recherche-autocompletion form'),
9        source: function (req, add) {
10            $('.recherche-autocompletion form .rechercher').addClass('loader');
11            $.ajax({
12                type: 'POST',
13                dataType: 'json',
14                url: document.location.origin + '/wp-admin/admin-ajax.php',
15                data: {
16                    action: 'search_autocomplete',
17                    term: req.term
18                },
19                success: function (data) {
20                    $('.recherche-autocompletion form .rechercher').removeClass('loader');
21                    var suggestions = [];
22                    if (data != '' && data != undefined && data != null) {
23                        $.each(data, function (i, val) {
24                            suggestions.push({
25                                "label": val.label,
26                                "link": val.link,
27                                "typeCustom": val.typeCustom,
28                                "type": val.type,
29                                "image": val.image
30                            });
31                        });
32                    } else {
33                        suggestions.push({"label": "Aucun résultat", "link": "#", "type": 'resultats'});
34                    }
35                    add(suggestions);
36                },
37                error: function (data) {
38                    console.log(data.responseText);
39                    console.log('error');
40
41                    $('.recherche-autocompletion form .rechercher').removeClass('loader');
42
43                    var suggestions = [];
44                    suggestions.push({"label": "Aucun résultat", "link": "#", "type": 'resultats'});
45                    add(suggestions);
46                }
47            });
48        },
49        select: function (event, ui) {
50            window.location.href = ui.item.link;
51        }
52    })
53        .data('ui-autocomplete')._renderItem = function (ul, item) {
54
55        // Highlight
56        var titre = String(item.label).replace(new RegExp(this.term, "gi"), "<strong>$&</strong>");
57
58        var $li = $('<li>');
59        $li.attr('data-value', item.label);
60        $li.addClass(item.type);
61        $li.append('<a href="' + item.link + '">');
62
63        // Image
64        $li.find('a').append('<div class="image"></div>');
65        if (item.image != '') {
66            $li.find('a').find('.image').append('<span style="background-image:url(' + item.image + ')"></span>');
67        }
68
69
70        // Titre
71        $li.find('a').append('<span class="titre">' + titre + '</span>');
72
73
74        // Type
75        if (item.typeCustom != '')
76            $li.find('a').append('<span class="type">' + item.typeCustom + '</span>');
77
78
79        return $li.appendTo(ul);
80
81    };
82
83
84    // Annuler l'autocomplétion quand on appuis sur "Entrer" dans le champ de recherche
85    // ----------------------------------------------------------------
86    $('.recherche-autocompletion form .rechercher').keypress(function (e) {
87        var code = (e.keyCode ? e.keyCode : e.which);
88        if (code == 13) { //Enter keycode
89            $('.recherche-autocompletion form .rechercher').autocomplete('close');
90        }
91    });
92});