'why doesn't this jquery add text to the div?

$("#btn-id").click(function() {
  $.getJSON('employee.json', function(response, status) {
    if (status == "error")
      $('#err-id').text('Error Message: Not found');
  });
});
<!DOCTYPE html>

<html>

<body>

  <button id="btn-id">Get Employee Data</button>
  <br><br>
  <div id="err-id"></div>

  <script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
  <script src="employee.js"></script>

</body>

</html>

The jQuery should add 'Error message' to div with id '#err-id'. But it doesn't do that. Why

jquery


Solution 1:[1]

there is not status parameter in response, so try this (credits to @freedomn-m)

    $.getJSON('employe.json', function(json) {
      // your code here
  })
  .fail((j, status) => { 
      $('#err-id').text('Error Message: status - '+j.status+ ' ' +j.statusText);
  });

getJson is a shorthand Ajax function, which is equivalent to:

$.ajax({
  dataType: "json",
  url: url,
  data: data,
  success: success
});

so you can use ajax instead , but add an error option

$.ajax({
  dataType: "json",
  url: url,
  data: data,
  success: success
  error: your error code here

});

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1

Related Questions