254

How do I define a method in Razor?

1
  • 2
    For those who wanted to see what are options: There are two ways to do it. One. using "@function" and another using "@helper". The difference between them is nicely explained here. mikesdotnetting.com/article/173/…
    – b1k
    Sep 20, 2019 at 16:09

8 Answers 8

357

Leaving alone any debates over when (if ever) it should be done, @functions is how you do it.

@functions {

    // Add code here.

}
5
  • 17
    +1 thanks, FYI its called practicality. MVC isn't the only game in town. Some folks just like simple razor and URLRewrite as MVC is a lot to do for little benefit IMO Oct 28, 2012 at 18:00
  • 6
    @functions is a good place to organize view specific generation code. Case in point: those ugly client templates-from-strings .. Apr 22, 2015 at 22:22
  • 1
    hi David, how can I define the function in one file and use it in another file? Dec 1, 2016 at 20:06
  • Georgi, this is called "Razor HTML Helper". Basically, a class defined in your Code folder, with a set of static methods as suggested here: asp.net/mvc/overview/older-versions-1/views/…
    – jeanie77
    Jan 17, 2017 at 10:02
  • Georgi, you may have come across this by now ... but for reusing <code>@functions</code> or <code>@helper</code> Razor options you can use a file such as Shared.cshtml in your App_Code folder. In there you can define <code>@functions {}</code> or <code>@helper MyFunction() {}</code> and use them in your other Razor templates like <code>@Shared.MyFunction()</code> where the name of the file is like the "namespace" Dec 10, 2017 at 1:26
219

You mean inline helper?

@helper SayHello(string name)
{
    <div>Hello @name</div>
}

@SayHello("John")
11
  • 5
    I want to define a method that returns not a MvcHtmlString, but a C# type.
    – Rookian
    Mar 1, 2011 at 20:26
  • 5
    @Rookian, why would you ever need to write C# code in a view? I mean writing methods in a view is just wrong! You could perfectly fine write your C# code wherever in belongs and then invoke the method in a Razor view, and that's exactly what HTML helpers do. And they are not supposed to return always an MvcHtmlString. Mar 1, 2011 at 20:27
  • 1
    @Rookian, maybe you could explain what you are trying to do in the first place. Whatever it is I am sure there is a better way to do it rather than writing C# code in a view :-) Mar 1, 2011 at 20:30
  • 3
    Not supported anymore in ASP.NET Core it seems. Syntax error.
    – ygoe
    Jul 27, 2016 at 7:43
  • 5
    The ASP.NET Core equivalent is the Tag Helper: learn.microsoft.com/en-us/aspnet/core/mvc/views/tag-helpers/…
    – beercohol
    Jan 4, 2017 at 18:02
55

It's very simple to define a function inside razor.

@functions {

    public static HtmlString OrderedList(IEnumerable<string> items)
    { }
}

So you can call a the function anywhere. Like

@Functions.OrderedList(new[] { "Blue", "Red", "Green" })

However, this same work can be done through helper too. As an example

@helper OrderedList(IEnumerable<string> items){
    <ol>
        @foreach(var item in items){
            <li>@item</li>
        }
    </ol>
}

So what is the difference?? According to this previous post both @helpers and @functions do share one thing in common - they make code reuse a possibility within Web Pages. They also share another thing in common - they look the same at first glance, which is what might cause a bit of confusion about their roles. However, they are not the same. In essence, a helper is a reusable snippet of Razor sytnax exposed as a method, and is intended for rendering HTML to the browser, whereas a function is static utility method that can be called from anywhere within your Web Pages application. The return type for a helper is always HelperResult, whereas the return type for a function is whatever you want it to be.

1
  • 4
    Calling function by omitting @Functions prefix as @OrderedList(...) works for me in .netcore.
    – Muflix
    Aug 21, 2018 at 11:51
14

You could also do it with a Func like this

@{
    var getStyle = new Func<int, int, string>((width, margin) => string.Format("width: {0}px; margin: {1}px;", width, margin));
}

<div style="@getStyle(50, 2)"></div>
1
  • Declaring a Func allocates a delegate and impacts performance (a little bit) Aug 28, 2022 at 20:27
10

Razor is just a templating engine.

You should create a regular class.

If you want to make a method inside of a Razor page, put them in an @functions block.

3

You can also just use the @{ } block to create functions:

@{
    async Task<string> MyAsyncString(string input)
    {
        return Task.FromResult(input);
    }
}

Then later in your razor page:

   <div>@(await MyAsyncString("weee").ConfigureAwait(false))</div>
3

Here is how the list helper is written in ASP.NET Core 3

You can now include HTML markup in the body of a method declared in a code block as a local method as previously, or in an @functions block. The method should return void, or Task if it requires asynchronous processing :

@{
    void Template(string[] listItems, string style)
    {
        <ul>
            @foreach (var listItem in listItems)
            {
            <li class="@style">@listItem</li>
            }
        </ul>
    }
}
1

MyModelVm.cs

public class MyModelVm
{
    public HttpStatusCode StatusCode { get; set; }
}

Index.cshtml

@model MyNamespace.MyModelVm
@functions
{
    string GetErrorMessage()
    {
        var isNotFound = Model.StatusCode == HttpStatusCode.NotFound;
        string errorMessage;
        if (isNotFound)
        {
            errorMessage = Resources.NotFoundMessage;
        }
        else
        {
            errorMessage = Resources.GeneralErrorMessage
        }

        return errorMessage;
    }
}

<div>
    @GetErrorMessage()
</div>

You could also use the code block below. It is much cleaner and has more functionality. You can also insert variables above and functions below. Instead of using 2 seperate code blocks.

@{
    string exampleVariable = "just an example variable";
    string anotherExampleVariable = "just another example variable";

    string GetErrorMessage()
    {
        var isNotFound = Model.StatusCode == HttpStatusCode.NotFound;
        string errorMessage;
        if (isNotFound)
        {
            errorMessage = Resources.NotFoundMessage;
        }
        else
        {
            errorMessage = Resources.GeneralErrorMessage
        }

        return errorMessage;
    }
}

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.