Can not view json api data using ajax and javascript for Outlook plugin

%3CLINGO-SUB%20id%3D%22lingo-sub-886477%22%20slang%3D%22en-US%22%3ECan%20not%20view%20json%20api%20data%20using%20ajax%20and%20javascript%20for%20Outlook%20plugin%3C%2FLINGO-SUB%3E%3CLINGO-BODY%20id%3D%22lingo-body-886477%22%20slang%3D%22en-US%22%3E%3CP%3EI%20am%20creating%20an%20%3CSTRONG%3Eoutlook%20plugin%3C%2FSTRONG%3E%20for%20one%20of%20my%20projects%20and%20I%20used%20the%20Visual%20Studio%20%3CSTRONG%3EVB%20Outlook%20Add-In%3C%2FSTRONG%3E%20to%20create%20the%20predefined%20template.%20The%20HTML%20file%20works%20well%20but%20the%20script%20in%20HTML%20file%20has%20issue%20processing%20the%3CSTRONG%3E%20ajax%20success()%20function%3C%2FSTRONG%3E.%20The%20office%20libraries%20do%20not%20let%20the%20native%20java%20script%20functions%20run%20(like%3CSTRONG%3E%20alert%20statements%3C%2FSTRONG%3E).%20The%20data%20from%20API%20can%20be%20viewed%20in%20console%20but%20cannot%20be%20caught%20using%20a%20%3CSTRONG%3EDIV%20or%20JSON(stringify)%20methods.%3C%2FSTRONG%3E%3C%2FP%3E%3CP%3EHere%20is%20HTML%20Code%3A%3C%2FP%3E%3CP%3E%3C%2FP%3E%3CFORM%20id%3D%22%26quot%3Bloginform%26quot%3B%22%20class%3D%22%26quot%3Bloginform%26quot%3B%22%3E%3CBR%20%2F%3E%3CDIV%3E%3CBR%20%2F%3E%3CINPUT%20type%3D%22%26quot%3Btext%26quot%3B%22%20id%3D%22%26quot%3Bserver%26quot%3B%22%20placeholder%3D%22%26quot%3BSERVER%26quot%3B%22%20required%3D%22%22%20%2F%3E%3CBR%20%2F%3E%3C%2FDIV%3E%3CBR%20%2F%3E%3C!--%3Cdiv%3E%3CBR%20%2F%3E%3Cinput%20type%3D%26quot%3Btext%26quot%3B%20id%3D%26quot%3Busername%26quot%3B%20placeholder%3D%26quot%3BUSERNAME%26quot%3B%20required%20%2F%3E%3CBR%20%2F%3E%3C%2Fdiv%3E%3CBR%20%2F%3E%3Cdiv%3E%3CBR%20%2F%3E%3Cinput%20type%3D%26quot%3Bpassword%26quot%3B%20id%3D%26quot%3Bpassword%26quot%3B%20placeholder%3D%26quot%3BPASSWORD%26quot%3B%20required%20%2F%3E%3CBR%20%2F%3E%3C%2Fdiv%3E--%3E%3CBR%20%2F%3E%3CBUTTON%20type%3D%22%26quot%3Bsubmit%26quot%3B%22%20id%3D%22%26quot%3BbtnLogin%26quot%3B%22%20onclick%3D%22%26quot%3Breturn%22%20getlogin%3D%22%22%3E%3CBR%20%2F%3ELOGIN%3CBR%20%2F%3E%3C%2FBUTTON%3E%3CBR%20%2F%3E%3C%2FFORM%3E%3CP%3E%3C%2FP%3E%3CP%3E%3C%2FP%3E%3CDIV%3E%3CBR%20%2F%3E%3CP%20class%3D%22%26quot%3Bapidata%26quot%3B%22%3E%20The%20API%20Data%20is%20%3A%20%3CBR%20%2F%3E%20%3C%2FP%3E%3CBR%20%2F%3E%3C%2FDIV%3E%3CBR%20%2F%3EHere%20is%20the%20script%20which%20is%20in%20the%20same%20HTML%20File%3CP%3E%3C%2FP%3E%3CP%3E%3CSCRIPT%20type%3D%22%26quot%3Btext%2Fjavascript%26quot%3B%22%3E%26amp%3Bamp%3Bamp%3Bamp%3Blt%3BBR%20%2F%26amp%3Bamp%3Bamp%3Bamp%3Bgt%3Bfunction%20getLogin()%20%7B%26amp%3Bamp%3Bamp%3Bamp%3Blt%3B%2FP%26amp%3Bamp%3Bamp%3Bamp%3Bgt%3B%26amp%3Bamp%3Bamp%3Bamp%3Blt%3BP%26amp%3Bamp%3Bamp%3Bamp%3Bgt%3Bvar%20server%20%3D%20document.getElementById(%26amp%3Bamp%3Bamp%3Bamp%3Bamp%3Bquot%3Bserver%26amp%3Bamp%3Bamp%3Bamp%3Bamp%3Bquot%3B).value%3B%26amp%3Bamp%3Bamp%3Bamp%3Blt%3BBR%20%2F%26amp%3Bamp%3Bamp%3Bamp%3Bgt%3Bvar%20usableURL%20%3D%20%26amp%3Bamp%3Bamp%3Bamp%3Bamp%3Bquot%3B%26amp%3Bamp%3Bamp%3Bamp%3Blt%3BA%20href%3D%22https%3A%2F%2Fcustomer.xyz.com%2Fbiolink%2F%22%20target%3D%22_blank%22%20rel%3D%22noopener%20nofollow%20noopener%20noreferrer%22%26amp%3Bamp%3Bamp%3Bamp%3Bgt%3Bhttps%3A%2F%2Fcustomer.xyz.com%2Fbiolink%2F%26amp%3Bamp%3Bamp%3Bamp%3Blt%3B%2FA%26amp%3Bamp%3Bamp%3Bamp%3Bgt%3B%26amp%3Bamp%3Bamp%3Bamp%3Bamp%3Bquot%3B%20%2B%20server%20%2B%20%26amp%3Bamp%3Bamp%3Bamp%3Bamp%3Bquot%3B%2Frest%2Fv1%2Falarms%26amp%3Bamp%3Bamp%3Bamp%3Bamp%3Bquot%3B%3B%26amp%3Bamp%3Bamp%3Bamp%3Blt%3BBR%20%2F%26amp%3Bamp%3Bamp%3Bamp%3Bgt%3B%24.ajax%26amp%3Bamp%3Bamp%3Bamp%3Blt%3BBR%20%2F%26amp%3Bamp%3Bamp%3Bamp%3Bgt%3B(%7B%26amp%3Bamp%3Bamp%3Bamp%3Blt%3BBR%20%2F%26amp%3Bamp%3Bamp%3Bamp%3Bgt%3Burl%3A%20usableURL%2C%26amp%3Bamp%3Bamp%3Bamp%3Blt%3BBR%20%2F%26amp%3Bamp%3Bamp%3Bamp%3Bgt%3Btype%3A%20%26amp%3Bamp%3Bamp%3Bamp%3Bamp%3Bquot%3BGET%26amp%3Bamp%3Bamp%3Bamp%3Bamp%3Bquot%3B%2C%26amp%3Bamp%3Bamp%3Bamp%3Blt%3BBR%20%2F%26amp%3Bamp%3Bamp%3Bamp%3Bgt%3Bcors%3A%20true%2C%26amp%3Bamp%3Bamp%3Bamp%3Blt%3BBR%20%2F%26amp%3Bamp%3Bamp%3Bamp%3Bgt%3BdataType%3A%20%26amp%3Bamp%3Bamp%3Bamp%3Bamp%3B%2339%3Bjsonp%26amp%3Bamp%3Bamp%3Bamp%3Bamp%3B%2339%3B%2C%26amp%3Bamp%3Bamp%3Bamp%3Blt%3BBR%20%2F%26amp%3Bamp%3Bamp%3Bamp%3Bgt%3Bjsonp%3A%20false%2C%26amp%3Bamp%3Bamp%3Bamp%3Blt%3BBR%20%2F%26amp%3Bamp%3Bamp%3Bamp%3Bgt%3BjsonpCallback%3A%20%26amp%3Bamp%3Bamp%3Bamp%3Bamp%3B%2339%3Bcallback%26amp%3Bamp%3Bamp%3Bamp%3Bamp%3B%2339%3B%2C%26amp%3Bamp%3Bamp%3Bamp%3Blt%3BBR%20%2F%26amp%3Bamp%3Bamp%3Bamp%3Bgt%3BcrossDomain%3A%20true%2C%26amp%3Bamp%3Bamp%3Bamp%3Blt%3BBR%20%2F%26amp%3Bamp%3Bamp%3Bamp%3Bgt%3BcontentType%3A%20%26amp%3Bamp%3Bamp%3Bamp%3Bamp%3B%2339%3Bapplication%2Fjson%3B%20charset%3Dutf-8%3B%26amp%3Bamp%3Bamp%3Bamp%3Bamp%3B%2339%3B%2C%26amp%3Bamp%3Bamp%3Bamp%3Blt%3BBR%20%2F%26amp%3Bamp%3Bamp%3Bamp%3Bgt%3Bsecure%3A%20false%2C%26amp%3Bamp%3Bamp%3Bamp%3Blt%3BBR%20%2F%26amp%3Bamp%3Bamp%3Bamp%3Bgt%3Bcache%3A%20false%2C%26amp%3Bamp%3Bamp%3Bamp%3Blt%3BBR%20%2F%26amp%3Bamp%3Bamp%3Bamp%3Bgt%3Bheaders%3A%20%7B%26amp%3Bamp%3Bamp%3Bamp%3Blt%3BBR%20%2F%26amp%3Bamp%3Bamp%3Bamp%3Bgt%3B%2F%2Fheaders%20here%26amp%3Bamp%3Bamp%3Bamp%3Blt%3BBR%20%2F%26amp%3Bamp%3Bamp%3Bamp%3Bgt%3B%7D%2C%26amp%3Bamp%3Bamp%3Bamp%3Blt%3BBR%20%2F%26amp%3Bamp%3Bamp%3Bamp%3Bgt%3Bdata%3A%20%7B%26amp%3Bamp%3Bamp%3Bamp%3Blt%3BBR%20%2F%26amp%3Bamp%3Bamp%3Bamp%3Bgt%3B%26amp%3Bamp%3Bamp%3Bamp%3Bamp%3Bquot%3Bsdate%26amp%3Bamp%3Bamp%3Bamp%3Bamp%3Bquot%3B%3A%20%26amp%3Bamp%3Bamp%3Bamp%3Bamp%3Bquot%3B2019-05-01T00%3A00%3A00%26amp%3Bamp%3Bamp%3Bamp%3Bamp%3Bquot%3B%2C%26amp%3Bamp%3Bamp%3Bamp%3Blt%3BBR%20%2F%26amp%3Bamp%3Bamp%3Bamp%3Bgt%3B%26amp%3Bamp%3Bamp%3Bamp%3Bamp%3Bquot%3Back%26amp%3Bamp%3Bamp%3Bamp%3Bamp%3Bquot%3B%3A%20%26amp%3Bamp%3Bamp%3Bamp%3Bamp%3Bquot%3Bfalse%26amp%3Bamp%3Bamp%3Bamp%3Bamp%3Bquot%3B%2C%26amp%3Bamp%3Bamp%3Bamp%3Blt%3BBR%20%2F%26amp%3Bamp%3Bamp%3Bamp%3Bgt%3Bformat%3A%20%26amp%3Bamp%3Bamp%3Bamp%3Bamp%3Bquot%3Bjson%26amp%3Bamp%3Bamp%3Bamp%3Bamp%3Bquot%3B%26amp%3Bamp%3Bamp%3Bamp%3Blt%3BBR%20%2F%26amp%3Bamp%3Bamp%3Bamp%3Bgt%3B%7D%2C%26amp%3Bamp%3Bamp%3Bamp%3Blt%3BBR%20%2F%26amp%3Bamp%3Bamp%3Bamp%3Bgt%3Bsuccess%3A%20function%20(response)%20%7B%26amp%3Bamp%3Bamp%3Bamp%3Blt%3BBR%20%2F%26amp%3Bamp%3Bamp%3Bamp%3Bgt%3Bconsole.log(response)%3B%26amp%3Bamp%3Bamp%3Bamp%3Blt%3BBR%20%2F%26amp%3Bamp%3Bamp%3Bamp%3Bgt%3Balert(response)%3B%26amp%3Bamp%3Bamp%3Bamp%3Blt%3BBR%20%2F%26amp%3Bamp%3Bamp%3Bamp%3Bgt%3B%24(%26amp%3Bamp%3Bamp%3Bamp%3Bamp%3B%2339%3B%23apidata%26amp%3Bamp%3Bamp%3Bamp%3Bamp%3B%2339%3B).html(JSON.stringify(response))%3B%26amp%3Bamp%3Bamp%3Bamp%3Blt%3BBR%20%2F%26amp%3Bamp%3Bamp%3Bamp%3Bgt%3B%2F%2Fvar%20s%20%3D%20%24.parseJSON(response.responseText)%3B%26amp%3Bamp%3Bamp%3Bamp%3Blt%3BBR%20%2F%26amp%3Bamp%3Bamp%3Bamp%3Bgt%3Bdocument.getElementById(%26amp%3Bamp%3Bamp%3Bamp%3Bamp%3Bquot%3Bapidata%26amp%3Bamp%3Bamp%3Bamp%3Bamp%3Bquot%3B).innerHTML%20%3D%20JSON.stringify(response.responseText)%3B%26amp%3Bamp%3Bamp%3Bamp%3Blt%3B%2FP%26amp%3Bamp%3Bamp%3Bamp%3Bgt%3B%26amp%3Bamp%3Bamp%3Bamp%3Blt%3BP%26amp%3Bamp%3Bamp%3Bamp%3Bgt%3B%7D%2C%26amp%3Bamp%3Bamp%3Bamp%3Blt%3BBR%20%2F%26amp%3Bamp%3Bamp%3Bamp%3Bgt%3Berror%3A%20function%20(error)%20%7B%26amp%3Bamp%3Bamp%3Bamp%3Blt%3BBR%20%2F%26amp%3Bamp%3Bamp%3Bamp%3Bgt%3Bconsole.log(error)%3B%26amp%3Bamp%3Bamp%3Bamp%3Blt%3BBR%20%2F%26amp%3Bamp%3Bamp%3Bamp%3Bgt%3B%7D%26amp%3Bamp%3Bamp%3Bamp%3Blt%3BBR%20%2F%26amp%3Bamp%3Bamp%3Bamp%3Bgt%3B%7D)%26amp%3Bamp%3Bamp%3Bamp%3Blt%3BBR%20%2F%26amp%3Bamp%3Bamp%3Bamp%3Bgt%3Breturn%20false%3B%26amp%3Bamp%3Bamp%3Bamp%3Blt%3BBR%20%2F%26amp%3Bamp%3Bamp%3Bamp%3Bgt%3B%7D%26amp%3Bamp%3Bamp%3Bamp%3Blt%3B%2FP%26amp%3Bamp%3Bamp%3Bamp%3Bgt%3B%26amp%3Bamp%3Bamp%3Bamp%3Blt%3BP%26amp%3Bamp%3Bamp%3Bamp%3Bgt%3BI%20can%20not%20get%20the%20data%20into%20DIV%20here%20and%20my%20data%20type%20has%20to%20be%20%26amp%3Bamp%3Bamp%3Bamp%3Blt%3BSTRONG%26amp%3Bamp%3Bamp%3Bamp%3Bgt%3Bjsonp%26amp%3Bamp%3Bamp%3Bamp%3Blt%3B%2FSTRONG%26amp%3Bamp%3Bamp%3Bamp%3Bgt%3B%20because%20the%20rest%20api%20i%20am%20trying%20has%20%26amp%3Bamp%3Bamp%3Bamp%3Blt%3BSTRONG%26amp%3Bamp%3Bamp%3Bamp%3Bgt%3BCORS%20enabled%26amp%3Bamp%3Bamp%3Bamp%3Blt%3B%2FSTRONG%26amp%3Bamp%3Bamp%3Bamp%3Bgt%3B%26amp%3Bamp%3Bamp%3Bamp%3Blt%3B%2FP%26amp%3Bamp%3Bamp%3Bamp%3Bgt%3B%26amp%3Bamp%3Bamp%3Bamp%3Blt%3BP%26amp%3Bamp%3Bamp%3Bamp%3Bgt%3BAny%20way%20to%20solve%20this%20view%20issue%3F%26amp%3Bamp%3Bamp%3Bamp%3Blt%3B%2FP%26amp%3Bamp%3Bamp%3Bamp%3Bgt%3B%26amp%3Bamp%3Bamp%3Bamp%3Blt%3B%2Flingo-body%26amp%3Bamp%3Bamp%3Bamp%3Bgt%3B%26amp%3Bamp%3Bamp%3Bamp%3Blt%3Blingo-labs%20id%3D%22lingo-labs-886477%22%20slang%3D%22en-US%22%26amp%3Bamp%3Bamp%3Bamp%3Bgt%3B%26amp%3Bamp%3Bamp%3Bamp%3Blt%3Blingo-label%26amp%3Bamp%3Bamp%3Bamp%3Bgt%3Bajax%26amp%3Bamp%3Bamp%3Bamp%3Blt%3B%2Flingo-label%26amp%3Bamp%3Bamp%3Bamp%3Bgt%3B%26amp%3Bamp%3Bamp%3Bamp%3Blt%3Blingo-label%26amp%3Bamp%3Bamp%3Bamp%3Bgt%3BJavaScript%26amp%3Bamp%3Bamp%3Bamp%3Blt%3B%2Flingo-label%26amp%3Bamp%3Bamp%3Bamp%3Bgt%3B%26amp%3Bamp%3Bamp%3Bamp%3Blt%3Blingo-label%26amp%3Bamp%3Bamp%3Bamp%3Bgt%3BOffice%20365%26amp%3Bamp%3Bamp%3Bamp%3Blt%3B%2Flingo-label%26amp%3Bamp%3Bamp%3Bamp%3Bgt%3B%26amp%3Bamp%3Bamp%3Bamp%3Blt%3Blingo-label%26amp%3Bamp%3Bamp%3Bamp%3Bgt%3BOutlook%26amp%3Bamp%3Bamp%3Bamp%3Blt%3B%2Flingo-label%26amp%3Bamp%3Bamp%3Bamp%3Bgt%3B%26amp%3Bamp%3Bamp%3Bamp%3Blt%3B%2Flingo-labs%26amp%3Bamp%3Bamp%3Bamp%3Bgt%3B%3C%2FSCRIPT%3E%3C%2FP%3E%3C%2FLINGO-BODY%3E
Highlighted
Visitor

I am creating an outlook plugin for one of my projects and I used the Visual Studio VB Outlook Add-In to create the predefined template. The HTML file works well but the script in HTML file has issue processing the ajax success() function. The office libraries do not let the native java script functions run (like alert statements). The data from API can be viewed in console but cannot be caught using a DIV or JSON(stringify) methods.

Here is HTML Code:

<form id="loginform" class="loginform">
<div>
<input type="text" id="server" placeholder="SERVER" required />
</div>
<!--<div>
<input type="text" id="username" placeholder="USERNAME" required />
</div>
<div>
<input type="password" id="password" placeholder="PASSWORD" required />
</div>-->
<button type="submit" id="btnLogin" onclick="return getLogin();">
LOGIN
</button>
</form>

<div>
<p class="apidata"> The API Data is : <br /> </p>
</div>
Here is the script which is in the same HTML File

<script type="text/javascript">
function getLogin() {

var server = document.getElementById("server").value;
var usableURL = "https://customer.xyz.com/biolink/" + server + "/rest/v1/alarms";
$.ajax
({
url: usableURL,
type: "GET",
cors: true,
dataType: 'jsonp',
jsonp: false,
jsonpCallback: 'callback',
crossDomain: true,
contentType: 'application/json; charset=utf-8;',
secure: false,
cache: false,
headers: {
//headers here
},
data: {
"sdate": "2019-05-01T00:00:00",
"ack": "false",
format: "json"
},
success: function (response) {
console.log(response);
alert(response);
$('#apidata').html(JSON.stringify(response));
//var s = $.parseJSON(response.responseText);
document.getElementById("apidata").innerHTML = JSON.stringify(response.responseText);

},
error: function (error) {
console.log(error);
}
})
return false;
}

I can not get the data into DIV here and my data type has to be jsonp because the rest api i am trying has CORS enabled

Any way to solve this view issue?

0 Replies