asp.net-mvc - How to switch between view and edit views

Question

I have action method like this:

[ChildActionOnly]
        public ActionResult NewUserLanguage()
        {
            ...
            return View(model);
        }

This view have one simple form on it and a list of partial views:

<ul id="userLanguagesListBox">
                        @foreach (var l in Model.UserLanguages)
                        {                            
                            <li>
                                @{Html.RenderPartial("UserLanguageBox", l);}
                            </li>                            
                        }
...

This partial view looks like this:

...
@using (Html.BeginForm("EditUserLanguage", "UserLanguage", FormMethod.Post, new { id = "editUserLanagegeForm" }))
    {
        <ul>

            <li><h3>@Model.Language.Name</h3></li>
            <li>@Model.LanguageLevel.Name</li>    
            <li>
                @Html.HiddenFor(x=>x.UserLanguageId)
                <button class="editButton">Edit</button>
            </li>        
        </ul>
    }

What I am trying to do is when user click on edit button in any of the partials I want to switch it with another view EditUserLanguage.
I have tried something like this:

$(function () {
            $('#editUserLanagegeForm').submit(function (e) {
                alert('ss');
                $.ajax({
                    url: this.action,
                    type: this.method,
                    data: $(this).serialize(),
                    success: function (result) {
                        $("#" + e.target).closest("div").append(result);

                    }
                });

                return false;
            });
        });

But this function is never called by any of edit buttons.

Answer 1

"The submit event is sent to an element when the user is attempting to submit a form. It can only be attached to elements. Forms can be submitted either by clicking an explicit <input type="submit">, <input type="image">, or <button type="submit">, or by pressing Enter when certain form elements have focus."

-From http://api.jquery.com/submit/

What this means to you is that you need your button to have a type of submit for the submit event to trigger, but I don't think that's the one you're thinking of. Try using .click() instead.