Get Geoplugin JSON Web Service Data in SharePoint Page using Content Editor Web Part


Get Geoplugin JSON Web Service Data in SharePoint Page using Content Editor Web Part

Step 1: Kindly follow my intital post to understand how java script can be used in Content Editor Web Part.

Step 2: GeoPlugin is a readily available JSON Web Service. Refer here to understand more about it.

Step 3: In a Web Part Page, Edit Page and Add Content Editor Web Part.

Step 4: Write the following code in a text. save as html. upload into SharePoint.Link this html page to content editor web part or Write code in Web Part's text editor directly.


<HEAD>
<TITLE>GetData JSON web service - Geoplugin</TITLE>

<script type="text/javascript" src="http://myserver.com/myData /MyScripts/jquery-1.3.2.min.js"></script>
<SCRIPT type=text/javascript>
      
    var JsonData = "http://www.geoplugin.net/json.gp?ip=66.249.75.200&jsoncallback=?";
    $(document).ready(function()
    {
           var url = JsonData;                          
           $.ajax({
                     type: 'GET',
                     url: JsonData,
                     async: false,                                     
                     data: { get_param: 'value' },                                       
                     dataType: 'json',
                      success: function(data)
                      {                                                                           
                              for (var i in data)
                              {     $("#divId1").append("<li> " +   i + "------" + data[i] +  "</li>");     }
                      },
                      error: function(e)
                      {
                             alert(e.message);
                      }
           });                          
 });         

</SCRIPT>
</head> 
<BODY>      <div id="divId1"/>    </div>   </BODY>
</HTML>

Step 6: To remove the identity that the code was generated from Content Editor Web Part, within the Web Part Setting, Under Appearance, For Chrome Type select "None". Click OK. Click Apply. Publish the Page.


Step 8: Now you can see the data extracted from GeoPlugin in a Content Editor Web Part.

Step 9: Refer this post to see how data from JSON can be inserted into SharePoint list using content editor web part.

Leave your comments below.

1 comment:

Anonymous said...

Thank you for the post , this was very helpful.

Saadhika