首页 > 解决方案 > 在 AJAX 和 WordPress 中找不到数据时显示消息

问题描述

我在 WordPress 中有一个表单过滤器。

当我没有数据但我不能:

 $.ajax({
    url : ajax_url,
    data : data,
    success : function(response) {
      mafs.find("#ajax_fitler_search_results").empty();
      if(response) {

        for(var i = 0 ;  i < response.length ; i++) {

          var img = null;
          if(response[i].statut == 'encours') {
            img = '//localhost:3000/app/themes/sofico2018/dist/images/icon-encours.svg'
          } 

          var html  = "<li class='cList__item'>";
          html += "      <img width='18' height='21' src='" + img + "' />";
          html += "<p class='cList__chantier'>" + response[i].title + "</p>"
          html += "          <p>Province: " + response[i].province + "</p>";
          html += "</li>";
          mafs.find("#ajax_fitler_search_results").append(html);
        }
      } else {
        alert('error');
        var html  = "<li class='no-result'>No matching movies found. Try a different filter or search keyword</li>";
        mafs.find("#ajax_fitler_search_results").append(html);
      }
    }
  });

});

当我没有匹配的数据时,我得到一个答案 200 但为空。

我的PHP代码:

if ( $search_query->have_posts() ) {

    $result = array();

    while ( $search_query->have_posts() ) {
      $search_query->the_post();

      $cats = strip_tags( get_the_category_list(", ") );
      $result[] = array(
        "id" => get_the_ID(),
        "title" => get_the_title(),
        "statut" => get_field('statut'),
        "province" => $cats
      );
    }

    wp_reset_query();

    echo json_encode($result);

  } else {
    // no posts found
  }

我不知道为什么我在提交验证时得到答案 200 并且没有结果。问题可能来自于?

非常感谢您的帮助!

标签: jqueryajaxwordpress

解决方案


如果您期待 JSON 对象,请设置 contentType 和请求标头,如下所述。

您可以尝试 jQuery.isEmptyObject(response) 来验证对象是否为空。

$.ajax({
        url:  url, 
        dataType: 'json',
        type: method type,
        data : data,
        contentType: "application/json",
        beforeSend: function (e) {
            e.setRequestHeader('Accept', 'application/json; charset=utf-8')
        },
        success: function (response) {
            if(!jQuery.isEmptyObject(response)){
                //logic
            }else{
                //No object recived from backend
            }
        },
        error: function () {
            console.log ("Failed!");
        }
    });

推荐阅读