How to capitalize first letter razor

Question

I am new to MVC and have not found a solution for this online.

I have the html as :

@Html.DisplayFor(model => model.Address1) <br />

I want all the first letter of address1 to be capital letters e.g. Something Road instead of something road.

Now I have a class client and property Address1 and using EF to get the address as follow:

 public class MyDBContext : DbContext
    {
        public DbSet<Client> Clients { get; set; }
    }

Hope it makes sense.

Answer 1

easy solution could be

Html.EditorFor(model => model.FirstName, new { htmlAttributes = new { class = "form-control" } })

then use below css to capitalize your first letter then you done.

.form-control {
text-transform:capitalize;
}

Answer 2

You could add a partial class for Client with a property that returns Address1 in title case:

public partial class Client
{
    public string TitleCaseAddress1
    {
        get
        {
            return System.Globalization.CultureInfo.CurrentCulture.TextInfo.ToTitleCase(this.Address1);
        }
    }
}

You would then use TitleCaseAddress1 in your Razor:

@Html.DisplayFor(model => model.TitleCaseAddress1) <br />

Reference: http://msdn.microsoft.com/en-us/library/system.globalization.textinfo.totitlecase(v=vs.100).aspx

Answer 3

For anyone looking to do this strictly in Razor, this example is converting the logged-in user name. Replace with your string variable.

This gets first letter and converts to upper:

@(@User.Identity.GetUserName().ToString().Substring(0, 1).ToUpper())

This gets the remaining string.

@(@User.Identity.GetUserName().ToString().Substring(1, 
    User.Identity.GetUserName().ToString().Length - 1))

Just put them together like so to get the whole string.

@(@User.Identity.GetUserName().ToString().Substring(0, 
    1).ToUpper())@(@User.Identity.GetUserName().ToString().Substring(1, 
    User.Identity.GetUserName().ToString().Length - 1))

Answer 4

It's best to keep the presentation layer and the data access layer separate. Create a view model that wraps or translates the ORM / entity framework objects.

public class ClientViewModel
{
    private Client _dao;

    public ClientViewModel(Client dao)
    {
        _dao = dao;
    }

    public string Address 
    { 
        get
        {
            // modify the address as needed here
            return _dao.Address;
        }
    }
}

Answer 5

Here is the correct way to accomplish what you want, I've implemented it for you.

There is an HtmlStringFormatter.Create() which allow you to pass a delegate and make your own anonymous formatter.

Code Sample:

// This just upper case all the letters.
@Html.DisplayFormatFor(model => model.Address, HtmlStringFormatter.Create(s=> s.ToUpper()))

If You to create a custom formatter, derive from HtmlStringFormatter and set its delegate property to whatever manipulation you want to do.

Code Sample:

// Here I use the Capital Letter custom formatter.
@Html.DisplayFormatFor(model => model.Address, new CapitalLetterFormatter())

All the classes:

namespace MvcPlay.HelperExtensions
{
    public static class HelperExtensions
    {
        public static MvcHtmlString DisplayFormatFor<TModel, TValue>(this HtmlHelper<TModel> helper, Expression<Func<TModel, TValue>> expression, HtmlStringFormatter formatter)
        {
            var output = helper.DisplayFor(expression);
            string formatted = formatter.Delegate.Invoke(output.ToString());
            return MvcHtmlString.Create(formatted);
        }
    }
}

namespace MvcPlay.HtmlStringFormatting
{
    public class HtmlStringFormatter
    {
        public delegate string FormatDelegate(string s);

        public FormatDelegate Delegate;
        public Expression<FormatDelegate> formatExpression;

        private HtmlStringFormatter(FormatDelegate expression)
        {
            Delegate = expression;
        }

        protected HtmlStringFormatter()
        {

        }

        public static HtmlStringFormatter Create(FormatDelegate expression)
        {
            return new HtmlStringFormatter(expression);
        }
    }

    public class CapitalLetterFormatter : HtmlStringFormatter
    {
        public CapitalLetterFormatter()
        {
            Delegate =
                s => new CultureInfo("en-US", false).TextInfo.ToTitleCase(s).ToString(CultureInfo.InvariantCulture);

        }
    }
}

Don't forget to add the following lines to the Web.Config at the Views folder:

<add namespace="MvcPlay.HelperExtensions" />
<add namespace="MvcPlay.HtmlStringFormatting"/>

This will include the Formatters and the Helper Extension automatically so you won't need to include it inside every view that you want to use it in.

Answer 6

You can just use C# code for this: example from: http://www.dotnetperls.com/uppercase-first-letter

using System;

class Program
{
    static void Main()
    {
    Console.WriteLine(UppercaseFirst("samuel"));
    Console.WriteLine(UppercaseFirst("julia"));
    Console.WriteLine(UppercaseFirst("john smith"));
    }

    static string UppercaseFirst(string s)
    {
    // Check for empty string.
    if (string.IsNullOrEmpty(s))
    {
        return string.Empty;
    }
    // Return char and concat substring.
    return char.ToUpper(s[0]) + s.Substring(1);
    }
}

Answer 7

Just simply use as follows

@System.Globalization.CultureInfo.CurrentCulture.TextInfo.ToTitleCase(sampleText)

Answer 8

I know that the original question referred to capitalizing every word in the whole string. But, I got here trying to find a solution to capitalizing the first letter of a string. I agreed with kiflay's answer as the best solution to the OP. But, expanded on it to modify only the first letter, in my usage.

CSS:

blockquote::first-letter {
text-transform: capitalize;}

Answer 9

Using Bootstrap 4.x with Razor you use CSS to capitalize the first letter:

<p class="text-capitalize">CapiTaliZed text.</p>