Are you first timer at lazacode.org? Why not join us and start exchange your programming knowledge with everyone. Register today!

jQuery - getJSON for API

0 votes
30 views
added May 28 in API by LC Marshal Lieutenant (13,870 points)
edited Jul 12 by LC Marshal
var input = $('#keyword'),
    form =  $('#search'),
    apiurl = ('http://api.giphy.com/v1/gifs/search?api_key=dc6zaTOxFJmzC&q=' + '')

$.getJSON( apiurl + userInput, function( response ){
console.log(get.JSON)
})

8 Responses

0 votes
responded May 28 by LC Marshal Lieutenant (13,870 points)
edited Jul 12 by LC Marshal
//test the getJSON is in place with console.log
var lookforstate = $('ol.breadcrumb li:last-child').text(),
    trimstate = lookforstate.split(","),
    resultstate  = trimstate [trimstate.length-1],
    getstate = $.trim(resultstate),
    outlookLislnk = 'https://alice.edgeprop.my/property/v1/nsearch?&state=',
    incDistrc = '&size=4&order_by=posted_desc&listing_type=sale&district=',
    fulloutLislink = outlookLislnk + getstate + incDistrc + areaname;

//API 
$.getJSON(fulloutLislink, function(areaOutlooklist) {
  console.log('it worked!');
});

 

0 votes
responded May 28 by LC Marshal Lieutenant (13,870 points)
edited Jul 12 by LC Marshal
//Show value of JSON with console.log(value)
var areaname = $('h1.page-header').text(), 
    lookforstate = $('ol.breadcrumb li:last-child').text(),
    trimstate = lookforstate.split(","),
    resultstate  = trimstate [trimstate.length-1],
    getstate = $.trim(resultstate),
    outlookLislnk = 'https://alice.lalala.my/property/v1/nsearch?&state=',
    incDistrc = '&size=4&order_by=posted_desc&listing_type=sale&district=',
    fulloutLislink = outlookLislnk + getstate + incDistrc + areaname,

$.ajax({
  url: fulloutLislink,
  dataType: 'json',
  type: 'get',
  cache: 'false',
  success: function(data) {
    $(data.property).each(function(index, value) { //property based on the inspect element
      console.log(value);
    });
  }
})
0 votes
responded May 30 by LC Marshal Lieutenant (13,870 points)
edited Jul 12 by LC Marshal
//To get value for array in JSON
//inspect element, go to value and right click to 'copy property path'
field_prop_bathrooms:{und: Array(1)}

var property_data = '';
$.each(areaOutlooklist.property, function(index, row) {
property_data += '<div class="col-md-3">'; 
property_data += '<div class="col-md-12">'; 
property_data += '<span class="single-card"><span class="title"><a href="'+'/listing/'+row.url+'">'+row.title+'</a></span>';   
property_data += '<span class="meta">'+row.district+', '+row.state+'</span>';
property_data += '<span class="price">'+row.field_prop_asking_price.und["0"].value+'</span></span>';
property_data += '</div>';
property_data += '</div>'; 
});
0 votes
responded May 30 by LC Marshal Lieutenant (13,870 points)
edited Jul 12 by LC Marshal
//Get total JSON record count
$.getJSON(fulloutLislink, function(areaOutlooklist) { 

  var property_data = '';
  $.each(areaOutlooklist.property, function(index, row) {
    property_data += '<span class="single-card"><span class="title"><a href="'+'/listing/'+row.url+'">'+row.title+'</a></span>';   
    property_data += '<span class="meta">'+row.district+', '+row.state+'</span></span>';
  });
  alert(property_data.length);
});
0 votes
responded May 31 by LC Marshal Lieutenant (13,870 points)
edited Jul 12 by LC Marshal
//Accessing JSON array to get count result i.e .found
var areaname = $('h1.page-header').text(),
    lookforstate = $('ol.breadcrumb li:last-child').text(),
    trimstate = lookforstate.split(","),
    resultstate  = trimstate [trimstate.length-1],
    getstate = $.trim(resultstate),
    outlookLislnk = 'https://alice.edgeprop.my/property/v1/nsearch?&state=',
    incDistrc = '&size=4&order_by=posted_desc&listing_type=sale&district=',
    fulloutLislink = outlookLislnk + getstate + incDistrc + areaname;

//API 
$.getJSON(fulloutLislink, function(areaOutlooklist) {
var property_data = '';
$.each(areaOutlooklist.property, function(index, row) {
  property_data += '<span class="meta">'+row.district+', '+row.state+'</span>';
});
var outlookListing    = $('#outlook-property-listing').fadeIn(500).append(property_data),

$('.count-sale').fadeIn(300).text(areaOutlooklist.found);
});
0 votes
responded Jun 1 by LC Marshal Lieutenant (13,870 points)
edited Jul 12 by LC Marshal
<!--ad list of JSON object into HTML element e.g <ul>-->
<ul id="newlaunch-development-listings"> 
</ul>

<script>
  var lookforstate = $('ol.breadcrumb li:last-child').text(),
      trimstate = lookforstate.split(","),
      resultstate  = trimstate [trimstate.length-1],
      getstate = $.trim(resultstate),
      outlookLislnk = 'https://alice.edgeprop.my/property/v1/nsearch?&state=',
      newlaunchList = '&new_launch=1&district=',
      fulloutLisNewlaunch = outlookLislnk + getstate + newlaunchList + areaname;

  //newlaunches - upcoming development
  $.getJSON(fulloutLisNewlaunch, function(areaOutlookNewlaunchList) {
  var property_nldata = '';
  $.each(areaOutlookNewlaunchList.property, function(index, row) {   
    property_nldata += '<li><a target="_blank" href="'+'/listing/'+row.url+'">'+row.title+'</a></li>';    
  });

  $('ul#newlaunch-development-listings').fadeIn(500).append(property_nldata);
  });
</script>
0 votes
responded Jun 29 by LC Marshal Lieutenant (13,870 points)
edited Jul 12 by LC Marshal
//Convert JSON Data to HTML
$(document).ready(function() { 
  $("#getMessage").on("click", function() {
    $.getJSON("/json/cats.json", function(json) {
    var html = "";   
    json.forEach(function(val) {
      var keys = Object.keys(val);
      html += " &amp;lt;div class = 'cat'&amp;gt;";
      key.forEach(function(key) {
        html += "&amp;lt;b&amp;gt;" + key + "&amp;lt;/b&amp;gt;: " + val[key] + ""; 
      });
      html += "&amp;lt;/div&amp;gt;";
    });
    $(".message").html(html);
    });
  });
});
0 votes
responded Jun 29 by LC Marshal Lieutenant (13,870 points)
edited Jul 12 by LC Marshal
//Get JSON with the jQuery getJSON Method
$(document).ready(function() {
  // Only change code below this line.
  $("#getMessage").on("click", function(){
     $.getJSON("/json/cats.json", function(json){
     $(".message").html(JSON.stringify(json));
    });
  });
});
lazacode.org - Malaysia's programming knowledge sharing platform, where everyone can share their finding as reference to others.
...