[jQuery] Accessing objects from JSON result with jQuery

[jQuery] Accessing objects from JSON result with jQuery


Hi,
I'm new jQuery and JSON. I'm trying to use it to populate a dropdown list
through a web service and jQuery. So far I've succeeded in calling the web
service and receiving the list of items in a JSON format. However, now I'm
stuck adding these items to the dropdown list.
my web service returns a list of projects (Items) for a customer:
-----------------------------------------------------------------
http://localhost:3797/Test.asmx/GetProjectsForCustomer
POST /Test.asmx/GetProjectsForCustomer HTTP/1.1
Host: localhost:3797
User-Agent: Mozilla/5.0 (Windows; U; Windows NT 6.0; en-US; rv:1.9.0.4)
Gecko/2008102920 Firefox/3.0.4 (.NET CLR 3.5.30729)
Accept: application/json, text/javascript, */*
Accept-Language: en-us,en;q=0.5
Accept-Encoding: gzip,deflate
Accept-Charset: ISO-8859-1,utf-8;q=0.7,*;q=0.7
Keep-Alive: 300
Connection: keep-alive
Content-Type: application/json; charset=utf-8
X-Requested-With: XMLHttpRequest
Referer: http://localhost:3797/Default.aspx
Content-Length: 19
Pragma: no-cache
Cache-Control: no-cache
{'CustomerId':'39'}
HTTP/1.x 200 OK
Server: ASP.NET Development Server/9.0.0.0
Date: Sat, 06 Dec 2008 18:40:12 GMT
X-AspNet-Version: 2.0.50727
Cache-Control: private, max-age=0
Content-Type: application/json; charset=utf-8
Content-Length: 117
Connection: Close
------------------------------------------------------------
result:
[{"CustomerId":18,"Items":[{"Text":"Sample
Project","Value":6},{"Text":"Tickets","Value":17}]}]
I'm calling the webservice like this:
function LoadProjects(customerId) {
$.ajax({
type: "POST",
contentType: "application/json; charset=utf-8",
url: "Test.asmx/GetProjectsForCustomer",
data: "{'CustomerId':'" + customerId + "'}",
dataType: "json",
success: function(msg) {
$("#ProjectList").fillSelect(msg.d);
}
});
}
and then try to use the result in a function, like done in the following
sample:
http://geekswithblogs.net/michelotti/archive/2008/06/28/mvc-json---jsonresult-and-jquery.aspx
$.fn.fillSelect = function(data) {
return this.clearSelect().each(function() {
if (this.tagName == 'SELECT') {
var dropdownList = this;
$.each(data, function(index, item) {
var option = new Option(item.Text, item.Value); //
<---- this row throws an error
if ($.browser.msie) {
dropdownList.add(option);
}
else {
dropdownList.add(option, null);
}
});
}
});
}
When I run it I receive the error "Text is null or no object"
Through debugging I found out, that data looks like a plain string, content:
[{"CustomerId":18,"Items":[{"Text":"Sample
Project","Value":6},{"Text":"Tickets","Value":17}]}]
Any ideas, what I'm doing wrong? I'm not sure right now whether it's the web
service, or the way I try to access the elements in the result.
So, any help / hints would be greatly appreciated.
Thanks,
Nina
--
View this message in context: http://www.nabble.com/Accessing-objects-from-JSON-result-with-jQuery-tp20873343s27240p20873343.html
Sent from the jQuery General Discussion mailing list archive at Nabble.com.