I want to show Components in a tabs , so first of all create few components. In this project we have three components, First View Component public class AllViewComponent : ViewComponent { private readonly UserManager<ApplicationUser> _userManager; public AllViewComponent(UserManager<ApplicationUser> userManager) { _userManager = userManager; } public async Task<IViewComponentResult> InvokeAsync() { List<StudentViewModel> allUsers = new List<StudentViewModel>(); var items = await _userManager.Users.ToListAsync(); foreach (var item in items) { allUsers.Add(new StudentViewModel {Id=item.Id, EnrollmentNo = item.EnrollmentNo, FatherName = item.FatherName, Name = item.Name, Age = item.Age, Birthdate = item.Birthdate, Address = item.Address, Gender = item.Gender, Email = item.Email }); }
Before we talk about nested gridview asp.net c#. First we talk about gridview control. It is a data source control through which we can bind data in the form of table. In this article, we will take two gridview asp.net controls and we will arrange both control in this way, please see the mentioned picture.
Lets to start how to design it
- First to add asp.net gridview in the source page
- Add a <Columns> tag inside it.
- Add single column inside it using TemplateField with HeaderText property, if you want to add more than one column then add equal number of TemplateField inside it.
- Show the data in the browser with the help of ItemTemplate, so add it inside Template Field.
- Now, the article's main point is here, Add another gridview asp.net controls inside the ItemTemplate, Now your code look like:
<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="false"> <Columns> <asp:TemplateField HeaderText="Subject Marks"> <ItemTemplate> <asp:GridView ID="GridView2" runat="server" AutoGenerateColumns="false"> </asp:GridView> </ItemTemplate> </asp:TemplateField> </Columns> </asp:GridView>
- Similarly again, repeat the step 2 to 4 for second nested gridview asp.net control. Now, add three columns by using Template Field.
- Bind all columns inside the ItemTemplate field of second gridview control, Please see the full code which is mentioned below:
<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="false"> <Columns> <asp:TemplateField HeaderText="Subject Marks"> <ItemTemplate> <asp:GridView ID="GridView2" runat="server" AutoGenerateColumns="false"> <Columns> <asp:TemplateField HeaderText="Hindi"> <ItemTemplate> <asp:Label ID="hindilabel" runat="server" Text='<%# Eval("hindi") %>'></asp:Label> </ItemTemplate> </asp:TemplateField> <asp:TemplateField HeaderText="Maths"> <ItemTemplate> <asp:Label ID="mathslabel" runat="server" Text='<%# Eval("maths") %>'></asp:Label> </ItemTemplate> </asp:TemplateField> <asp:TemplateField HeaderText="English"> <ItemTemplate> <asp:Label ID="englishlabel" runat="server" Text='<%# Eval("English") %>'></asp:Label> </ItemTemplate> </asp:TemplateField> </Columns> </asp:GridView> </ItemTemplate> </asp:TemplateField> </Columns> </asp:GridView>
Comments
Post a Comment