MVC 3 Razor - Ajax.BeginForm OnSuccess

Question

I\'m new to MVC and I\'m trying to update my page after I submit my form; but it\'s not working. I\'m only trying to hide the form, and show the contents of a div OnSuccess

Answer 1

Are you sure you have all the correct js files referenced in your project? In MVC3, they have moved away from the MS Ajax files. If I remember right - the unobtrusive javascript should be enabled by default, so you should reference the following files: jquery.js, jquery.validate.js, jquery.valudate.unobtrusive.js, jquery.unobtrusive-ajax.js

With these files references - you should be fine.

P.S. There's a very good blog post by Brad Wilson explaining the details of unobtrusive ajax in MVC3, and how it all works. Check it out here: http://bradwilson.typepad.com/blog/2010/10/mvc3-unobtrusive-ajax.html

Answer 2

Make sure you can get to your action method. Also add a failure handler and see if its returning a failure too.

The unobtrusive features must be enabled too, and you must add in the MVC unobtrusive AJAX scripts for MVC 3 and razor.

HTH.

Answer 3

You could use JQuery trigger

$("#confirmation").trigger('click');

Because you have a onclick method on the div

Answer 4

Not working is a problem description that's more adapted to people that don't know/care about how computer works and not software developers. Software developers usually describe precisely the problem they are having. They post the exact error message/exception stack trace they are having.

This being said you are asking for alternative solutions, here's mine: don't use any MS Ajax.* helpers, use jquery directly and unobtrusively, like this

<script type="text/javascript">
    $(function () {
        $('#confirmation').hide();
        $('form').submit(function() {
            $('#confirmation').show('slow');
            $(this).hide('slow');
            return false;
        });
    });
</script>

@using (Html.BeginForm())
{
    <fieldset id="contactForm">
        <legend>Message</legend>
        <p>
            @Html.Label("Email", "Email"): 
            @Html.TextBox("Email")
        </p>
        <p>
            @Html.Label("Subject", "Subject"): 
            @Html.TextBox("Subject")
        </p>
        <p>
            @Html.Label("Message", "Message"): 
            @Html.TextArea("Message")
        </p>
        <p>
            <input type="submit" value="Send" />
        </p>
    </fieldset>
}

<p id="confirmation">
    Thanks!!!
</p>

Notice how the confirmation paragraph has been externalized from the form.