Step - 1 : Create New Project.
Go to File > New > Project > Select asp.net web forms application > Entry Application Name > Click OK.Step-2: Add a Database.
Go to Solution Explorer > Right Click on App_Data folder > Add > New item > Select SQL Server Database Under Data > Enter Database name > Add.Step-3: Create table for fetch data.
Open Database > Right Click on Table > Add New Table > Add Columns > Save > Enter table name > Ok.In this example, I have used one tables as below
Step-4: Add Entity Data Model.
Go to Solution Explorer > Right Click on Project name form Solution Explorer > Add > New item > Select ADO.net Entity Data Model under data > Enter model name > Add.A popup window will come (Entity Data Model Wizard) > Select Generate from database > Next >
Chose your data connection > select your database > next > Select tables > enter Model Namespace > Finish.
Step-5: Add a Webpage and Design for Show Data in Gridview With Merged two or more adjacent cells
Go to Solution Explorer > Right Click on Project name form Solution Explorer > Add > New item > Select web form/ web form using master page under Web > Enter page name > Add.HTML Code
- <h3>Merge adjacent cells in Gridview depanding on Cells value in ASP.NET </h3><br />
- <asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="false" CellPadding="5"
- BackColor="#ffffff" HeaderStyle-BackColor="#f3f3f3" OnDataBound="GridView1_DataBound">
- <Columns>
- <asp:BoundField HeaderText="Country" DataField="Country" />
- <asp:BoundField HeaderText="State / Zone" DataField="State" />
- <asp:BoundField HeaderText="City" DataField="City" />
- </Columns>
- </asp:GridView>
Step-6: Write following code in Page_Load event for Show data in Gridview With Merged two or more adjacent cells.
- protected void Page_Load(object sender, EventArgs e)
- {
- if (!IsPostBack)
- {
- PopulateData();
- }
- }
and here is the function...
- private void PopulateData()
- {
- // Populate Data from Server and show in Gridview
- List
allCity = new List (); using (MyDatabaseEntities dc = new MyDatabaseEntities()) { // Here order by is very required for merge gridview cell based on value in database query allCity = dc.CityMasters.OrderBy(a => a.Country).ThenBy(a => a.State).ThenBy(a => a.City).ToList(); //Here thenby is used for sort as first based on country then by state and then city GridView1.DataSource = allCity; GridView1.DataBind(); } }
Step-7: Write following code in GridView1_DataBound event for Merge gridview cells depending on its value .
Here for merge gridview cells I have used GridView1_DataBound event. This event is very suitable for this purpose as its fired after data binding complete.
- // Here this event I have used for merge cells as This event is fired after complete data binding
- protected void GridView1_DataBound(object sender, EventArgs e)
- {
- for (int rowIndex = GridView1.Rows.Count -2 ; rowIndex >= 0; rowIndex--)
- {
- GridViewRow gvRow = GridView1.Rows[rowIndex];
- GridViewRow gvNextRow = GridView1.Rows[rowIndex + 1];
- // compare cell value if found duplicate value then marge cell
- for (int cellIndex = 0; cellIndex < gvRow.Cells.Count; cellIndex++)
- {
- if (gvRow.Cells[cellIndex].Text == gvNextRow.Cells[cellIndex].Text)
- {
- if (gvNextRow.Cells[cellIndex].RowSpan < 2)
- {
- gvRow.Cells[cellIndex].RowSpan = 2;
- }
- else
- {
- gvRow.Cells[cellIndex].RowSpan = gvNextRow.Cells[cellIndex].RowSpan + 1;
- }
- gvNextRow.Cells[cellIndex].Visible = false;
- }
- }
- }
- }
No comments:
Post a Comment