Writing a Custom Html Helper for Button in ASP.NET Razor

Html Helpers are used when we want to have a custom html with/without some logic repeated across your application. Today I wanted to have all the buttons shown across the application behave in a particular way depending upon the logged in user, this can easily be done using HtmlHelper.

Code

public static class CustomHtmlHelpers
{
    public static MvcHtmlString CustomButton(this HtmlHelper htmlHelper, string innerHtml, IDictionary<string, string> htmlAttributes)
    {
        var builder = new TagBuilder("a") {InnerHtml = innerHtml};
        builder.MergeAttributes(htmlAttributes);
        return MvcHtmlString.Create(builder.ToString());
    }
}

In the IDictionary<string, string> htmlAttributes parameter you can pass all the html attributes you need your button to have, for example: class, href, or any other html attribute for that matter.

Example

@Html.CustomButton("<i class='fa fa-plus'></i>&nbsp; Create Something", new Dictionary<string, string> { { "class", "btn btn-primary" }, { "href", "#create" } })

You might wanna read another related article on Html Helpers.

How to pass values from ASP.NET MVC Razor Views to Angular Controller ?

I have been using a lot of AngularJs code on my razor views lately. On one of my page, I wanted to pass to my angular controller the model which is being passed to my razor view.

Can be done with the following code

ng-init="init(@JsonConvert.SerializeObject(Model))"

JsonConvert.SerializeObject helps you convert an object to a JSON string and you can use ng-init to pass and use this value in your controller.

How to configure the default ASP.NET Membership’s Role Manager in ASP.NET MVC 4

If you do not want to create your own custom Role Provider and use the ASP.NET Membership’s in built RoleManager. Then you should use the following setting in your web.config file.

<roleManager enabled="true" defaultProvider="SqlRoleProvider" >
  <providers>
    <add name="SqlRoleProvider"
         type="System.Web.Security.SqlRoleProvider"
         connectionStringName="AbcAspNetConnection"
         applicationName="Abc Web Application"/>
  </providers>
</roleManager>

Font awesome not working on IIS for ASP.NET MVC project

Here are things that you should be checking if your fontawesome is not working when you put your website on IIS.

enter image description here

Check 1: Check if all the fonts (.otf, .woff etc) are copied to the /font-awesome-4.2.0/fonts/ folder.

Check 2: Remove the fontawesome.css from your bundle and add it directly like <link href="~/Content/font-awesome-4.2.0/css/font-awesome.css" rel='stylesheet' type='text/css' />

Setting up Staging, QA and Live web configs with Visual Studio 2013

Step 1 : Open the Configuration Manager dialog.
enter image description here

Step 2 : Select “<New..”> option from the Active solution configuration dropdown.
enter image description here

Step 3: Give some name to your configuration, and if you dont require an empty config file I would suggest you to copy the settings from the existing “Release” transform.
enter image description here

Step 4: Right click on the web.config file and select the “Add Config Transform” option.
enter image description here

Step 5: And you should see your Staging config created. You can similarly create a qa and production/live configs too.
enter image description here

How to conditionally add remove required attribute in Angular Js ?

Working on a form and its validation using AngularJs, I was using the “required” attribute to mark fields required. However there were few fields that should be required depending on input on other fields. This seemed little tricky at first, I also posted this as a question on SO.

Here is what I ended up using:

<input type="text" value="" 
  ng-model="details.Address" 
  ng-required="addressRequired" />

Simple and clean :)

How to stop SignalR from polling when using Visual Studio 2013 ?

I recently moved to Visual Studio 2013. One thing that I noticed when console debugging was that there were tooooo many “GET”/”POST” request being made. These requests were not being made by any of my written code.

enter image description here

On checking this closely, I found these calls were made to /arterySignalR/poll?transport=longPolling..... Artery aka BrowserLink is a real-time connection from Visual Studio to all browsers running your code. It essentially allows Visual Studio to interact with every browser.

Here’s how to stop this: Uncheck Enable browser link.

enter image description here

How To Use Entity Framework With MySql Database ?

Step 1 : Download and Install

First, you will need to download and install the following

Step 2 : Create A Database To Connect To

Make sure you create a database and a table with few columns for testing the connectivity using EF. In my example I have a ‘UserProfile’ table which has fields like userId, email, firstName, lastName etc.

Step 3 : Add Reference To Your Project

Add MySql.Data.dll and MySql.Data.Entity.dll to your project. enter image description here

Step 4 : Add ADO.NET Data Entity Model

enter image description here

enter image description here

enter image description here

enter image description here

enter image description here

enter image description here

Step 5 : Time To Test

public User CreateUser(User model)
{
    using (var context = new TestMySqlDbEntities())
    {
        // add user
        var createdUser = context.Users.Add(model);
        context.SaveChanges();
    }

    return model;
}