在asp.net mvc中的控制器中重定向后,查看内容无法正确显示

时间:2017-08-08 14:27:58

标签: asp.net-mvc razor

我在控制器中有一个动作方法,在不同语言中有两个视图。

public ActionResult Index(Guid id, string languageName)
    {
        var view = "Welcome_en";
        if (languageName == "Spanish")
            view = "Welcome_es";
        return View(view, model);
    }

默认的languageName是"英语"。(在RouteConfig.cs默认部分)。因此,在开始时,页面将加载到http://localhost:12091/Some/sssf6bda-9r5e-64d7-9bd2-63c2te616adb

我看到的视图是Welcome_en.cshtml。在该视图中,我有一个用于切换活动语言的语言的下拉菜单。我选择西班牙语然后进行ajax调用。

$("#Languages").change(function () {
            var activeLanguage= $(this).find('option:selected').val();
               $.ajax({
                      url: "/Some/Index",
                      datatype: "text",
                data: { id: '@Model.Guid', languageName: activeLanguage  },
                type: "POST",
                success: function () {
                    console.log('Success')
                }
               })

然后我看到代码再次进入控制器。要显示的视图应为Welcome_es.cshtml。

1

View_es.cshtml视图与Welcome_en.cshtml基本相同。区别在于不同语言的内容。我在Welcome_es.cshtml中设置了断点,它确实达到了。但是,最终显示的结果仍然与Welcome_en.cshtml相同。

我不确定为什么它会显示英文视图的内容,我清理了cookie但它是一样的。我也在英文页面设置了一个断点,当语言是"西班牙语"时,它没有去那里。

2 个答案:

答案 0 :(得分:0)

您当前的代码正在进行ajax调用,但未使用来自该调用的响应

您应该返回部分视图结果并使用它来更新DOM的相关部分以查看更改。您可以在ajax调用的成功事件中执行此操作

$.ajax({
    url: "/Some/Index",
    data: { id: '@Model.Guid', languageName: activeLanguage },
    type: "POST",
    success: function(response) {
        $("#someDiv").html(response);
    }
});

假设您的页面中存在ID为someDiv的div,上面的代码将使用来自您的ajax调用的响应更新该元素的内部html,该响应是由相应视图生成的html标记(根据您从客户端传递的语言名称)

我还注意到您正在为正常页面加载和ajax调用调用相同的操作方法。在那种情况下,你想用ajax调用实现什么?您只需重新加载页面即可。不需要ajax。

$(function() {

    $("#Languages").change(function() {
        var activeLanguage = $(this).val();
        window.location.href = "@Url.Action("index","Home")?languageName=" 
                                   + activeLanguage +"&id=@Guid.NewGuid()";
    });

});

如果您正在使用页面重新加载,则可能需要使用上一页中的选择选择下拉列表。您可以将Html.DropDownListFor帮助程序与页面的视图模型一起使用来解决此问题。

向视图模型添加新属性以存储所选语言。

public class YourPageViewModel
{
    // Your other existing properties goes here

    public string SelectedLanguage { set;get;}
}

现在,在您的GET操作方法中,您应该根据您的方法参数设置SelectedLanguage属性值。

public ActionResult Index(Guid id, string languageName)
{
    var view = "Welcome_en";
    if (languageName == "Spanish")
        view = "Welcome_es";

     var model = new YourPageViewModel();
     model.SelectedLanguage = languageName;

    return View(view, model);
}

现在在您看来,使用DropDownListFor辅助方法

@model YourPageViewModel
@Html.DropDownListFor(m => m.SelectedLanguage, languages,
                                                new { @class = "form-control" });

假设languagesSelectListItem的列表。将其替换为您必须呈现下拉项目的集合。

帮助程序将使用名称和标识SelectedLanguage呈现下拉列表。因此,请确保您也在javasacript中更新它。

$(function() {

    $("#SelectedLanguage").change(function() {
        var activeLanguage = $(this).val();
        window.location.href = "@Url.Action("index","Home")?languageName=" 
                                   + activeLanguage +"&id=@Guid.NewGuid()";
    });

});

答案 1 :(得分:0)

您的AJAX请求正在返回您的视图,但您没有对其执行任何操作。如果您的视图是部分视图,则可以更改AJAX调用中的成功回调,以更新HTML应替换的页面部分。

$.ajax({
  url: "/Some/Index",
  datatype: "text",
  data: { id: '@Model.Guid', languageName: activeLanguage  },
  type: "POST",
  success: function (html) {
    $('.partial').html(html);
  }
});

或者如果视图确实是一个完整的页面,那么不要使用AJAX来发出请求。