Как показать ошибку, если имя не существует в файле JSON?

Question

Я застрял, как показать ошибку, если имя не существует в файле JSON. Я пробовал if (searchField! = Value.name.search (expression)) и if (searchField! = Value.name), но он не работает. Вот мой код, который я пробовал. Пожалуйста помоги. Спасибо

js код

$(document).ready(function() {
  $('.dropbox').css('border', 'none');
  $.ajaxSetup({
    cache: false
  });
  $('#search').keyup(function() {
    $('#searchResult').html('');
    $('#state').val('');
    var searchField = $('#search').val().trim();
    var expression = new RegExp(searchField, "i");
    console.log(expression);
    $.getJSON('result.json', function(data) {
      $.each(data, function(key, value) {
        if (value.name.search(expression) != -1) {
          $('.dropbox').css('border', '1px solid #EBEDF8');
          $('#searchResult').append('<ul><li><div class="img_c"><img src="' + value.imgURL + '" alt="Profile Pic"></div><div class="content-box"> ' + value.name + '|<span>' + value.city + ', ' + value.state + '</span></div></li></ul>');
        }
        if (searchField === '') {
          $('#searchResult').html('<div class="message">No matches found</div>');

        }
      });
    });
  });
  $('#searchResult').on('click', 'li', function() {
    var click_text = $(this).text().split('|');
    $('.dropbox').css('border', 'none');
    $('#search').val($.trim(click_text[0]));
    $("#searchResult").html('');
  });
});

HTML

<div class="dropbox">
    <div id="searchResult"></div>
</div>

файл result.json

[
 {
     "id":1,
      "name":"John",
      "city":"London City",
      "state":"London",
      "imgURL":"images/pic.svg"

 },
 {
    "id":2,
     "name":"Mathew",
     "city":"New York City",
     "state":"NY",
     "imgURL":"images/pic.svg"

},
{
     "id":3,
      "name":"Jackson",
      "city":"Washington",
      "state":"DC",
      "imgURL":"images/pic.svg"

 }

]

Answer 1

Чтобы отобразить ошибку, если не найдено ни одного результата, просто используйте предложение else

    if (value.name.search(expression) != -1) {
      $('.dropbox').css('border', '1px solid #EBEDF8');
      $('#searchResult').append('<ul><li><div class="img_c"><img src="' + value.imgURL + '" alt="Profile Pic"></div><div class="content-box"> ' + value.name + '|<span>' + value.city + ', ' + value.state + '</span></div></li></ul>');
    }else{
       // if no match append error-message
       $('#searchResult').append("<p>No results found </p>");
    }

Answer 2

Попробуйте так:

var data=[
 {
     "id":1,
      "name":"John",
      "city":"London City",
      "state":"London",
      "imgURL":"images/pic.svg"

 },
 {
    "id":2,
     "name":"Mathew",
     "city":"New York City",
     "state":"NY",
     "imgURL":"images/pic.svg"

},
{
     "id":3,
      "name":"Jackson",
      "city":"Washington",
      "state":"DC",
      "imgURL":"images/pic.svg"

 }

];
function a(){
  var searchField=$("input").val();
  if(searchField==''){$("#results").empty();return;}
  var expression = new RegExp(searchField, "i");
  console.log(expression);
  $("#results").empty(). append ("<ul>");
  $.each(data, function(key, value) {
        if ((value.name).match(expression) != null) {
          $("#results").append('<li><div class="img_c"><img src="' + value.imgURL + '" alt="Profile Pic"></div><div class="content-box"> ' + value.name + '|<span>' + value.city + ', ' + value.state + '</span></div></li>');
          }else{ $("#results").append(''); $("#results").append("</ul>");}      
      });}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input onkeyup="a()">
<div id="results"></div>