Michael Bell’s Blog

I’ve got a WCF service that I was trying to return multiple data sets in the same call. You can read about that in the previous post. What I tried today for the first time, was to return objects along with other objects that shared a relationship. What I found was that you get circular reference issues when you try to do this. After about a day of googling, I found that you can use the JSON.net library to get around that issue. The example code follows:

[WebInvoke(Method = "POST",
 BodyStyle = WebMessageBodyStyle.WrappedRequest,
 ResponseFormat = WebMessageFormat.Json)]
 public dynamic getGalleryOutput(int GalleryID)
 {
 EasyGalleryDataContext data = new EasyGalleryDataContext();

 Folder folder = getAlbum(GalleryID);

 var includes = from gti in data.GalleryTemplateIncludes
 select new {
 gti.GalleryTemplateIncludeID,
 gti.IncludeID,
 gti.IncludeType,
 gti.IncludeOrder,
 gti.TemplateInclude
 };

 JsonSerializerSettings jsSettings = new JsonSerializerSettings();
 jsSettings.ReferenceLoopHandling = ReferenceLoopHandling.Ignore;

 dynamic[] results = { folder, folder.Images, folder.GalleryTemplate, includes };
 return JsonConvert.SerializeObject(results, Formatting.None, jsSettings);
 }

Recently I had a project where I wanted to return multiple sets of data via AJAX with a single call, although the sets of data were different types (from different tables altogether). Anything to save some bandwidth/roundtrips, right? I made an attempt at using the new dynamic type to create my service method and to hold my sets of data, and was able to use the JavaScriptSerializer to return the JSON that I needed for my jQuery web service. Example below

[WebInvoke(Method = "POST",
BodyStyle = WebMessageBodyStyle.WrappedRequest,
ResponseFormat = WebMessageFormat.Json)]
public dynamic getPriceRelatedData()
{
    EasyGalleryDataContext data = new EasyGalleryDataContext();

    var sizes = from szs in data.Sizes
        select new {
            szs.SizeID,
            szs.Height,
            szs.Width
        };

    var finishes = from fn in data.Finishes
        select new
        {
            fn.FinishID,
            fn.Title
        };

    dynamic pricesheets = from ps in data.PriceSheets
                        select new
                        {
                            ps.PriceSheetID,
                            ps.Title,
                            PriceSheetItems = (from psi in data.PriceSheetItems
                                                where psi.PriceSheetID == ps.PriceSheetID
                                                select new
                                                {
                                                    psi.PriceSheetItemID,
                                                    psi.PriceSheetID,
                                                    psi.SizeID,
                                                    psi.FinishID,
                                                    psi.Price
                                                })
                        };

    dynamic[] results = { sizes, finishes, pricesheets };

    JavaScriptSerializer serializer = new JavaScriptSerializer();
    return serializer.Serialize(results);
}

I spent more time than I will EVER admit trying to figure out what the heck was wrong with my code, passing a date created by the jQuery UI datepicker into my .NET WCF service. I tried tick conversions (which would wind up sending a date WCF didn’t understand). The only things I COULD get WCF to understand, read around the year 1970. So, with a bit of research, I woudn up with the following code to convert a javascript date to a format that WCF wants to see.

$.ajax({
     type: "POST",
     contentType: "application/json; charset=utf-8",
     url: "/WebServices/WebServiceHost.svc/scorePhotographer",
     data: '{"datevisited": "\\\/Date(' + Date.UTC(x.getUTCFullYear(), x.getUTCMonth(), x.getUTCDate(), x.getUTCHours(), x.getUTCMinutes(), x.getUTCSeconds(), x.getUTCMilliseconds()) +
          (-x.getTimezoneOffset() < 0 ? '-' : '+') + (Math.abs(x.getTimezoneOffset() / 60) < 10 ? '0' : '') + (Math.abs(x.getTimezoneOffset() / 60)) + '00' +
          ')\\\/" +
          '"}',
     dataType: "json",
     dataFilter: function(data, type) {
     var d = data.replace(/"\\\/(Date\(.*?\))\\\/"/gi, 'new $1');
     return d;
},
success: function (msg) {
     // blah
},
error: function (e) {
     //blah
}
});

Hope this helps someone!

It’s been awhile, but I’ve finally got some updates released. You will find:

• the 24 hour mode works as expected now
• CSS has been altered to include positioning fixes for the colons in IE8 and FF 3.6
• issues have been addressed for problems that manifest themselves when there are multiple pickers on a page and you try to change focus and change time

Thanks!