如何在MVC 5中显示同一视图的列表和详细信息 [英] How to display List and Details on the same view in MVC 5

查看:80
本文介绍了如何在MVC 5中显示同一视图的列表和详细信息的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

Hello Everyone,



我希望能够在同一视图上显示List和详细信息,我使用的是一个结合了两个视图属性的viewmodel / models,我正在使用制表符控件,我希望能够在第一个选项卡上显示详细视图,并在第二个选项卡上列出和列出。我试过这个:



  var  detailsList =(来自 c   db.Customers 
join db.Addresses c.ClientId上的
等于a.CustomerId

其中 c.RowId == id
select new ManageViewModel
{
ClientType = c.ClientType,
ClientId = c.ClientId,
Email = c.Email,

})。FirstOrDefault();

var model = new DetailsListViewModel();
if (detailsList!= null
{
model。 Customer = new Customer {ClientType = detailsList.ClientType};
model.Customer = new 客户{ClientId = detailsList.ClientId};
model.Customer = new 客户{Email = detailsList.Email};

// 地址从这里开始
model.Addresses = < span class =code-keyword> new List< Address>();
model.Addresses.Add( new Address {CustomerId = detailsList.ClientId});
model.Addresses.Add( new Address {AddressLine1 = detailsList.AddressLine1});
model.Addresses.Add( new Address {AddressLine2 = detailsList.AddressLine2});

}



var ct = TempData [ ClientType] = detailsList.ClientType;
返回查看(型号);





查看客户详情:

 <   dl  < span class =code-attribute>   class   =  dl-horizo​​ntal >  
< dt >
@ Html.DisplayNameFor(model => model.Customer.ClientType)
< / dt >

< dd > ;
@ Html.DisplayFor(model => model.Customer.ClientType)
< / dd >

< < span class =code-leadattribute> dt >
@ Html.DisplayNameFor(model => model.Customer.ClientId)
< / dt >

< dd >
@ Html.DisplayFor(model => model.Customer.ClientId)
< / dd >

< dt >
@ Html.DisplayNameFor(model = > model.Customer.Email)
< / dt >

< dd < span class =code-keyword>>
@ Html.DisplayFor(model => model.Customer.Email)
< ; / dd >


< span class =code-keyword>< / dl >





查看地址:



 <  表格 >  
< tr >
< th > ClientId < / th >
< th > AddressLine1 < / th >
< th > AddressLine2 < / th >

< / tr >
@foreach(Model.Addresses中的var项)
{
< tr >
< td > @ item.CustomerId < / td >
< td > @ item.AddressLine1 < / td >
< td > @ item.AddressLine2 < / td >
< / tr >
}
< / table >





类和ViewModel:



  public   class  DetailsListViewModel 
{

public 客户客户{获取; set ; }
public 列表<地址>地址{ get ; set ; }
}

public class 客户
{

public string ClientType {获得; set ; }
public string ClientId { get ; set ; }
public string 电子邮件{ get ; set ; }
}

public class 地址
{

public string CustomerId {获得; set ; }
public string AddressLine1 { get ; set ; }
public string AddressLine2 { get ; set ; }
}





我希望能够在同一个视图上显示这个,我不知道这是怎么回事,我将不胜感激任何帮助。谢谢

解决方案

客户模型



  public   class 客户
{
public < span class =code-keyword> int Id { get ; set ; }
public string 名称{ get ; set ; }

public string 组{获得; set ; }
public string 输入{ get ; set ; }

public string 联系人{获得; set ; }

public virtual 地址{获得; set ; }
}







地址型号



  public   class 地址
{
public int ID { get ; set ; }

public string AddressLine1 {获得; set ; }
public string AddressLine2 { get ; set ; }
public string 状态{ get ; set ; }
public string 城市{ get ; set ; }

public int CustomerId {获得; set ; }
}





ViewModel加入这两个



  public   class  ViewModelClient 
{

public string 名称{ get ; set ; }

public string 组{获得; set ; }
public string 输入{ get ; set ; }

public string 联系人{获得; set ; }

public string AddressLine1 {获得; set ; }
public string AddressLine2 { get ; set ; }
public string 状态{ get ; set ; }
public string 城市{ get ; set ; }

}







控制器方法





  public  ActionResult Index( int  id)
{
ViewModelClient Cliensinfo =( from c in db.Customers
join db.Addresses on
c.Id等于a.CustomerId
其中 c.Id == id
选择 new ViewModelClient
{
Name = c.Name,
Group = c.Group,
Contact = cC ontact,
Type = c.Type,
AddressLine1 = a.AddressLine1,
AddressLine2 = a.AddressLine2,
State = a.State,
City = a。城市


})。FirstOrDefault();


return 查看(Cliensinfo);
}







和视图



  @ model  WebApplicationCodePro.Models.ViewModelClient 
@ {
ViewBag.Title = 索引;
}

< h2 > 索引< / h2 >


好的,您的模型结构将是这样的 -

  public   class  ClientDetail 
{
public int Id { get ; set ; }
public string 名称{ get ; set ; }
// 您的其他属性
}

public class AddressDetail
{
public int ID { get ; set ; }
public string AddressLine1 { get ; set ; }
// 您的其他属性
}

public class ClientViewModel
{
public ClientDetail _ClientDetail { get ; set ; }
public List< clientdetail> _ClientDetails { get ; set ; }

public ClientDetail _AddressDetail { get ; 设置; }
public 列表< addressdetail> _AddressDetails { get ; set ; }
} < / addressdetail > < / clientdetail >





现在,使用 ClientViewModel 显示两个数据,即对象和收藏。



-KR


型号



  public   class 客户
{
public string 名称{ get ; set ; }
}

public class 地址
{
public string AddressLine1 { get ; set ; }
}

public class CustomerModel
{
public 客户客户{获取; set ; }
public 列表<地址>地址{ get ; set ; }
}





控制器



  public  ActionResult Index()
{
CustomerModel model = new CustomerModel();
model.Customer = new 客户{Name = 约翰};
model.Addresses = new 列表<地址>();

model.Addresses.Add( new 地址{AddressLine1 = 123 Fake Street});
model.Addresses.Add( new 地址{AddressLine1 = 22b Baker Street});

return 查看(模型);
}





查看



  @ model  TestMvc.Models.CustomerModel 

< p >
@ Model 。 Customer.Name
< / p > ;

< table >
@ foreach var address Model.Addresses)
{
< tr >
< TD > @ address .AddressLine1 < / td >
< / tr >
}
< / table >


Hello Everyone,

I want to be able to display List and detail on the same view, i am using a viewmodel that combines the properties of the two views/models, i am using tab control, i want to be able to display detail view on the first tab and list and list on the second tab. i have tried this:

var detailsList = (from c in db.Customers
           join a in db.Addresses
               on c.ClientId equals a.CustomerId

           where c.RowId == id
           select new ManageViewModel
           {
               ClientType = c.ClientType,
               ClientId = c.ClientId,                                  
               Email = c.Email,
              
           }).FirstOrDefault();

var model = new DetailsListViewModel();
if (detailsList != null)
{
model.Customer = new Customer { ClientType = detailsList.ClientType };
model.Customer = new Customer { ClientId = detailsList.ClientId };                
model.Customer = new Customer { Email = detailsList.Email };

//Address starts here
model.Addresses = new List<Address>();               
model.Addresses.Add(new Address { CustomerId = detailsList.ClientId });
model.Addresses.Add(new Address { AddressLine1 = detailsList.AddressLine1 });
model.Addresses.Add(new Address { AddressLine2 = detailsList.AddressLine2 });

}



var ct = TempData["ClientType"] = detailsList.ClientType;
return View(model);



View for client details:

<dl class="dl-horizontal">
<dt>
@Html.DisplayNameFor(model => model.Customer.ClientType)
</dt>

<dd>
@Html.DisplayFor(model => model.Customer.ClientType)
</dd>

<dt>
@Html.DisplayNameFor(model => model.Customer.ClientId)
</dt>

<dd>
@Html.DisplayFor(model => model.Customer.ClientId)
</dd>

<dt>
@Html.DisplayNameFor(model => model.Customer.Email)
</dt>

<dd>
@Html.DisplayFor(model => model.Customer.Email)
</dd>


</dl>



View for Addresses:

<table>
<tr>
<th>ClientId</th>
<th>AddressLine1</th>
<th>AddressLine2</th>

</tr>
@foreach(var item in Model.Addresses)
{
<tr>
<td>@item.CustomerId</td>
<td>@item.AddressLine1</td>
<td>@item.AddressLine2</td>                                                      
</tr>
}
</table>



Classes and ViewModel:

public class DetailsListViewModel
{

public Customer Customer { get; set; }
public List<Address> Addresses { get; set; }
}

public class Customer
{

public string ClientType { get; set; }
public string ClientId { get; set; }
public string Email { get; set; }
}

public class Address
{

public string CustomerId { get; set; }
public string AddressLine1 { get; set; }
public string AddressLine2 { get; set; }
}



I want to be able to display this on the same view, i dont know how this can be possible, i will appreciate any assistance. thanks

解决方案

Customer Model

public class Customer
{
    public int Id { get; set; }
    public string Name { get; set; }

    public string Group { get; set; }
    public string Type { get; set; }

    public string Contact { get; set; }

    public virtual Address Address { get; set; }
}




Address Model

public class Address
{
    public int ID { get; set; }

    public string AddressLine1 { get; set; }
    public string AddressLine2 { get; set; }
    public string State { get; set; }
    public string City { get; set; }

    public int CustomerId { get; set; }
}



ViewModel By joining these two

public class ViewModelClient
{

    public string Name { get; set; }

    public string Group { get; set; }
    public string Type { get; set; }

    public string Contact { get; set; }

    public string AddressLine1 { get; set; }
    public string AddressLine2 { get; set; }
    public string State { get; set; }
    public string City { get; set; }

}




Controller Method


public ActionResult Index(int id)
{
    ViewModelClient Cliensinfo = (from c in db.Customers
                                  join a in db.Addresses on
                                  c.Id equals a.CustomerId
                                  where c.Id == id
                                  select new ViewModelClient
                                  {
                                    Name=c.Name,
                                    Group=c.Group,
                                    Contact=c.Contact,
                                    Type=c.Type,
                                    AddressLine1=a.AddressLine1,
                                    AddressLine2=a.AddressLine2,
                                    State=a.State,
                                    City=a.City


                                  }).FirstOrDefault();


    return View(Cliensinfo);
}




And The view

@model WebApplicationCodePro.Models.ViewModelClient
@{
    ViewBag.Title = "Index";
}

<h2>Index</h2>


Okay, your model structure would be something like this-

public class ClientDetail
{
    public int Id { get; set; }
    public string Name { get; set; }
    // your other properties
}

public class AddressDetail
{
    public int Id { get; set; }
    public string AddressLine1 { get; set; }
    // your other properties
}

public class ClientViewModel
{
    public ClientDetail _ClientDetail { get;set; }
    public List<clientdetail> _ClientDetails { get; set; }

    public ClientDetail _AddressDetail { get;set; }
    public List<addressdetail> _AddressDetails { get; set; }
}</addressdetail></clientdetail>



Now, use the ClientViewModel for displaying both the data, i.e object and collection.

-KR


Model

public class Customer
{
    public string Name { get; set; }
}

public class Address
{
    public string AddressLine1{ get; set; }
}

public class CustomerModel
{
    public Customer Customer { get; set; }
    public List<Address> Addresses { get; set; }
}



Controller

public ActionResult Index()
{
    CustomerModel model = new CustomerModel();
    model.Customer = new Customer { Name = "John" };
    model.Addresses = new List<Address>();

    model.Addresses.Add(new Address { AddressLine1 = "123 Fake Street" });
    model.Addresses.Add(new Address { AddressLine1 = "22b Baker Street" });

    return View(model);
}



View

@model TestMvc.Models.CustomerModel

<p>
    @Model.Customer.Name
</p>

<table>
    @foreach(var address in Model.Addresses)
    { 
    <tr>
        <td>@address.AddressLine1</td>
    </tr>
    }
</table>


这篇关于如何在MVC 5中显示同一视图的列表和详细信息的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆