重定向到 Jquery 中的 Action-Controller MVC 4

Question

我需要一些帮助，因为我对 AJAX 很陌生。在我拥有的给定页面（视图）中，我显示了一个显示表单的按钮。我最终想要的是将该表单中的数据输入传递给我的应用程序内的控制器。我知道有很多关于如何做到这一点的教程......但是，我似乎很难理解这是如何做到的；因此，我想一步一步地遍历这个。我只是想在用户单击对话框上的“保存”按钮后显示不同的视图。我希望这很清楚。这是我的 HTML + jQuery

@model AccommodationEditViewModel

@{
    ViewBag.Title = "Edit";
    Layout = "~/Views/Shared/_Layout.cshtml";
}

<table>
    <tr>
        <td>
        @Html.ActionLink("Back to list", "List", "Accommodation")
        </td>
    </tr>
    <tr>
        <td>    
            @if ( Model.Accommodation.LocaleID != Guid.Empty)
            {
                @Html.DisplayAccommodation(IAccommodationDisplay);
            }
        </td>
    </tr> 
</table>

<div class="genericform">
<form id="form" method="post">

    @Html.AccommodationEditDisplay()
<table>
    <tr>
        <td>
            @Html.ActionLink("Add New Address", "", "", new { id = "addaddresses" }, null)
        </td>
    </tr>
    @if (Model != null && Model.Accommodation.Addresses.Count() == 0)
    {
        <tr>
            <td>
                This Locale Contains No Addresses
            </td>
        </tr>
    }
    else
    {
        foreach (Address address in Model.Accommodation.Addresses)
        { 
            <tr>
                <td>
                    @address.Address1
                </td>
            </tr>
        }
    }
</table>
<br /> <br />
<input type="submit" name="command" value="Save"  />
<input type="submit" name="command" value="Delete" />
</form>
</div>

<button id="opener">Add Address</button>

<div id="dialog" title="Add Address" style="display:none;">
<label for="Address1">Address: </label><input id="Address1" />
<label for="Address2">Address 2: </label><input id="Address2" /> 
<label for="City">City: </label><input id="City" />
<label for="State">State: </label><input id="State" />
<label for="PostalCode">Postal Code: </label><input id="PostalCode" />
</div>

<script type="text/javascript" src="~/Scripts/jquery-1.7.1.js"></script>
<script type="text/javascript" src="~/Scripts/jquery-ui-1.8.20.js"></script>
<link type="text/css" href="~/Content/themes/base/jquery.ui.all.css" rel="stylesheet"  />

<script type="text/javascript">    
$(document).ready(function () {
        $("#dialog").dialog({
            autoOpen: false,
            show: {
                effect: "explode",
                duration: 250
            },
            hide: {
                effect: "explode",
                duration: 250
            },
            buttons: {
                "Save": {
                    text: "Save",
                    class: "",
                    click: function () {
                         //**redirect here**
                        $(this).dialog("close");

                    }},
                "Cancel": {
                    text: "Cancel",
                    class: "",
                    click: function () {
                    $(this).dialog("close");
                }
            }},
            modal: true
        });

        $("#opener").click(function () {
            $("#dialog").dialog("open");
        });
    });
</script>

我尝试使用 $.ajax({}) 并设置：Url: "/Areas/Website/Controller/Action 但是脚本在那时停止工作。 任何和所有的帮助表示赞赏！谢谢！

编辑

我什至需要使用 AJAX 吗？我只想将该表单中的信息（在对话框内）传递给控制器​​。

Answer 1

好的，尝试用

替换您的 <form id="form" method="post"> form fields </form>

@using (Html.BeginForm("NameOfControllerMethod", "NameOfControllerClass")) 
{
<!-- fields for gathering data, your input fields essentially -->
}

那么您需要转到您的控制器类，并在您的控制器方法上方添加 [HttpPost]，如下所示：

[HttpPost]
public ActionResult MethodName(AccomodationEditViewModel viewModel) {
//do stuff in here with the viewModel, for example viewModel.Location, or viewModel.Name
}

注意 [HttpPost] 要求您在控制器类的顶部添加一个新的“使用”插入。

NameOfControllerMethod 是上面有 HttpPost 的方法。控制器类的名称类似于“MyClass”，来自名为 MyClassController 的控制器，例如。

Answer 2

试试这个：

window.location = "/Areas/Website/Controller/Action";

在您的点击函数中。