Question

所以我在这里要做的是在视图中，

当我点击按钮时，我想将foreach循环（在我的国家和城市中）生成的一些值传递给javascript函数。
在javascript函数中，我想通过将这些值（countryName，cityName）传递给控制器来打开一个对话框（局部视图）。
因此，在我的控制器中，它会将这些值传递给部分视图，该部分视图将作为对话框出现并可以提交表单。

我已经尝试过没有弹出对话框的版本（它有效），但是很难用对话框来完成它。＃3适用于btw，但我认为我遇到了＃1和＃2的问题。任何帮助，将不胜感激。感谢。

查看：

@model IEnumerable<test.Models.Employee>

<table class="table">
<tr>    
    <th>Country</th>
    <th>City</th>       
    <th></th>
</tr>

@foreach (var item in Model) { 
<tr>
    <td>
        @Html.DisplayFor(modelItem => item.Country)
    </td>       
    <td>
        @Html.DisplayFor(modelItem => item.City)
    </td>   
    <td>
        <button onclick="OpenDialog(item.Country, item.City)">
            Open Dialog
        </button>           
    </td>
</tr>
}
</table>

<div id="dialog"></div>

@section Scripts {
    @Scripts.Render("~/bundles/jqueryval")
    <script src="~/Scripts/jquery-ui-1.12.0.js"></script>

<script>
function OpenDialog(countryName, cityName) {
    $('#dialog').dialog({
        autoOpen: true,
        width: 400,
        resizable: false,
        title: 'My Table',
        modal: true,
        open: function(event, ui) {

            $(this).load('@Url.Action("getEmployee", "Employee", new
                     {
                         country = countryName,
                         city = cityName
                     })');
        },
        buttons: {
            "Close": function () {
                $(this).dialog("close");
            }
        }
    });
    }
</script>

}

控制器：

public ActionResult getEmployee(string country, string city)
    {
        var viewModel = new EmployeeViewModel()
        {
            Country = country,
            City = city
        };

        return PartialView("EmployeeDialog", viewModel);
    }

部分视图：

@model test.ViewModels.EmployeeViewModel

@using (Html.BeginForm("PostEmployee", "Employee", FormMethod.Post))
{
    @Html.AntiForgeryToken()

    @Html.HiddenFor(model => model.Country)
    @Html.HiddenFor(model => model.City)        
    @Html.EditorFor(model => model.Comments)       

    <input type="submit" value="Submit"/>          

}

Answer 1

@Url.Action()是剃刀代码，在发送到视图之前在服务器中进行解析。 countryName和cityName是javascript变量，此时甚至不存在（它们不在范围内）。将OpenDialog()功能中的代码更改为

var url = '@Url.Action("getEmployee", "Employee")';
var data = { country: countryName, city: cityName };
$(this).load(url, data);

作为旁注，每次都不需要调用服务器来返回视图中已有的值。您最初可以在对话框中呈现表单（默认为EmployeeViewModel，然后在OpenDialog中设置属性Country和City的输入值，示例$('#Country').val(countryName);

弹出一个对话框并在asp.net mvc中提交局部视图

1 个答案: