Asp.net mvc 主详细视图ASP.NET MVC
我是MVC新手,我参与了一个用ASP.NET MVC 1.0开发的项目。我在JavaScript方面也很弱:-( 我试图演示Master Details视图如何在Northwind数据库中的“Orders”和“Order Details”表上工作。(因此:这些表有一个关系,即一个订单可以有多个订单详细信息) 我创建了两个控件(第一个用于订单,第二个用于订单详细信息)。我将订单表中的所有订单显示在列表视图中。单击其中一个订单后,我将进入该订单的详细信息视图 我想做的(&failed)是在订单的详细信息视图下创建一个子视图,该视图包含该订单的所有订单详细信息 我还想根据主视图中的选择更改子视图的内容。我读了很多关于使用AJAX和JSON动态更改内容的文章,但我也没有做到:(Asp.net mvc 主详细视图ASP.NET MVC,asp.net-mvc,view,master-detail,Asp.net Mvc,View,Master Detail,我是MVC新手,我参与了一个用ASP.NET MVC 1.0开发的项目。我在JavaScript方面也很弱:-( 我试图演示Master Details视图如何在Northwind数据库中的“Orders”和“Order Details”表上工作。(因此:这些表有一个关系,即一个订单可以有多个订单详细信息) 我创建了两个控件(第一个用于订单,第二个用于订单详细信息)。我将订单表中的所有订单显示在列表视图中。单击其中一个订单后,我将进入该订单的详细信息视图 我想做的(&failed)是在订单的详细
任何人都可以在这方面提供帮助,并向我提供如何实现它的技术和代码。使用MVC和jQuery,您可以非常轻松地做到这一点 首先在您的
Orders\List.aspx
视图中:
<script>
// once the page has loaded
$(function() {
// set up your click event to load data
$('.list-item').click(function() {
// ajax load the content returned by the detail action
$('#detail').load('<%= Url.Action("Detail") %>', { id: this.id } );
});
});
</script>
<style> .list-item { cursor: pointer; } </style>
<% // loop through the orders in your model and show them
// as each div has the class list-item it will be give the click event
foreach( var order in Model ) { %>
<div id="<%= order.Id %>" class="list-item"><%= order.Name %></div>
<% } %>
<%-- the panel that the ajaxed content will be loaded into --%>
<div id="detail"></div>
退房
Id: <%= Model.Id %><br />
Name: <%= Model.Name %><br />
Description: <%= Model.Description %><br />
etc