0

Please find the below code. while debugging the code using Chrome java script debugger, URL is hit and Debugger is displaying the correct json data from the URL [Under the source column] but there is no response in the browser after button click. I want to display the json data after button click. Can you please help in this ?

<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script type="text/javascript">
function test() {
 var key="encryptedAPIkeyvalue";

    $.ajax({  
        url: "http://localhost:82/JSON/Lookups/ComponentTypes?apiKey=" + key + "&callback=" ,  
        dataType: "jsonp",  
        success: function(data){ 
             $.each( data , function( i, item ) {
             alert(item);
                $("#output").append(item);
            });
        } 
    });  
}
</script>
</head>
<body>
<form id="form1" runat="server">
<div id="output"></div>
<button id="tbn" onclick="Javascript:test();return false;">click</button>
</form>
</body>
</html>
seema
  • 31
  • 4
  • Do you get any errors? do you see see the alert? – EhsanT Mar 26 '15 at 22:18
  • no, there are no errors in the browser and no alert is seen. But in debug mode it hits the url and pointing the contents of URL – seema Mar 27 '15 at 17:25
  • So what is the format of the data returning to your ajax? can you use a `console.log(data)` before `$.each` line to see what is returned? – EhsanT Mar 27 '15 at 17:54
  • i just saw message under debugger console,it displays GET http://localhost:82/JSON/Lookups/ComponentTypes?apiKey=apikey&callback= 401 (Unauthorized) error. Can you please help me how to resolve this authentication issue ? – seema Mar 27 '15 at 19:05
  • where is your current running file located? is it also on the same address http://localhost:82/ ? it seems that you have some kind of authentication on the address your ajax request is looking for(http://localhost:82/JSON/Lookups/ComponentTypes) – EhsanT Mar 27 '15 at 20:08
  • API URL is not in the localhost, it is located in corporate network, just for confidential purpose i used localhost here. I have modified the code which includes authentication now. In the Console.log there are no authentication error after using the below code. – seema Mar 28 '15 at 16:32
  • `code` function test() { var key="apikeyvalue"; var username="myusername"; var password="mypass"; $.ajax({ type: "GET", url: "http://:82/JSON/Lookups/ComponentTypes?apiKey=" + key , dataType: "jsonp", crossDomain: true, headers: { "Authorization": "Basic " + btoa(username + ":" + password) }, success: function(data){ console.log(data); } }) .done(function(data) { alert(data[0].value) } ) .fail(function() { alert("failed") } ); } – seema Mar 28 '15 at 16:40
  • using the Above code, there is no reponse from ajax, no output in the browser.I;m getting alert for fail fun(). But in the chrome debugger while running line by line code it hits the url and contents of the url is seen under network tab in chrome debugger. Headers shows status Code:200 OK and Preview displays the content of the url. – seema Mar 28 '15 at 16:45
  • I think the reason is that the data you are returning is not compatible with the datatype you have specified. you can check [this post](http://stackoverflow.com/questions/6186770/ajax-request-return-200-ok-but-error-event-is-fired-instead-of-success) for your reference. – EhsanT Mar 29 '15 at 09:00

0 Answers0