Question

So, I have a form on the page that I was using an input type=”submit” to register users. After adding Data Annotations, some custom, some built-in, I wanted to customize the look of the input submit button only to find out that I cannot get it to match the other buttons on the page which are just divs/links. So, I would like to make it a div that uses jquery to submit the form and call of the data annotation’s built-in and customized jquery before submitting. I tried this:

@using (Html.BeginForm("Index", "Register", FormMethod.Post, new { @id = "registerForm" }))
{
< div id=”registerSubmit” class=”divSubmit”>
< a>Register< / a>
< / div>}

$("#registerSubmit").onclick(function () {
$("#registerForm").submit();
});

But, that is not working for me. Is there a way to submit and call the DA code correctly?

Answer 1

This is what I use to achieve the very same thing

$(document).ready(function () {

    var submitButton = document.getElementById("registerSubmit");

    submitButton.onclick = function (event) {
        // do cool stuff before submit like validation or confirmations, whatever
        if ($(this).valid()) {
            // more cool stuff
            $("#registerForm").submit();
        }
        return false;
    };
});