Workflow Foundation 4 App-fabric Tracking Variables

Windows Server AppFabric provides a great set of tools and options to manage, scale and monitor application hosted in IIS. Especially for windows workflow applications AppFabric is a required tool to monitor , control and to scale the work-flows.

AppFabric Contoso HR Sample is a good tutorial to start with WF with AppFabric. In this post I'm going to describe how to add tracking variables to the Appfabric event log. This is a huge requirement when we are dealing with WorkFlows. Because in events written by AppFabrric contains a Guid to identify the workflow instance. But it is better if we can write our own id of the workflow in to the tracked events.

Let' say as an example in a order processing system. In this case the order we want to track the worrkflow instances by the order id. So here is how I did it,

First we need to define new tracking profile in the web config system.serviceModel section.

We can create several queries as we want. It may be queries for all activities or some specific activity. The query with activityName="*" will write orderid to the event log in all activities of the activity while query with activityName="Process New Order" will write several other variables in "Process New Order" activity to the events.
To enable this tracking profile for the service we need to go to the Appofabric configuration of the relevant service. Go to AppFabric dashboard of the service -> Services ->Select the service and click Configure .

And then go to Monitoring -> Configure , From the dropdown menu select our tracking profile (My Tracking Profile)

Then when the workflow is running we can see the tracked events with our our variables in tracked variables section.

Converting .Net Object In To JSON Object ASP.Net MVC

If you want to convert your .Net object in to a JSON object in the view the first thing you can use is to use System.Web.Script.Serialization.JavaScriptSerializer object and convert it in to JSON.

@{
System.Web.Script.Serialization.JavaScriptSerializer serializer = new System.Web.Script.Serialization.JavaScriptSerializer();
//....

<script>

var s = @serializer.Serialize(Model);
</script>

}

This is MVC3 Razor syntax. The problem here is in the @ sign it will again HTML encode the JSON object which lead you to flowing error.

var s = { "Name":"a","Id":1};
Create:228Uncaught SyntaxError: Unexpected token &

To avoid this we can use HTML.Raw() helper method like below.

var s = @HTML.Raw(serializer.Serialize(Model));

The easiest and the most reusable way of doing it is to write a helper method link this,

public static MvcHtmlString ToJson(this HtmlHelper html, object obj)
{
  JavaScriptSerializer serializer = new JavaScriptSerializer();
  return MvcHtmlString.Create(serializer.Serialize(obj));
}

And then in the view we can use this helper method

ASP.Net MVC Submit Collection Of Models

If you are using ASP.Net MVC for your presentation layer there are situations where you want to submit collection of view models. As an example lets say you have view models like this,

Person

• Id : int
• Name : string
• Addresses : Ilist

Address

• Id : Int
• Line1 : string
• City : string
• Type : string

The Person view model has a collection of addresses. 

Then you need to have an edit view for the person to edit all the details of the person view model. In the edit view there will be code like this to display current addresses to the user to edit/ add new or delete .

@model YourNameSpace.Models.Person
@using (Html.BeginForm("Edit", "Person", FormMethod.Post, new { enctype = "multipart/form-data", id = "personEditForm" }))
{
///.................
               @foreach (var address in Model.Addresses)
                   {
                        @Html.HiddenFor(m,address.Id);
                        @Html.EditorForl(m, address.Line1);
                           //............
                   }
//....................................
}

This will generate HTML for the address Id  and address Line1 like this,

…..


…..


……

Because there are several inputs with same name we can't submit all values in the form For that the names should be like "Addresses[0].Line1" as below.

…..


…..


……

Of course you can achieve this by creating an editor template for address. But you will be in trouble when you delete some address in the middle of the sequence. And also if you have more properties like address for the person view model it will abuse your template folder.
This is the solution which I created with help of jQuery. I have written a jQuery function to reset all the names of those collection properties . To get the collection name I have added a wrapper div for each address . Before reset the names the HTML is like this,

…..




…..




……

And then I added this jQuery to onClick event to reset names before submit,

$("#submitButton").click(fuction(){
 $('.collection').each(function (index, domEle) {
           var property=$(this).attr('propertyName');
             $(this).children('div').each(function (index, domEle) {
                 $('input,select',$(this)).each(function (){
                    var oldName;
                
                    var name= $(this).attr('name')+'';
                    var i=  name.indexOf(']');
                    if(i>0){
                         oldName= name.substr(i+2);
                     }else {
                         oldName=  $(this).attr('name');
                         
                     }
                     $(this).attr('name',property+'['+index+'].'+  oldName);
                     $(this).next('span').attr('name',property+'['+index+'].'+  oldName);// need to change the names of validations messages too.
                     $(this).next('span').attr('data-valmsg-for',property+'['+index+'].'+  oldName);
                });
             });
     });   
});

After reeting the names the HTML will be like this,

…..




…..




……