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