如何在mvc 4中显示任何选定记录的详细信息

Question

我正在研究MVC应用程序并使用单一视图进行创建和编辑。成功创建记录后，它将在页面上进行渲染。 但问题是如何创建详细信息页面，还有另一个问题是在该视图上有三个选项卡第二个和第三个选项卡有jqGrid。那么如何显示jqGrid的细节。我不清楚，对于详细信息页面，有必要为详细信息页面创建新视图。我坚持在那里请提出任何建议。

提前致谢。

Answer 1

部分视图 - 良好开端

由于目前没有代码存在 - 我将使用示例类名和标记选择器。

设置数据

假设您拥有以下数据实体类：

public class DBItem
{
    [Key]
    public int DBItemID {get; set;}

    public string DBItemName {get;set;}

    public string DBItemDescription
}

在DBContext中设置如下：

public context : DbContext
{
    //STANDARD CONTEXT CODE OMITTED FOR SAKE OF BREVITY
    public DbSet<DBItem> DbItems {get;set;}
}

设置控制器

我们现在需要在您选择的控制器中设置一个动作结果 - 我们将在此示例中使用 HomeController 。

您的控制器必须从数据库中获取项目以填充局部视图：

public HomeController : Controller
{

    public ActionResult DBItemPartialView(int itemID)
    {
        DBItem model = new context().DBItems.Where(row => row.DBItemID == itemID).First();
        return PartialView(model); 
        //IF THE VIEW NAME IS NOT THE SAME AS THE ACTION NAME
        //YOU NEED TO PASS THE VIEW NAME AND THE MODEL
    }

}

设置视图

使用刚刚传递的数据填充部分视图。

<强> DBItemPartialView.cshtml：

@model yourProject.Models.DBItem


<table class="table">
    <thead>
        <tr>
            <th>#No</th>
            <th>Name</th>
            <th>Description</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td>@Model.DBItemID</td>
            <td>@Model.DBItemName</td>
            <td>@Model.DBItemDescription</td>
        </tr>
   </tbody>
</table>

使用JQuery调用您的部分视图

现在可以使用JQuery

填充部分视图的html元素

• 您无需进行完整的页面刷新。
• 即时获取新数据。

JS

$().ready(function () {
    $('body').on('click', '#myBtn', function () {

        var id = 1;

        $('#myDiv').load("/Home/DBItemPartialView", {itemID: 1});

    });
});

标记

让我们假设您使用bootstrap进行此练习：

<div class='container'>

    <!-- WHATEVER CONTENT YOU WANT -->
    <div class='row'>
        <button id='myBtn' class='btn btn-primary'>
        </button>
    </div>

    <div class='row'>
        <div id='myDiv' class='col-md-10 col-md-offset-1'>

        </div>
    </div>
</div>

希望这会有所帮助。如果您需要更具体的答案，请更具体并显示您的代码。

快乐编码