Razor Tutorial with Operators - Programming Example

In this chapter you will learn
  • How to use Operator in Razor Markup
  • Programming Example

How to use Operator in Razor Markup

Razor Markup supports many operators of C# and VB.Net. There is no special rule for using operators in razor markup. You can simply use operators same as you use in c# programming or vb programming. Most common operators that is used in Razor markup is follows.

1. Math Operators : It is + (Plus), - (Minus) , * (Multiplication), / (Divide). It is used for mathematical calculation.
Example
 
<html>
    <head>
        <title>Math Operators</title>
    </head>
    <body>
        @{            
            int num1, num2,  plus, minus, multi, divide;
            num1 = 45;
            num2 = 9;
            plus = num1 + num2;
            minus = num1 - num2;
            multi = num1 * num2;
            divide = num1 / num2;
        }
        <h5>Addition : @num1 + @num2  = @plus</h5>
        <h5>Subtraction : @num1  - @num2  = @minus</h5>
        <h5>Multiplication : @num1  * @num2  = @multi</h5>
        <h5>Divide : @num1 / @num2 = @divide</h5>
    </body>
</html>

Output
Addition : 45 + 9 = 54
Subtraction : 45 - 9 = 36
Multiplication : 45 * 9 = 405
Divide : 45 / 9 = 5
2. Assignment Operator : It is =(equal to). It is used for assigning right side value to left side variable.
Example
int num = 55;
3. Equality Operator : It is == (Equality). It returns true if left hand side and right hand side value are equal otherwise return false.
Example
<html>
    <head>
        <title>Equality Operators</title>
    </head>
    <body>
        @{
            int[] num1={12,52,66,92,28};
            int[] num2={73,12,98,23,52};
 
            for(int i=0; i<5; i++)
            {
                for(int loop=0; loop<5; loop++)
                {
                    if(num1[i]==num2[loop])
                    {
                        <h5>Match Found : @num1[i]</h5>
                    }
                }
            }
        }       
    </body>
</html>

Output
Match Found : 12
Match Found : 52
4. Inequality Operator : It is != (Inequality). It returns true if both value are not equal.
Example
<html>
    <head>
        <title>Inequality Operator </title>
    </head>
    <body>
        @{
            int num1 = 5, num2 = 10;
            if(num1 != num2)
            {
                <h5>Returns True</h5>
            }
        }     
    </body>
</html>

Output
Returns True
5. Comparison Operator : It is <, >, <=, => . It is used for comparing two integer or decimal values.
Example
<html>
    <head>
        <title>Comparison Operator </title>
    </head>
    <body>
        @{
            int num1 = 5, num2 = 10;
            if(num1 < num2)
            {
                <h5>@num1  is less than @num2</h5>
            }
            else
            {
                <h5>@num1 is greater than @num2</h5>
            }
        }     
    </body>
</html>

Output
5 is less than 10
6. Concatenation Operator : It is + (Plus). It is used for joining two strings.
Example
<html>
    <head>
        <title>Concatenation Operator</title>
    </head>
    <body>
        @{
            string msg1 = "This is Razor Tutorial.";
            string msg2 = "And you are learning at CompleteCsharpTutorial.com";
            string finalmsg= msg1 + " " + msg2;
            <h3>@finalmsg</h3>
        }
    </body>
</html>

Output
This is Razor Tutorial. And you are learning at CompleteCsharpTutorial.com
7. Increment and Decrement Operators : It is ++ or += and -- or -= . It is used for incrementing or decrementing integer value.
Example
<html>
    <head>
        <title>Increment and Decrement Operators</title>
    </head>
    <body>
        @{
            int inc = 5;                     
            <h3>Increment of @inc is @{inc++;} : @inc</h3>
            <h3>Decrement of @inc  is @{inc--;} : @inc</h3>
 
            <h3>Increment of @inc  is @{inc+=1;} : @inc</h3>
            <h3>Decrement of @inc  is @{inc-=1;} : @inc</h3>
        }
    </body>
</html>

Output
Increment of 5 is : 6
Decrement of 6 is : 5
Increment of 5 is : 6
Decrement of 6 is : 5
8. Dot Operator : It is . (Dot). It is used to distinguish objects and their properties and methods.
Example
<html>
    <head>
        <title>Dot Operator</title>
    </head>
    <body>
        @{
            var num = "55";
            int i;            
            i=num.AsInt();
            <h3>@i</h3>
            <h3>Browser Name : @Request.Browser.Id</h3>
        }
    </body>
</html>

Output
55 Browser Name : chrome
9. Parentheses : It is () . It is used to group expression and to pass parameters to methods.
Example
<html>
    <head>
        <title>Parentheses</title>
    </head>
    <body>
        @{
            int num1 = 5, num2 = 10;
            if((num1 + num2) == 15)
            {                
                <h2>Addition is 15</h2>
            }
        }
    </body>
</html>

Output
Addition is 15
10. Bracket : It is [] . It is used for accessing value in arrays of collections.
Example
<html>
    <head>
        <title>Bracket</title>
    </head>
    <body>
        @{            
            int[] arr={12,562,62,98,388};
            <h3>@arr[3]</h3>
        }
    </body>
</html>

Output
98
11. Not Operator : It is ! (Not). It reverse true into false and false into true.
Example
<html>
    <head>
        <title>Not Operator</title>
    </head>
    <body>
        @{
            int num1 = 5, num2 = 10;
            if(!(num1 == num2))
            {
                <h3>However conditions are false still this message appears because you have used not operator and it reverse the condition.</h3>
            }
        }
    </body>
</html>

Output
However conditions are false still this message appears because you have used not operator and it reverse the condition.
12. Logical Operator : It is && (AND) and || (OR). It is used to link conditions together and helps to make logic much better.&& - Returns true if all the specified conditions are true otherwise returns false.
|| - Returns true if one or all the conditions are true.
Example
<html>
    <head>
        <title>Logical Operator </title>
    </head>
    <body>
        @{
            string username = "Steven";
            string password = "Svn78*5";
 
            if(username == "Steven" && password == "Svn78*")
            {
                <h3>Login Successful</h3>
            }
            else if(username == "Steven" || password == "12345")
            {
                <h3>Hello Steven, you have entered wrong password.</h3>
            }
            else
            {
                <h3>Unauthorized Login</h3>
            }
        }
    </body>
</html>

Output
Hello Steven, you have entered wrong password.

Summary

In this chapter you learned to use different types of operator with programming example that is used in razor markup. In the next chapter you will learn how to use Conditional Statements in Razor Markup.
 

Share your thought