Okay...today I am gonna write about
very weird requirement and a solution. I don't know how many of you already got
into such scenario, but let's see what is it and then I would like to know if
there is anything better.
What was my requirement?
Eternal question in developers'
life, WHAT IS THE REQUIREMENT DUDE? And the answer is...
I had created a simple view using
Razor syntax. I had created a model to bind it. I wanted to pass a collection
of enum values to view and use that in JavaScript.
Here is my model class
public class UserDetails
{
public string UserName { get; set; }
public string UserEmail { get; set; }
public string City { get; set; }
}
To
achieve my goal I added a property of type string to the model class and class
looks like
public class UserDetails
{
public string UserName { get; set; }
public string UserEmail { get; set; }
public string City { get; set; }
public string Hobbies { get; set; }
}
Here is the enum of hobbies:
public enum Hobby : int
{
Reading = 500,
Writing,
Sports,
Music
}
Action method looks like this:
public ActionResult GetUserDetails(int userId)
{
// Get
user details
UserDetails userDetails = Utility.GetUserDetailsById(userId);
//Get
hobbies
Collection<Hobby> hobbies =
Utility.GetHobbiesByUserId(userId);
//
Create serializer object
System.Web.Script.Serialization.JavaScriptSerializer
javaScriptSerializer = new System.Web.Script.Serialization.JavaScriptSerializer();
// Serialize the object
userDetails.HobbiesString =
javaScriptSerializer.Serialize(hobbies);
return View();
}
Key line of code to notice here is use of
JavaScriptSerializer. When I serialize the collection object using this serializer
it returns serialized string. I set that to newly added property of type string
and return view.
In view I get this string from the model object. To use it
in JavaScript, I used JQuery’s parseJSON function as follows:
var hobbies = $.parseJSON('@Model.HobbiesString');
I got following array as a result:
[‘502’, ’503’, ‘504’]
Conclusion:
I learnt something new about use of JavaScript serializer.
You can do fancy things using it. Do share your experiences too.
