Protip: Always Check the Scripts

I had to update a site with a slideshow.

But when I added the HTML, CSS and JavaScript and the slideshow just didn’t work I kept banging my head on my keyboard trying to figure out why. I’m checking the examples. I’m removing CSS and other JavaScript code to see if there’s some kind of conflict and nothing.

Well, let me literally copy the the scripts from the example because they were full-pathed, and hey the slideshow started working.

Turns out that when I set the site up, I used the HTML5 Boilerplate which I believe had jQuery 1.4 and the slideshow used jQuery 1.5. Well, there’s your problem.

Lesson learned, always check your script versions, or always make sure you just use the latest versions (which I normally do but for this site I didn’t, I think because there was another larger project that needed finishing and this one just fell out of thin air).

MVC3 Display an Asterisk For Error Message

So with when working with MVC3 you can decorate your POCO’s with attributes that can be used to validate the properties on both the server and client side. It makes validation easy.

But what if you don’t really have the space to display the error messages next to the field and would rather have something shorter like an asterisk?

Turns out the ValidationMessageFor HtmlHelper takes a parameter for validationMessage which overrides the ErrorMessage from the model.

The POCO and a strongly typed view:


using System.ComponentModel.DataAnnotations;

namespace MvcApplication3.Models
{
    public class Person
    {
        [Required(ErrorMessage = "The name is required")]
        public string Name { get; set; }

        [Required(ErrorMessage = "The title is required")]
        public string Title { get; set; }
    }
}

Then update your view’s ValidationMessageFor with a second parameter, a string containing your new error message.

@Html.ValidationMessageFor(model => model.Name, "*")

And if you want to display a list of the error messages set the ValidationSummary parameter to false (display all errors):

@Html.ValidationSummary(false)

One more thing, if you are using your own style sheet, our custom errors are displaying:

We just have to hide the custom error messages from view until someone tries to submit the form with one CSS class.

.field-validation-valid
{
    display: none;
}

Source for the CSS: http://stackoverflow.com/questions/4370131/asp-net-mvc-3-rc-razor-validationmessagefor-custommessage-and-clientsidevalidat

WebMail Helper and SMTP MailSettings

I had to add some email notification to a project today and wanted to give the new WebMail helper a try.

It’s a pretty straight forward chunk of code that makes sending emails really easy. They only thing I couldn’t find was anything about using the web.config to set your smtp settings like host and port number. However the MSDN documentation says you can just use the _AppStart.cshtml (and when you create a Razor website the _AppStart.cshtml has the WebMail settings in it, just commented out).

Many of the property values (like the SMTP server name and port number) are usually constant for a website. Therefore, you typically make many of these property settings only one time in the _AppStart.cshtml or _AppStart.vbhtml file that runs when the website first runs.

But I just wanted to see about setting it in the web.config, to try to keep my settings together in one file.

It turns out that simply setting the settings in system.net in the web.config is enough:

  <system.net>
    <mailSettings>
      <smtp>
        <network host="localhost" port="25"/>
      </smtp>
    </mailSettings>
  </system.net>

Then sending your email with the WebMail helper is just the same:

@{
  try
  {
    WebMail.Send("test@test.com", "Test Message", "Hello world!");
  }
  catch(Exception ex)
  {
    @ex.Message
  }
}

IIS Large File Upload Error

So you want to let someone upload something to your server using ASP.NET MVC. Not a big problem, pretty simple. But what happens if someone tries to upload a large file?

The default max upload file size is four megabytes. Anything larger and you receive that message. Of course you could set the maxRequestLength in the web.config but the problem with that is that we didn’t deal with the problem.

We don’t just want to put the problem out of mind and hope that no one uploads more than that, but we want to have some control over how much someone can upload to our server and if they try to upload more than our limit handle it properly.

This is the basic settings for the webconfig to handle a 404.13 error.

<system.webServer>
	<httpErrors errorMode="Custom" existingResponse="Replace">
		<error statusCode="404" subStatusCode="13" path="/Home/Error" responseMode="Redirect" />
	</httpErrors>
</system.webServer>

There are some additional settings and information available on Display custom error page when file upload exceeds allowed size in ASP.NET MVC.

But there is just one problem, it doesn’t work. Well it does. Just not with Visual Studio development server.

To fix the issue either run the site under IIS proper or just set Visual Studio to use IIS Express by right clicking the project name and select the option from the context menu.

After that run the project and try to upload a file larger than four megabytes (or whatever you set it to) and you should receive your custom error page.

MVC3 Account/Login

I want to start off with something simple, to make posting easier. Something along the lines of learning something new every day, or Something I Learned Today.

Today I was working on a MVC3 project and for some reason on of resources that required authentication was looking for /Account/Login.

I couldn’t find anything, even searching the entire project for Login. Worst case I just created the Login action in the Account controller and did a redirect to the LogOn action.

But a little more Googling I found: Two bugs in ASP.NET MVC 3 and a workaround for both

The solution is to add the following app setting to the web.config:


<add key="loginUrl" value="~/Account/LogOn"/>

I created a new project at home to test to see if this is a normal thing and the good news is that it’s not. So it must just be my one resource in my project at work. But know I know how to fix the issue for the future.