jQuery यूआई स्वत: पूर्ण, शो कुछ जब कोई परिणाम नहीं

Question

मैं है निम्नलिखित कोड:

// 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(); 
     }); 

    }; 

वर्तमान में यह केवल स्वत: पूर्ण ड्रॉप डाउन से पता चलता है जब वहाँ खोज परिणाम है। मैं इसे "कोई मिलान नहीं मिला" दिखाना चाहता हूं जब कुछ भी नहीं मिला। मुझे कोड में क्या जोड़ना चाहिए?

धन्यवाद।

Answer 1

यदि आप स्रोत के लिए एक jQuery AJAX कॉल का उपयोग करते हैं, तो आप परिणामों में "कोई परिणाम नहीं मिला" जोड़ सकते हैं यदि कोई नहीं है। फिर चयन विधि पर, आप यह देखने के लिए बस जांच सकते हैं कि आइटम "कोई परिणाम नहीं मिला" आइटम है जिसे आपने जोड़ा और यदि ऐसा है, तो कुछ भी नहीं करें। यहां मैंने यह देखने के लिए जांच की है कि आईडी शून्य के बराबर थी या नहीं।

$("#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(''); 
     } 
    } 
}); 

आप ठीक से प्रदर्शित करने के लिए "कोई परिणाम मिले" पाने के लिए अपने टेम्पलेट पर कुछ काम करने की आवश्यकता होगी, लेकिन यह सही रास्ते पर आप मिलना चाहिए।

Answer 2

आप केवल यह जांच सकते हैं कि आइटम शून्य है या 0. यदि आइटम 0 है या शून्य संलग्न है "कोई मिलान नहीं मिला" तो आइटम को संलग्न करें। यह मूल रूप से संपूर्ण तर्क है।

Answer 3

हो सकता है इस में मदद करता है

source: function(request, response) { 
    $.getJSON(url, { 
     term: extractLast(request.term) 
    }, response) 
    .error(function() { 
     console.log("no results"); 
    }); 
}, 

Answer 4

$("#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);   
    }   
});