Over a million developers have joined DZone.
{{announcement.body}}
{{announcement.title}}

Converting C# Enums to JavaScript

DZone's Guide to

Converting C# Enums to JavaScript

Ever needed to make some enums in C# available to some JavaScript? In this post, we take a look at a solution to doing just that!

· Web Dev Zone ·
Free Resource

Learn how error monitoring with Sentry closes the gap between the product team and your customers. With Sentry, you can focus on what you do best: building and scaling software that makes your users’ lives better.

In one of my projects, I needed some enums defined in C# to also be usable in my JavaScript code. After some quick research on the internet, I came up with a simple and easy extension method to convert C# enums to JavaScript. Here it is.

Let’s get started with an example enum and suppose we want to be able to also use it with JavaScript.

public enum AssetStatusEnum
{
    Free,
    Reserved,
    Inactive,
    UnderMaintenance
}

To make enum available in JavaScript, we have to convert it to JSON. As Enum.GetValues() returns Array and Array doesn’t have LINQ extensions available, we have to cast an array to IEnumerable<int> before converting it to a dictionary. We need a dictionary because the JSON converter that comes with the popular NewtonSoft JSON package will serialize it to a JavaScript array.

Here is the extension method for HtmlHelper and this method returns enum as JavaScript object string.

public static class HtmlEnumExtensions
{
    public static MvcHtmlString EnumToString<T>(this HtmlHelper helper)
    {
        var values = Enum.GetValues(typeof(T)).Cast<int>();
        var enumDictionary = values.ToDictionary(value => Enum.GetName(typeof(T), value));           return new MvcHtmlString(JsonConvert.SerializeObject(enumDictionary));
    }
}

This is how we call our extension method in views.

<script>
    var assetStatusEnum = @(Html.EnumToString<AssetStatusEnum>())
</script>

And this is the result of converting our AssetStatusEnum to JavaScript.

<script>
    var assetStatusEnum = {"Free":0,"Reserved":1,"Inactive":2,"UnderMaintenance":3}
</script>

Our extension method has the following benefits:

  • Simple and easy to debug code.
  • No more manually duplicated enums in JavaScript.
  • Enums in JavaScript are always up to date.

What’s the best way to boost the efficiency of your product team and ship with confidence? Check out this ebook to learn how Sentry's real-time error monitoring helps developers stay in their workflow to fix bugs before the user even knows there’s a problem.

Topics:
converter ,c# ,javascript ,web dev ,enums

Published at DZone with permission of

Opinions expressed by DZone contributors are their own.

{{ parent.title || parent.header.title}}

{{ parent.tldr }}

{{ parent.urlSource.name }}