MVC3 customising validation message in view

Question

I think this is a really simple question which for some reason i cannot think of how to do!

I have a view with the following:

 <li>
                        <label>Job Title</label>
                        <%= Html.TextBox("JobTitle",Model.Person.JobTitle, new { type = "text", required = "required", placeholder = "Required" } ) %>
                        <%= Html.ValidationMessage("JobTitle","") %>
                    </li>

On submit if the field is not filled out a pop up "Please fill in this field" appears.

I want to customise this message to be "Please enter your job title"

I thought i would just need to change the Person.cs to:

    /// <summary>
    /// JobTitle
    /// </summary>
    [Required(ErrorMessage = "Please enter your Job Title")]
    [StringLength(128, ErrorMessage = "JoBTitle maximum length is 128")]
    public String JobTitle { get; set; }

but i can t think for the life of me what to do sorry!

Answer 1

ok not sure if thsi is the best way to do this - probably not!! but this works so...

<script type="text/javascript">
    //<![CDATA[
    $(document).ready(function () {
        var elements = document.getElementsByTagName("INPUT");
        for (var i = 0; i < elements.length; i++) {
            elements[i].oninvalid = function (e) {
                var currentId = $(this).attr('id');
                e.target.setCustomValidity("");
                if (!e.target.validity.valid) {
                    if (currentId == "JobTitle") {
                        e.target.setCustomValidity("Please enter your Job Title");
                    }
                    if (currentId == "FirstName") {
                        e.target.setCustomValidity("Please enter your First Name");
                    }
                }
            };
            elements[i].oninput = function (e) {
                e.target.setCustomValidity("");
            };
        }
    })
    //]]>
</script>