JSONP Example

Here below several different modes are listed to call "EmailsRead" method using JSONP, you can choose the one that best fits your needs. All cases require the use definition of a callback function.

The code examples below are provided on an "as is" basis, without any warranty of any kind. MailUp shall not be held liable for any direct, indirect or consequential damages or costs of any type arising out of any action taken by you or other related to the example code.

EmailsRead (request)

<html>
	<head>
		<title></title>
		<!-- Use jQuery library (and also jquery.jsonp if you choose option#1 -->
		<script type="text/javascript" src="js/jquery.min.js"></script>
		<script type="text/javascript" src="js/jquery.jsonp-2.3.1.js"></script>
				
		<script type="text/javascript">
			var wcfServiceUrl = "https://services.mailup.com/1.1/MailUpService.svc/jsonp"
			
			var method = "/EmailsRead" //method name
			
			<!-- fake tokens are here hardwired only to provide a fast example, please note that you cannot retrieve access token using JSONP-enabled methods --> 
			var token = "MjgWW1YBsBuqRCoAjGXK0Ov/9yJh7sClj9SSweAhcGgEqTw8tP6vyYVDE+acjiUG3nBSPtBXs0lTGNDp";
			var tokenEncoded = "MjgWW1YBsBuqRCoAjGXK0Ov%2f9yJh7sClj9SSweAhcGgEqTw8tP6vyYVDE%2bacjiUG3nBSP";
			var idList = "1";
			
			<!-- Option#1: a proper error handling is here implemented, token has to be encoded -->
			function processWithJsonpCallback() {
				$.jsonp({
					"url": wcfServiceUrl + method + "?token=" + tokenEncoded + "&idlist=" + idList,
					callback: "myServiceResponse",
					callbackParameter: "callback",
					"success": function(result) {
						processData(result);
					},
					"error": function(d,msg) {
						alert(msg);
					}
				});
			}
			
			<!-- Option#2: token has not to be encoded, only basic error handling is implemented -->
			function processWithAjaxJquery() {
				$.ajax({
					type: "GET",
					url: wcfServiceUrl + method,
					data: { token: tokenEncoded, idlist: idList, format: "json"},
					contentType: "application/json; charset=uft-8",
					dataType: "jsonp",
					jsonpCallback: "processData",
					statusCode: { 400: $("#error").append("Bad Request (400). Request cannot be completed.") },
					error: function(XHR, textStatus, errorThrown){
						alert(XHR.status);
					},
					success: processData
				});
			}
			
			<!-- Option#3: a proper error handling is here implemented, token has to be enconded -->
			function processWithGetJson() {
				$.getJSON(wcfServiceUrl + method + "?callback=?&token=" + tokenEncoded + "&idlist=" + idList + "&format=json'", null, function (results) {
					processData(results);
				});
			}
			
			<!-- Option#4: use this solution if you want to call method on page load, token has to be enconded -->
			function jsonpCall(url) {                 
				var script = document.createElement("script");        
				script.setAttribute("src",url);
				script.setAttribute("type","text/javascript");                
				document.body.appendChild(script);
			}
			
			<!-- Callback function (mandatory) -->
			function processData(data, textStatus, jqXHR) {
				var $responseList = $('#responseList');
				$responseList.empty();
				$.each(data, function () {
					$responseList.appendLi(this.Id + " - " + this.Subject); 
				});
			}
			
			(function($) {
				$.fn.appendLi = function(text) {
					return $(this).each(function() {
						$(this).append($('<li />').text(text));
					});
				};
			})(jQuery);
		</script>
	</head>
	<body>
		<!-- Remove comment below if you choose option#4 -->
		<!--
		<script type="text/javascript" defer="true">jsonpCall(wcfServiceUrl + method + "?callback=processData&token=" + tokenEncoded + "&idlist=" + idList);</script>
		-->
		
		<input type="button" id="btnJsonpCallBack" onclick="processWithJsonpCallback()" value="Test WebService With Jsonp Library" />
		<br />
		<input type="button" id="btnCallWSJQAjax" onclick="processWithAjaxJquery()" value="Test WebService With Ajax Jquery" />
		<br />
		<input type="button" id="btnCallWSJQGeJson" onclick="processWithGetJson()" value="Test WebService With getJson" />
		<br />
		<ul id="responseList">
        </ul>
		<br />
		<span id="error" style="color:#bf0000;font-weight:bold;"></span>
	</body>
</html>

Response invokes callback function passing a JSON object as parameter

EmailsRead (response)

processData([{"Id":2,"IdList":1,"Subject":"Newsletter di Prova - LEGGIMI -"},{"Id":3,"IdList":1,"Subject":"Richiesta non ancora confermata"},{"Id":4,"IdList":1,"Subject":"Newsletter di Prova - LEGGIMI -(Copia)"},{"Id":6,"IdList":1,"Subject":"Newsletter Esempio per vedere i grafici"},{"Id":7,"IdList":1,"Subject":"Prova Invio Da WS"},{"Id":8,"IdList":1,"Subject":"Oggetto: [nome]"},{"Id":9,"IdList":1,"Subject":"Distinto [nome] [cognome]"},{"Id":10,"IdList":1,"Subject":"Prova creato da WS Fast"},{"Id":12,"IdList":1,"Subject":"test"},{"Id":14,"IdList":1,"Subject":"Prova creato da WS Fast"},{"Id":15,"IdList":1,"Subject":"Prova creato da WS Fast"},{"Id":16,"IdList":1,"Subject":"Test"},{"Id":17,"IdList":1,"Subject":"invio di prova"},{"Id":18,"IdList":1,"Subject":"Iscrizione da confermare!"},{"Id":19,"IdList":1,"Subject":"Iscrizione da confermare!"},{"Id":20,"IdList":1,"Subject":"Iscrizione da confermare!"},{"Id":21,"IdList":1,"Subject":"Iscrizione da confermare!"},{"Id":22,"IdList":1,"Subject":"Iscrizione da confermare!"},{"Id":23,"IdList":1,"Subject":"Iscrizione da confermare!"},{"Id":24,"IdList":1,"Subject":"Iscrizione da confermare!"},{"Id":25,"IdList":1,"Subject":"Iscrizione da confermare!"},{"Id":26,"IdList":1,"Subject":"Iscrizione da confermare!"}]);