connectseekers.com

Thursday, 28 August 2014

Auto Increment Row Value In Asp.net MVC WebGrid Using C#.Net

8/28/2014 - By Pranav Singh 3

This article will show you how you can add auto generated row number in an asp.net mvc webgrid. This article you can use in MVC2, MVC3, MVC4, MVC5 webgrid. This will also cover for dynamically add row number in mvc webgrid.


In this we will add a dynamic row number in below shown webgrid.


So for this article first we will create a new asp.net mvc application and add a model class file.

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;

namespace MvcApplication6.Models
{
    public class StudentModel
    {
        public List<Student> StudentList { get; set; }
    }
    public class Student
    {
        public string Name { get; set; }
        public int ClassOfStudent { get; set; }
        public string Section { get; set; }
        public string Address { get; set; }
    }
}

After adding model class file we will add a controller in our project. After adding controller we will create view for this controller action.

Controller
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;

namespace MvcApplication6.Models
{
    public class HomeController : Controller
    {
        //
        // GET: /Home/

        public ActionResult Index()
        {
            StudentModel _objstudentmodel = new StudentModel();
            _objstudentmodel.StudentList = new List<Student>();
            _objstudentmodel.StudentList.Add(new Student { Name = "Name1", ClassOfStudent = 1, Section = "B", Address = "Address1" });
            _objstudentmodel.StudentList.Add(new Student { Name = "Name2", ClassOfStudent = 3, Section = "A", Address = "Address2" });
            _objstudentmodel.StudentList.Add(new Student { Name = "Name3", ClassOfStudent = 2, Section = "C", Address = "Address3" });
            _objstudentmodel.StudentList.Add(new Student { Name = "Name4", ClassOfStudent = 5, Section = "A", Address = "Address4" });
            _objstudentmodel.StudentList.Add(new Student { Name = "Name5", ClassOfStudent = 8, Section = "B", Address = "Address5" });
            return View(_objstudentmodel);
        }
    }
}

Here in above code I have added some value to student  list to display in webgrid.

View
@model  MvcApplication6.Models.StudentModel
@{
    ViewBag.Title = "Auto Increment Row Value In Asp.net MVC WebGrid Using C#.Net";
}
    <style type="text/css">
        table
        {
            font-family: verdana,arial,sans-serif;
            font-size: 11px;
            color: #333333;
            border-width: 1px;
            border-color: #666666;
            border-collapse: collapse;
        }
        table th
        {
            border-width: 1px;
            padding: 8px;
            border-style: solid;
            border-color: #666666;
            background-color: #dedede;
        }
        table td
        {
            border-width: 1px;
            padding: 8px;
            border-style: solid;
            border-color: #666666;
            background-color: #ffffff;
        }
    </style>
    @using (Html.BeginForm("Index", "Home"))
    {
        var grid = new WebGrid(Model.StudentList, canSort: false, canPage: false);
        //---This variable is used for creating dynamic row value----
        int rowVal = 0;
        <div>
            @grid.GetHtml(columns:
            grid.Columns
            (
                 grid.Column("Sr.No.", format: item => rowVal = rowVal + 1),
                 grid.Column("Name", "Stud Name"),
                 grid.Column("ClassOfStudent", "Class"),
                 grid.Column("Section", "Section"),
                 grid.Column("Address", "Address")

                ), mode: WebGridPagerModes.Numeric)
        </div>
    }

In above please check the grid.Column("Sr.No.", format: item => rowVal = rowVal + 1) line of code. In this I first I have declared a integer variable and then added to the webgrid column incremented by 1. This will responsible for creating dynamic now number.

Now run the application to check the output.



DOWNLOAD

About the Author

We are the group of people who are expertise in different Microsoft technology like Asp.Net,MVC,C#.Net,VB.Net,Windows Application,WPF,jQuery,Javascript,HTML. This blog is designed to share the knowledge.

Get Updates

Subscribe to our e-mail newsletter to receive updates.

Share This Post

3 comments:

  1. very helpful... especially the "rowVal" part which allows you for example to assign a unique DropDownList to each row

    ReplyDelete
    Replies
    1. Thanks for your valuable comment.

      Delete
  2. It works perfect if there is only one page ,but when multiple pages are there it starts indexing form 1 in next page.which should't happen.

    ReplyDelete

Please let me know your view

Free Ebooks


About Us

We are the group of people who are expertise in different Microsoft technology like Asp.Net,MVC,C#.Net,VB.Net,Windows Application,WPF,jQuery,Javascript,HTML. This blog is designed to share the knowledge.

Contact Us

For writing article in this website please send request by your

GMAIL ID: dotnetpools@gmail.com
Email Id : contact@aspdotnet-pools.com

Bugs and Suggestions

As we all know that this website is for sharing knowledge and providing proper solution. So while reading the article is you find any bug or if you have any suggestion please mail us at contact@aspdotnet-pools.com.

Partners


Top jQuery Plugins

Global Classified : Connectseekers.com
© 2014
back to top