Del via


Using @functions in an ASP.NET page with Razor Syntax

In July Microsoft released the WebMatrix Beta. WebMatrix is a set of tools and technologies which includes a code editor, a development web server, various tools, and the new simplified "Razor syntax." The Razor syntax is a type of syntax for writing server code in ASP.NET pages. It is simple to use and has some affinity for PHP developers. You can find information on installing WebMatrix, and documentation on programming with the Razor syntax, on the ASP.NET site: https://www.asp.net/webmatrix.

The @functions Block

Chapter 2 of the documentation is titled Coding with Razor Syntax. This documentation covers the basics of the new syntax. But one syntax feature that is not yet included in the beta documentation is the @functions block.

The purpose of the @functions block is to let you wrap up reusable code, like the methods and properties that are discussed in Chapter 2, and then be able to call those methods or properties from other parts of the page. Say that you have a common method called GetUserName, and you need to call this method more than once in your code. It doesn't make sense to rewrite that same code every time you want to get a user name. By placing this method in an @functions block, you can just call the GetUserName method whenever you want. So the basic idea is, put reusable code in an @functions block.

The Structure of an @functions Block

As you learn in Chapter 2, a block of code in Razor syntax begins with @, and then is contained with a pair of braces ( "{" and "}"). An @functions block simply adds the functions keyword to a basic block, and looks like this:

C#

 @functions {

    // Add code here.

}

VB

 @Functions

    ' Add code here.

End Functions

Code Example of an @functions Block

The following code example contains a complete page showing a simple @functions block. In the @functions block at the top of the page, it declares a method named HelloMessage and a property named Age. Then the method and the property are both called within the body of the page to display their values. Note that when you call a method in the Razor syntax, you must use parentheses whether the method has a parameter or not. When you call the Age property in the body of the page, because it is typed as an integer, you must call the ToString method (including parentheses) to properly convert and display its value.  If the Age property had been a string type property, you would not need to call the ToString method to convert its value for display, and you would not need to use parentheses to call the property.

C#

 @functions {

    // Create a variable to store the age.
    int userAge = 0;
    
    // Pass a user name to this method.
    string HelloMessage(string user)
    {
        var msg = "Hi " + user + ", how are you?";
        return msg;
    }
    
    int Age
    {
        get 
        {
            return userAge;
        }
        set
        {
            userAge = value;
        }
    }
}
 
 <!DOCTYPE html>

<html>
    <head>
        <title></title>
        <meta http-equiv="content-type" content="text/html;charset=utf-8" />
    </head>
    <body>
    @{
        // Here we set a value on the Age property. 
        // In a real page, you might retrieve the user's
        // age from a form or database, and then assign 
        // the value to the property.
        Age = 27;
      
    }
       
    <!-- Pass a hard-coded user name to the HelloMessage method. 
         In a real  page you would likely get the user name from 
         a login form or database, and pass it to the method.
    -->
    <p>The value of the <code>HelloMessage</code> method: @HelloMessage("James")</p>
    
    <!-- Because the Age property is typed as an int (a number), 
         you must convert it to a string to display the value.
    -->
    <p>The value of the <code>Age</code> property: @Age.ToString()</p>
    
</body>
    
</html>

VB

 @Functions

    ' Create a variable to store the age.
    Dim userAge as Integer = 0

    Function HelloMessage(user as String) As String
        Dim msg = "Hi " & user & ", how are you today?"
        Return msg
    End Function
    
    Property Age() As Integer
        Get
            Return userAge
        End Get
        Set(ByVal value As Integer)
            userAge = value
        End Set
    End Property

End Functions
 <!DOCTYPE html>

<html>
    <head>
        <title></title>
        <meta http-equiv="content-type" content="text/html;charset=utf-8" />
    </head>
    <body>
    @Code
        ' Here we set a value on the Age property. 
        ' In a real page, you might retrieve the user's
        ' age from a form or database, and then assign 
        ' the value to the property.
        Age = 27
    
    End Code
        
    <!-- Pass a hard-coded user name to the HelloMessage method. 
         In a real  page you would likely get the user name from 
         a login form or database, and pass it to the method.
    -->
    <p>The value of the <code>HelloMessage</code> method: @HelloMessage("James")</p>
    
    <!-- Because the Age property is typed as an int (a number), 
         you must convert it to a string to display the value.
    -->
    <p>The value of the <code>Age</code> property: @Age.ToString()</p>
    
</body>
    
</html>

The Future of @functions Blocks

The @functions block is a useful tool in the Razor syntax. It lets you develop reusable code and then call it from anywhere else that you want in your page. In future releases, it won't be surprising to see additional capabilities added to @functions to make it even more useful.

Comments

  • Anonymous
    July 31, 2010
    Thank you! This is really good to know. I can't wait to see more documentation and tutorials on Razor and WebMatrix.

  • Anonymous
    April 04, 2011
    Hi! Thank you for the information, very useful. I am working in a jquery mobile and razor website and I don't know how to call a razor function passing a javascript  parameter: <script type="text/javascript">       string param = $("#mycombo").val();       @updatePrice(param);          // param does not exist in the current context       @updatePrice(@:param);     //opening "(" is missing the corresponding closing ")".       @{               updatePrice(                      @:param               );                               //Cannot convert lambda expression to type 'string' because it is not a delegate type         } </script> @functions {     double updatePrice(string id)     {              var db = Database.Open("DB");          var extra = db.QuerySingle("Select * from productVariety Where productVarietyId = @0", id);                                                                                          return extra.price;                                        } }

  • Anonymous
    June 10, 2011
    Dear Epb, Unfortunately this will not work. Razor is executed server side and Javascript client side. Paul.

  • Anonymous
    October 07, 2011
    The comment has been removed

  • Anonymous
    February 06, 2014
    Muchas gracias, me funciono perfecto.