Monday, October 7, 2019

Display and Sort Data from Sql-Server Table in Asp.net Core (db First Approach EF-CORE) (Part-4)

Hello & As-salam u alikum ! , In this article we will learn to read data from sql server table to asp.net core view page. 
Note : For Beginner Guide Articles :

https://dotnetcorecommunity.blogspot.com/p/aspnet-core-tutorials-paracticals.html



Step# 1:  
Watch previous article if you don't know how to connect Sql-Server in asp. Net core 


Step#2 :  
Right click on Controllers folder---> add -----> Controller 
select controller and name is as "CustomController" .

 Step#3 :  
Paste the code in Custom controller ,this is an action method which will help you retrive data from sql server and two viewdata storage variable is used to manage sorting on the page.  

--------------------------------------------------------------------------------------------


 DB_SOCIALAPPContext db = new DB_SOCIALAPPContext();

        [HttpGet]
        public async Task<IActionResult> Index(string sortOrder)
        {
            ViewData["NameSortParm"] = String.IsNullOrEmpty(sortOrder) ? "name_desc" : "";
            ViewData["DateSortParm"] = sortOrder == "Date" ? "date_desc" : "Date";
            var li = from s in db.TblUser
                     select s;

            switch (sortOrder)
            {
                case "name_desc":
                    li = li.OrderByDescending(s => s.UUserName);
                    break;
                case "Date":
                    li = li.OrderBy(s => s.UAddedDate);
                    break;
                case "date_desc":
                    li = li.OrderByDescending(s => s.UAddedDate);
                    break;
                default:
                    li = li.OrderBy(s => s.UUserName);
                    break;
            }
            return View(await li.AsNoTracking().ToListAsync());
        }
-------------------------------------------------------------------------------------------------------------------
DB_SOCIALAPPContext db = new DB_SOCIALAPPContext(); 
the above line of code represents the db_context class which we had created in last article.



Step#4 :  
Right click on Index action method and Add view   


Step#5 :  
Paste the below code in view page :

--------------------------------------------------------------------------
@model IEnumerable<WebApplication7.Models.TblUser>
@{
    ViewData["Title"] = "Index";
}
    <div style="border:1px solid black;box-shadow:13px 9px 32px 2px blanchedalmond;padding:10px;">

        <a asp-action="Create" class="btn btn-primary btn-block">Create New</a>


        @if (Model == null)
        {
            <h1 style="color:red;text-align:center">No data Found</h1>

        }
        else
        {
            <table class="table table-responsive">
                <thead>
                    <tr>
                        <th>ID</th>
                        <th>Image</th>
                        <th>
                                <a asp-action="Index" asp-route-sortOrder="@ViewData["NameSortParm"]"> <span class="glyphicon glyphicon-sort"> Name</span>  </a>

                        </th>
                        <th>Email</th>
                        <th>
                            <a asp-action="Index" asp-route-sortOrder="@ViewData["DateSortParm"]"> <span class="glyphicon glyphicon-sort"> Added Date</span>  </a>

                            
                        </th>
                        <th>Is Login</th>
                        <th>Is Approved</th>

                    </tr>
                </thead>

                <tbody>

                    @foreach (var item in Model)
                    {
                        <tr>
                            <td>@item.UId</td>
                            <td><img src="~/img/@item.UProfilePicture" style="height:70px;width:70px;" /></td>
                            <td>@item.UUserName</td>
                            <td>@item.UEmail</td>
                            <td>@item.UAddedDate</td>
                            <td>@item.UIsuserlogin</td>
                            <td>@item.UIsuseraproved</td>
                        </tr>
                    }
                </tbody>

            </table>

        }

    </div>

--------------------------------------------------------------------------
Previous Lesson                                                                                                Next Lesson


1 Comments:

At October 7, 2019 at 7:30 PM , Blogger Developer mind said...

Thanks for publishing it Team!

 

Post a Comment

Do not Add Spam links in the Comment Box

Subscribe to Post Comments [Atom]

<< Home