JSON / AJAX Example

by Madhushanka Rathnayake

HTML

<button onClick="return showIPCountry();">
  Show host name of 8.8.8.8
</button>
<div id="msg" class="msg">
  Host name of 8.8.8.8 will be displayed here
</div>

CSS

.msg {
  padding: 20px;
  margin: 20px 0;
  background-color: #0000ff;
  color: #fff;
  font-family: sans-serif;
}
.error {
  background-color: #ff0000;
}

JavaScript

var j = jQuery;
function showIPCountry() {
  j.ajax( {

      url : 'https://dl.dropboxusercontent.com/s/bc5oupz4yi44xoh/json.json', // url to the php file
      type : 'GET', // method ( get, post )
      data : {
          'dl' : 0 // passing parameters to the php file ( file.php?dl=0 ) ( optional )
      },
      success : function( data ) {              
           var json = JSON.parse( data ); // parsing response to JSON
           j( '#msg' ).html( json.hostname ).addClass( 'error' );
      }
  } );
}