将相同的Model / ViewModel传递给多个部分视图(jquery中的选项卡)

时间:2017-09-20 21:29:26

标签: jquery asp.net-mvc asp.net-mvc-partialview asp.net-mvc-viewmodel

.Net + MVC dev。

背景... 在我的lil app中我有3个表...应用程序,数据库和app_db_support表。第3个表有fks到前2个并存储关联。

想要... 通过标签式jquery表单设置添加新的应用程序和相关的dbs。

方法... 尝试在标签页中使用部分视图来分解应用程序,数据库和相关的支持信息。

Main.cshtml代码

<div id="dialog" title="Add Application" style="display: none">
    <div id="tabs">
        <ul>
            <li><a href="#application">Application</a></li>
            <li><a href="#database">Database</a></li>
        </ul>

        <div id="application">
            @Html.Partial("_AddAppForm", ... );
       </div>

        <div id="database">
            <p>DB Partial view here </p>
        </div>
    </div>
</div>

问题...... 我希望能够为所有基础模型使用ViewModel并将其传递给每个部分模型。作为控件的新手,我对如何传递ViewModel的相同实例感到迷茫,比如可以有3个模型的MyAppViewModel。由于选项卡都将与单个应用程序相关联,因此单个视图模型应该能够处理它。

替代方案...... 再次成为新的,如果有更好的方法可以解决这个问题(因此背景信息),我很乐意看看替代品,特别是如果它们更容易。 :)

提前致谢!!

1 个答案:

答案 0 :(得分:0)

以下是您可能会做的简化版本:

视图模型

namespace Project.ViewModels
{
    public class AppsViewModel
    {        
        public IEnumerable<Applicaiton> Applications { get; set; }

        public IEnumerable<Database> Databases { get; set; }
    }
}

控制器

public ActionResult Index()
{
    AppsViewModel vm = new AppsViewModel();
    using (DatabaseContext db = new DatabaseContext()){
        vm.Applications = db.Applications;
        vm.Databases = db.Databases;
    }

    return View(vm);
}

[HttpPost]
public ActionResult AddApplication(AppsViewModel model)
{
    using (DatabaseContext db = new DatabaseContext()){
        db.Applications.Add(model.Application);
        db.SaveChanges();
    }

    return RedirectToAction("Index");
}

[HttpPost]
public ActionResult AddDatabase(AppsViewModel model)
{
    using (DatabaseContext db = new DatabaseContext()){
        db.Databases.Add(model.Database);
        db.SaveChanges();
    }

    return RedirectToAction("Index");
}

查看

@model Project.AppsViewModel
<div id="dialog" title="Add Application" style="display: none">
    <div id="tabs">
        <ul>
            <li><a href="#application">Application</a></li>
            <li><a href="#database">Database</a></li>
        </ul>

        <div id="application">
            @foreach (var app in Model.Applications){
                //render your view
            }
        </div>

        <div id="database">
            @foreach (var app in Model.Databases){
                //render your view
            }
        </div>
    </div>
</div>