Question 10837 in Jquery Question posted in
The official Jquery Api Documentation can be found here.

AJax Null Data Change to another valeu when return to html – Jquery

This is my AJAX code that I want to use to get data from an API to show in a div. When I query the data I get value.application_icon is null so this file is blank

I want to use value.application_image when value.application_icon is null. I don’t know how to config this.

$.ajax({
      type: "GET",
      contentType: "application/json",
      url: endpoint + apiKey,
      success: function(response) {
        $.each(response, function(key, value) {
          $('.first-set').append(
            '<li><a href="' + value.application_base_url + '' + value.application_url + '"> n ' +
            '<div> n ' +
            '<i class="' + value.application_icon + '"></i> n ' +
            '</div>' +
            '<span>' + "Search" + '</span>' +
            '</a></li>'
          );
        })
      },
Tags:

2

Answers


  1. 0

    Try this code snippet.

    $.ajax({    
    type: "GET",
    contentType: "application/json",
    url: endpoint + apiKey,
    success: function(response) {
        $.each(response, function(key, value) {
            var icon = value.application_icon;
            if (!icon) {
                icon = value.application_image;
            }
            if (icon) {
                $('.first-set').append(
                    '<li><a href="' + value.application_base_url + value.application_url + '"> n ' +
                    '<div> n ' +
                    '<i class="' + icon + '"></i> n ' +
                    '</div>'+
                    '<span>Search</span>' +
                    '</a></li>'
                );
            }
        });
    },
    error: function(jqXHR, textStatus, errorThrown) {
        console.log(errorThrown);
    }
});

    Or else use like this with for loop

    $.ajax({    
        type: "GET",
        contentType: "application/json",
        url: endpoint + apiKey,
        success: function(response) {
            for(var i=0; i<response.length; i++) {
                var value = response[i];
                var icon = value.application_icon;
                if (!icon) {
                    icon = value.application_image;
                }
                if (icon) {
                    $('.first-set').append(
                        '<li><a href="' + value.application_base_url + value.application_url + '"> n ' +
                        '<div> n ' +
                        '<i class="' + icon + '"></i> n ' +
                        '</div>'+
                        '<span>Search</span>' +
                        '</a></li>'
                    );
                }
            });
        },
        error: function(jqXHR, textStatus, errorThrown) {
            console.log(errorThrown);
        }
    });

    hope it will help you.

    Login or Signup to reply.
  2. 0 
    $.ajax({    
    type: "GET",
    contentType: "application/json",
    url: endpoint + apiKey,
    success: function(response) {
        $.each(response, function(key, value) {
            var icon = !value.application_icon?  value.application_image: value.application_icon;
            $('.first-set').append(
                    '<li><a href="' + value.application_base_url + value.application_url + '"> n ' +
                    '<div> n ' +
                    '<i class="' + icon + '"></i> n ' +
                    '</div>'+
                    '<span>Search</span>' +
                    '</a></li>'
                );
        });
    },
    error: function(jqXHR, textStatus, errorThrown) {
        console.log(errorThrown);
    }
});
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search