【问题标题】:ASP.NET MVC 4 - WebGrid. How retaining page after the EditASP.NET MVC 4 - WebGrid。编辑后如何保留页面
【发布时间】:2013-02-15 16:15:07
【问题描述】:

我在我的项目中使用 WebGrid,我已经实现了分页/编辑和删除选项。 目前,当我删除和编辑项目时,我将返回第一页。

但是,我想在同一页面返回(返回列表)。 你知道我该怎么做吗?

查看代码

    <div id="grid">

@{
    var grid = Html.Grid(Model, rowsPerPage: 20, defaultSort: "LanguageID");

  }

@grid.GetHtml(
tableStyle:"table",
alternatingRowStyle:"alternate",
selectedRowStyle:"selected",
headerStyle:"header",
columns:grid.Columns(
grid.Column(format: (item) => Html.ActionLink("Edit", "Edit", new { localizationID = item.ID, languageID = item.LanguageID })),
grid.Column("Description",header:"Language"),
grid.Column("ParameterName", header:"Parameter name"),
grid.Column("Name",header:"Original (English)", format: item => Html.Raw(item.Name)),
grid.Column("TranslationText",
header:"Translation", format: item => Html.Raw(item.TranslationText))))


</div>

控制器

public ActionResult Index()
{
    translations = _translationService.GetByCulture(valueLanguage);

    return View(translations);
}

[HttpPost]
public ActionResult Edit(Translation model)
{
    if (ModelState.IsValid)
    {
        _translationService.Update(model);
        return RedirectToAction("Index","Translation");     
    }

    retrun View(model);
}

比你。

【问题讨论】:

  • 更新数据后,只需将所有数据加载到您的编辑并返回视图
  • “加载数据”是什么意思?我还需要从我的数据库中获取数据吗?那怎么会返回页面呢?也许不清楚,例如我在 Index.chtml?page=5 和编辑后,我会返回到 Page=5 而不是在 Index 页面。
  • 在编辑操作时获取页面的值,并在重定向时将查询字符串作为 return RedirectToAction("Index","Translation",new {page=5}); 在编辑操作中传递
  • 对不起,你有例子吗?我在这里真的很新,我不知道如何管理页码。我是否必须将 HTTPGet Edit 调用中的页码作为参数传递?并且能够在 HTTPPost Edit 中检索它?
  • 我不确定这是最好的解决方案,但为了解决我的问题,我为我的索引和编辑页面创建了一个特定的视图模型。在模型中,有一个名为 int page {get;set;} 的属性作为我模型的一部分,我可以轻松找到该值。如果有人有更好的解决方案,谢谢分享。

标签: asp.net-mvc webgrid


【解决方案1】:

我遇到了同样的问题,我试过这个:

我在 ViewBag 中添加了一个参数来保存页面,并将页面值发送到编辑方法,这样当我返回时页码仍然存在。是这样的:

1) 在索引方法中你必须保存当前页面:

public ActionResult Index(string page)
{
    ViewBag.Page=page;
    translations = _translationService.GetByCulture(valueLanguage);

    return View(translations);
}

2 因此,当您单击编辑时,页面将随数据一起移动:

grid.Column(format: (item) => Html.ActionLink("Edit", "Edit", new { 
localizationID = item.ID, languageID = item.LanguageID, page=ViewBag.page })),

3 然后在控制器中将编辑方法设置为 ViewBag.page 与当前页面再次像这样:

[HttpPost]
public ActionResult Edit(Translation model, string page)
{

    ViewBag.lst = page;
    if (ModelState.IsValid)
    {
        _translationService.Update(model);
        return RedirectToAction("Index","Translation");     
    }

    retrun View(model);
}

如果您需要在其他视图中执行此操作,只需在其他控制器方法中重复编辑步骤即可。

【讨论】:

    【解决方案2】:

    这是一个较晚的答案,但它可能对某人有所帮助。

    不返回ActionResult,如果ajax调用成功,那么我们可以绑定文本框或者输入控件值到grid

    例如

    WebGrid companyGrid = new WebGrid(Model, rowsPerPage: 5, ajaxUpdateContainerId: "companyGrid");
    
       @companyGrid.GetHtml(columns: companyGrid.Columns(companyGrid.Column("CompanyID", "Company ID"),
        companyGrid.Column("CompanyName", "Company Name", format: @<text><input id="companyNameTxt" type="text" class="edit-mode" value="@item.CompanyName" /><span class="display-mode" id="companyNameLbl">@item.CompanyName</span></text>),
        companyGrid.Column("Action", format: @<text><button class="edit-user display-mode">Edit</button> <button class="save-user edit-mode">Save</button><button class="cancel-user edit-mode">Cancel</button></text>)))
    

    webgrid中,公司名称栏有2个元素,一个是companyNameTxt文本框,另一个是companyNameLblspan

    Ajax 保存按钮功能

        $('.save-user').on('click', function () {
    
            var tr = $(this).parents('tr:first');
            var companyName = tr.find("#companyNameTxt").val();
    
            var UserModel =
            {
                "ID": 1,
                "companyName": companyName,
            };
            $.ajax({
                url: '/Home/EditGrid',
                data: JSON.stringify(UserModel),
                type: 'POST',
                contentType: 'application/json; charset=utf-8',
                success: function () {
                    tr.find("#companyNameLbl").html(companyName);
                    tr.find('.edit-mode, .display-mode').toggle();
                }
            });
        });
    

    编辑后,只需将文本框值赋给标签即可。然后它将保留在同一页面中。如果结果成功,那么数据将保存到数据库中

    控制器

    public void EditGrid(int ID, string companyName)
    {
       // Code for editing
    }
    

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 2013-09-23
      • 2012-05-22
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2012-06-21
      相关资源
      最近更新 更多