Solved

Ajax, Jquery, YQL trying to call .net webservice

Posted on 2010-08-25
15
801 Views
Last Modified: 2013-11-08
Hi,

Ultimately I would like to populate a drop down list with data returned from a webservice call.

I initially tried to use jquery to call a webservice (http://www.guidelineweb.co.uk/ajax.html) but could get nothing back, it was suggested that this was due to cross-domain issues, the webservice exists on http://uat.msmsoftware.com

It was suggested that yql could be used so i created a test (http://www.guidelineweb.co.uk/csajax4.html) and the HelloWorld works, however the GetSites method returns an array of Site objects but it appears that the yql just returns a string of all the site objects. I also tried substituting the dataType: "json" with dataType: "jsonp" as i'd read in another post without any sucess, unless i needed to do something else to support that change ?

Now i'm really stuck ! and i'm also pretty in experienced with these libraries, can anyone give me some pointers please ?

thanks
0
Comment
Question by:stevejebson
  • 10
  • 5
15 Comments
 
LVL 82

Expert Comment

by:leakim971
ID: 33520275
Check csajax4.js :

the format is xml :

$.getJSON("http://query.yahooapis.com/v1/public/yql?"+"q=select%20*%20from%20html%20where%20url%3D%22"+encodeURIComponent(url)+"%22&format=xml'&callback=?",

if you want a json object back, set it to json

$.getJSON("http://query.yahooapis.com/v1/public/yql?"+"q=select%20*%20from%20html%20where%20url%3D%22"+encodeURIComponent(url)+"%22&format=json'&callback=?",
0
 
LVL 1

Author Comment

by:stevejebson
ID: 33520318
but when i debug in ff and look at the data.results it is and array of 1 that contains all the data in the following format <body><p> ... all data ...</p></body> and that's the same if i have format=xml or format=json
0
 
LVL 82

Expert Comment

by:leakim971
ID: 33520601
0
 
LVL 82

Expert Comment

by:leakim971
ID: 33520785
remove the simple quote after json and before &callback:


$.getJSON("http://query.yahooapis.com/v1/public/yql?"+"q=select%20*%20from%20html%20where%20url%3D%22"+encodeURIComponent(url)+"%22&format=json'&callback=?",
0
 
LVL 82

Expert Comment

by:leakim971
ID: 33520952
I get sometthing with :


function doAjax(url,container){
    // if the URL starts with http
    if(url.match('^http')){
      // assemble the YQL call
      $.getJSON("http://query.yahooapis.com/v1/public/yql?"+"q=select%20*%20from%20html%20where%20url%3D%22"+encodeURIComponent(url)+"%22&format=json&callback=?",
        function(data){
          if(data.query.results.body){
//            var data = filterData(data.query.results.body.p);
            container.html(data.query.results.body.p);

Open in new window

0
 
LVL 82

Expert Comment

by:leakim971
ID: 33520981
If you want to do it with the dynamic script method, check this link : http://james.padolsey.com/javascript/using-yql-with-jsonp/
0
 
LVL 82

Expert Comment

by:leakim971
ID: 33521224
Check this :

with dynamic script, you don't worry about the cross domain limitation

check the parameter callback at the end of the script source : &callback=success
When the data is available (or an error is throw), the success function is called with the message/data
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<script language="javascript">
	function init() {
		var url = "http://uat.msmsoftware.com/GemsMobileReporting/MobileReportingService.asmx/GetSites?userid=141&contractid=97&restrictbyuser=false"
		var query = encodeURIComponent("select * from html where url='" + url + "'");
		var script = document.createElement("script");
		script.setAttribute("language","javascript");
		script.setAttribute("src", "http://query.yahooapis.com/v1/public/yql?q=" + query + "&format=json&callback=success");
		document.body.appendChild(script);
	}
	function success(data) {
		if(data.error) {
			alert(data.error.description);
		}
		else {
			//alert("count of query : " + data.query.count);
			document.getElementById("mydiv").innerHTML = data.query.results.body.p;
		}
	}
</script>
</head>
<body onload="init();"> 
<div id="mydiv"></div>
</body>
</html>

Open in new window

0
What Security Threats Are You Missing?

Enhance your security with threat intelligence from the web. Get trending threat insights on hackers, exploits, and suspicious IP addresses delivered to your inbox with our free Cyber Daily.

 
LVL 1

Author Comment

by:stevejebson
ID: 33521784
hi leakim971,
i'm not sure i've made my point very well, it's not that i'm not getting anything back via yql, it's that it comes back as a single object whereas what the webservice is serving is an array of Sites so i was kinda expecting an array when it returns ? It may be that i'm just not getting this but does it make sense what i think i should be getting ?

Steve
0
 
LVL 82

Expert Comment

by:leakim971
ID: 33521887
Oups...

>the webservice exists on http://uat.msmsoftware.com

When I go on this page I get : You are connected to the DEFAULT Website on DEV1
Do you have a description or a main page describing the webservice ?

0
 
LVL 1

Author Comment

by:stevejebson
ID: 33521902
0
 
LVL 1

Author Comment

by:stevejebson
ID: 33521932
and for the GetSites method enter userid: 141 contractid: 97 restrictbyuser: false
0
 
LVL 82

Expert Comment

by:leakim971
ID: 33523278
just replace html by xml...

0
 
LVL 82

Accepted Solution

by:
leakim971 earned 500 total points
ID: 33523459
Using : var query = encodeURIComponent("select * from xml where url='" + url + "'");
We get back the xml file (xml or json format)

test page :


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<script language="javascript">
	function init() {
		var url = "http://uat.msmsoftware.com/GemsMobileReporting/MobileReportingService.asmx/GetSites?userid=141&contractid=97&restrictbyuser=false"
		var query = encodeURIComponent("select * from xml where url='" + url + "'");
		var script = document.createElement("script");
		script.setAttribute("language","javascript");
		script.setAttribute("src", "http://query.yahooapis.com/v1/public/yql?q=" + query + "&format=json&callback=success");
		document.body.appendChild(script);
	}
	function success(data) {
		if(data.error) {
			alert(data.error.description);
		}
		else {
			var ms = data.query.results.ArrayOfMobileSite.MobileSite;
			var table = document.createElement("table");
			table.setAttribute("border","1");
			for(var i=0;i<ms.length;i++) {
				var row = document.createElement("tr");
				for(var j in ms[i]) {
					var cell = document.createElement("td");
					cell.innerHTML = ms[i][j];
					row.appendChild(cell);
				}
				table.appendChild(row);
			}
			document.getElementById("mydiv").appendChild(table);
		}
	}
</script>
</head>
<body onload="init();"> 
<div id="mydiv"></div>
</body>
</html>

Open in new window

0
 
LVL 1

Author Closing Comment

by:stevejebson
ID: 33529322
You're an absolute star !!
So all in all it was just that i was asking for html in the select that should have been xml as in that is what was being delivered. Obvious now, that's programming !   ;-)
0
 
LVL 82

Expert Comment

by:leakim971
ID: 33530181
Thanks a lot for the points! Have a nice day!
0

Featured Post

Highfive Gives IT Their Time Back

Highfive is so simple that setting up every meeting room takes just minutes and every employee will be able to start or join a call from any room with ease. Never be called into a meeting just to get it started again. This is how video conferencing should work!

Join & Write a Comment

International Data Corporation (IDC) prognosticates that before the current the year gets over disbursing on IT framework products to be sent in cloud environs will be $37.1B.
Nothing in an HTTP request can be trusted, including HTTP headers and form data.  A form token is a tool that can be used to guard against request forgeries (CSRF).  This article shows an improved approach to form tokens, making it more difficult to…
The viewer will learn how to dynamically set the form action using jQuery.
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)

744 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

13 Experts available now in Live!

Get 1:1 Help Now