jQuery UI autocomplete, montrer quelque chose alors qu'aucun résultat n'

J'ai le code suivant:

//Autocomplete search
    $("#shop_search").autocomplete({
      source: '<%= spotify_search_path(:json) %>',
      minLength: 1,
      select: function(event, ui) {
        append_place(ui.item.name, ui.item.id, ui.item.shop_type, ui.item.address_geo, ui.item.contact, ui.item.email, ui.item.web);
        $("#shop_search").val('');
      }
    }).data( "autocomplete" )._renderItem = function( ul, item ) {
      return $( "<li></li>" )
      .data( "item.autocomplete", item )
      .append( "<a>" + "<span class='autocomplete_link'>" + item.name + "</span>" + "<br />" + "<span class='autocomplete_address'>" + item.address_geo + "</span>" + "</a>" )
      .appendTo( ul );

      $(".ui-autocomplete-loading").ajaxStart(function(){
        $(this).show();
      });

      $(".ui-autocomplete-loading").ajaxStop(function(){
        $(this).hide();
      });

    };

Actuellement, il ne montre que de la liste de saisie semi-automatique lorsqu'il est le résultat de la recherche. Je veux qu'elle affiche "Aucun résultat trouvé" lorsque rien n'a pu être trouvé. Que dois-je ajouter dans le code?

Grâce.

InformationsquelleAutor Victor | 2010-11-10
  1. 18

    Si vous utilisez jQuery ajax appel à la source, vous pouvez ajouter "Aucun résultat trouvé" pour les résultats si il n'y en a pas. Puis sur la méthode de sélection, vous pouvez simplement vérifier pour voir si l'article est de la "aucun résultat trouvé" l'élément que vous avez ajouté, et si oui, ne rien faire. Ici, j'ai identifié que par la vérification pour voir si l'id est égal à zéro.

    $("#shop_search").autocomplete({
    source: function (request, response) {
        $.ajax({
            url: "<%= spotify_search_path(:json) %>",
            data: {
                term: request.term
            },
            success: function (data) {
                if (data.length == 0) {
                    data.push({
                        id: 0,
                        label: "No results found"
                    });
                }
                response(data);
            }
        });
    },
    select: function (event, ui) {
        if (ui.item.id != 0) {
            append_place(ui.item.name, ui.item.id, ui.item.shop_type, ui.item.address_geo, ui.item.contact, ui.item.email, ui.item.web);
            $("#shop_search").val('');
        }
    }
});

    Vous aurez besoin de faire un peu de travail sur votre modèle pour obtenir la "aucun résultat trouvé" pour afficher correctement, mais cela devrait vous mettre sur la bonne voie.

    InformationsquelleAutor Chris Jackson
  2. 0

    Vous pouvez simplement vérifier si l'élément est null ou 0.
    Si l'élément est 0 ou null ajouter "Aucun résultat trouvé" d'autre ajouter l'élément. C'est fondamentalement toute logique.

    InformationsquelleAutor mr.b
  3. 0

    Peut-être cela aide

    source: function( request, response ) {
    $.getJSON( url, {
        term: extractLast( request.term )
    }, response )
    .error(function() {
        console.log("no results");
    });
},
    InformationsquelleAutor goksel
  4. 0
    $( "#jsonNameSearch" ).autocomplete({
    //This is the source of the autocomplete, in the success method if the 
    //length of the response is zero then highlight the field indicating no match.
    source: function( request, response ) {
        $.getJSON( 'jsonAutocomplete.ajax?dataType=drivers', {
            term: request.term 
        }, response )
        .success(function(data) { 
            (data.length == 0) ? $( "#jsonNameSearch" ).addClass('nomatch') : $( "#jsonNameSearch" ).removeClass('nomatch');
        });
    },      
    select: function( event, ui ) {         
        if (ui.item) self.location.replace('driverModify.htm?id='+ui.item.id);          
    }           
});
    • Ce serait encore mieux si vous l'avez expliqué que le code que vous avez posté.
    InformationsquelleAutor Theisen