Highlight Table Row based on some Condition in ASP.NET Core

Model Class

public class Products
    {
        public int Id { get; set; }
        public string Name { get; set; }
        public int Price { get; set; }
    }

Controller Code 

public IActionResult Index()
        {
            List<Products> p1 = new List<Products>();
            p1.Add(new Products { Id = 1, Name = "Samsung", Price = 50 });
            p1.Add(new Products { Id = 2, Name = "Samsung1", Price = 50 });
            p1.Add(new Products { Id = 3, Name = "Samsung2", Price = 150 });
            p1.Add(new Products { Id = 4, Name = "Samsung3", Price = 150 });
            p1.Add(new Products { Id = 5, Name = "Samsung4", Price = 550 });
            p1.Add(new Products { Id = 6, Name = "Samsung5", Price = 550 });
            return View(p1);
        }

View Section

@model IEnumerable<TestingApplication.Models.Products>

@{
    ViewData["Title"] = "Index";
}

<h2>Index</h2>

<p>
    <a asp-action="Create">Create New</a>
</p>
<table class="table">
    <thead>
        <tr>
            <th>
                @Html.DisplayNameFor(model => model.Id)
            </th>
            <th>
                @Html.DisplayNameFor(model => model.Name)
            </th>
            <th>
                @Html.DisplayNameFor(model => model.Price)
            </th>
            <th></th>
        </tr>
    </thead>
    <tbody>
        @foreach (var item in Model)
        {
            @if (item.Price > 0 && item.Price < 100)
            {
                <tr class="label-success">
                    <td>

                        @Html.DisplayFor(modelItem => item.Id)
                    </td>
                    <td>
                        @Html.DisplayFor(modelItem => item.Name)
                    </td>
                    <td>
                        @Html.DisplayFor(modelItem => item.Price)
                    </td>
                    <td>
                        @Html.ActionLink("Edit", "Edit", new { /* id=item.PrimaryKey */ }) |
                        @Html.ActionLink("Details", "Details", new { /* id=item.PrimaryKey */ }) |
                        @Html.ActionLink("Delete", "Delete", new { /* id=item.PrimaryKey */ })
                    </td>
                </tr>
            }
            @if (item.Price > 100 && item.Price < 200)
            {
                <tr class="label-warning">
                    <td>

                        @Html.DisplayFor(modelItem => item.Id)
                    </td>
                    <td>
                        @Html.DisplayFor(modelItem => item.Name)
                    </td>
                    <td>
                        @Html.DisplayFor(modelItem => item.Price)
                    </td>
                    <td>
                        @Html.ActionLink("Edit", "Edit", new { /* id=item.PrimaryKey */ }) |
                        @Html.ActionLink("Details", "Details", new { /* id=item.PrimaryKey */ }) |
                        @Html.ActionLink("Delete", "Delete", new { /* id=item.PrimaryKey */ })
                    </td>
                </tr>
            }
            @if (item.Price > 150 && item.Price < 600)
            {
                <tr class="label-primary">
                    <td>

                        @Html.DisplayFor(modelItem => item.Id)
                    </td>
                    <td>
                        @Html.DisplayFor(modelItem => item.Name)
                    </td>
                    <td>
                        @Html.DisplayFor(modelItem => item.Price)
                    </td>
                    <td>
                        @Html.ActionLink("Edit", "Edit", new { /* id=item.PrimaryKey */ }) |
                        @Html.ActionLink("Details", "Details", new { /* id=item.PrimaryKey */ }) |
                        @Html.ActionLink("Delete", "Delete", new { /* id=item.PrimaryKey */ })
                    </td>
                </tr>
            }
        }
    </tbody>
</table>



Implement TreeView in ASP.NET CORE

models


 public class City
    {
        public int Id { get; set; }
        public string Name { get; set; }
        public int StateId { get; set; }
        public virtual State State { get; set; }
    }

 public class State
    {
        public int Id { get; set; }
        public string Title { get; set; }
        public virtual List<City> City { get; set; }
    }

 public class TreeViewNode
    {
        public string id { get; set; }
        public string parent { get; set; }
        public string text { get; set; }
    }

 Controller Code

 [HttpGet]
 public IActionResult Index()
        {
            List<TreeViewNode> nodes = new List<TreeViewNode>();         

            //Loop and add the Parent Nodes.
            foreach (State type in _context.State)
            {
                nodes.Add(new TreeViewNode { id = type.Id.ToString(), parent = "#", text = type.Title });
            }

            //Loop and add the Child Nodes.
            foreach (City subType in _context.City)
            {
                nodes.Add(new TreeViewNode { id = subType.StateId.ToString() + "-" + subType.Id.ToString(), parent = subType.StateId.ToString(), text = subType.Name });
            }

            //Serialize to JSON string.
            ViewBag.Json = JsonConvert.SerializeObject(nodes);
            return View();
        }

[HttpPost]
        public ActionResult Index(string selectedItems)
        {
            List<TreeViewNode> items = JsonConvert.DeserializeObject<List<TreeViewNode>>(selectedItems);
            return RedirectToAction("Index");
        }

cshtml file 


<div id="jstree">
</div>
@using (Html.BeginForm("Index", "Home", FormMethod.Post))
{
    <input type="hidden" name="selectedItems" id="selectedItems" />
    <input type="submit" value="Submit" />
}
@section scripts{
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jstree/3.2.1/themes/default/style.min.css" />
    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.12.1/jquery.min.js"></script>
    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jstree/3.2.1/jstree.min.js"></script>
    <script type="text/javascript">
        $(function () {
            $('#jstree').on('changed.jstree', function (e, data) {
                var i, j;
                var postedItems = [];
                for(i = 0, j = data.selected.length; i < j; i++) {

                    //Fetch the Id.
                    var id = data.selected[i];

                    //Remove the ParentId.
                    if(id.indexOf('-') != -1){
                        id = id.split("-")[1];
                    }

                    //Add the Node to the JSON Array.
                    postedItems.push({
                        text: data.instance.get_node(data.selected[i]).text,
                        id: id,
                        parent: data.node.parents[0]
                    });
                }

                //Serialize the JSON Array and save in HiddenField.
                $('#selectedItems').val(JSON.stringify(postedItems));
            }).jstree({
                "core": {
                    "themes": {
                        "variant": "large"
                    },
                    "data": @Html.Raw(ViewBag.Json)
                    },
                "checkbox": {
                    "keep_selected_style": false
                },
                "plugins": ["wholerow", "checkbox"],
            });
        });
    </script>
}

Save and Display Binary Images from Database in DataGridView in Windows Forms

In this article, I am going to show you, How to show images in DataGridView in Windows forms c#. Its easy to bind the DataGridView with the database table which is contain binary image. You can check this code to bind the DataGridView with the image using Entity Framework.


using System;
using System.IO;
using System.Linq;
using System.Windows.Forms;

namespace BankingApplication_Tutorial
{
    public partial class Form4 : Form
    {
        public Form4()
        {
            InitializeComponent();
        }

        private void Form4_Load(object sender, EventArgs e)
        {
            dataGridView1.AutoGenerateColumns = false;
            dataGridView1.ColumnCount = 2;
            dataGridView1.Columns[0].Name = "Id";
            dataGridView1.Columns[0].HeaderText = "Image Id";
            dataGridView1.Columns[0].DataPropertyName = "Id";

            dataGridView1.Columns[1].Name = "Name";
            dataGridView1.Columns[1].HeaderText = "Name";
            dataGridView1.Columns[1].DataPropertyName = "Name";

            DataGridViewImageColumn Imagecolumn = new DataGridViewImageColumn();
            Imagecolumn.Name = "Data Image";
            Imagecolumn.DataPropertyName = "Data";
            Imagecolumn.HeaderText = "Image Show";
            Imagecolumn.ImageLayout = DataGridViewImageCellLayout.Normal;
            dataGridView1.Columns.Insert(2, Imagecolumn);
            dataGridView1.RowTemplate.Height = 100;
            dataGridView1.Columns[2].Width = 100;
            this.bindDataGridView();





        }

        private void bindDataGridView()
        {
            // throw new NotImplementedException();
            banking_dbEntities1 dbe = new banking_dbEntities1();
            var items = dbe.DataGridImages.ToList();
            dataGridView1.DataSource = items;
        }

        private void button1_Click(object sender, EventArgs e)
        {
            banking_dbEntities1 dbe = new banking_dbEntities1();
            using (OpenFileDialog dialog =  new OpenFileDialog())
            {
                if (dialog.ShowDialog() == DialogResult.OK)
                {
                    string filename = dialog.FileName;
                    byte[] bytes = File.ReadAllBytes(filename);
                 
           
            DataGridImage img = new DataGridImage();
                    img.Name = Path.GetFileName(filename);
                    img.Data = bytes;
                    dbe.DataGridImages.Add(img);
                    dbe.SaveChanges();
                     
                     
                     
                        }

            }
            bindDataGridView();
        }
    }
}

Step By Step Guide to use WebAPI in ASP.NET CORE WebApplication

If you have to completed your WebAPI then must to know , how to use it in web application.  Now , you can see , how to use WebAPI in WebApplication.

WEBAPI Project
Step-1 :   Create Model first
public class Student
    {
        public int Id { get; set; }
        public string Name { get; set; }
    }

Step-2 :  Create Data Context Class

public class Context : DbContext
    {
        public Context(DbContextOptions<Context> options) : base(options)
        {

        }
        public DbSet<Student> Students { get; set; }

    }

Step-3 :  Add Connection String into your Application Setting File

{
  "ConnectionStrings": {
    "DefaultConnection": "Server=(localdb)\\mssqllocaldb;Database=aspnet-WebApplication1-6550C064-027F-4939-822B-5B4620D08657;Trusted_Connection=True;MultipleActiveResultSets=true"
  },
  "Logging": {
    "IncludeScopes": false,
    "LogLevel": {
      "Default": "Warning"
    }
  }
}

Step-4 :  Add Connection String in Startup file

  services.AddDbContext<ApplicationDbContext>(options =>
                options.UseSqlServer(Configuration.GetConnectionString("DefaultConnection")));


Step-5 Do Migration 
Step-6 :  Create Controller 

namespace WebApiTestApplication.Controllers
{
    [Route("api/[controller]")]
    public class StudentController : Controller
    {
        private Context _context;
        public StudentController(Context context)
        {
            _context = context;
        }
        [HttpGet]
        public List<Student> Get()
        {
            return _context.Students.ToList();
        }

        public IActionResult Index()
        {
            return View();
        }
    }}

Step- 7: Add new project Web Application in the same solution
Step-8 : Add Helper Class  also add View Model class

namespace WebApplication1.Helper
{
    public class StudentAPI
    {
        public HttpClient Initial()
        {
            var Client = new HttpClient();
            Client.BaseAddress = new Uri("http://localhost:56562/");
            return Client;
        }
    }

}

If you Know what is "56562" then must to watch the video

And the model class

namespace WebApiTestApplication.Models
{
    public class Student
    {
        public int Id { get; set; }
        public string Name { get; set; }
    }
}

Step-9 :  Add A controller

namespace WebApplication1.Controllers
{
    public class HomeController : Controller
    {
        StudentAPI _api = new StudentAPI();

        public async Task<IActionResult> Index()
        {
            List<Student> student = new List<Student>();
            HttpClient client = _api.Initial();
            HttpResponseMessage res = await client.GetAsync("api/Student");
            if (res.IsSuccessStatusCode)
            {
                var result = res.Content.ReadAsStringAsync().Result;
                student = JsonConvert.DeserializeObject<List<Student>>(result);
            }
         
            return View(student);
        }


    }
}

Step-10  : Generate View as list type 

@model IEnumerable<WebApiTestApplication.Models.Student>

@{
    ViewData["Title"] = "Index";
}

<h2>Index</h2>

<p>
    <a asp-action="Create">Create New</a>
</p>
<table class="table">
    <thead>
        <tr>
                <th>
                    @Html.DisplayNameFor(model => model.Id)
                </th>
                <th>
                    @Html.DisplayNameFor(model => model.Name)
                </th>
            <th></th>
        </tr>
    </thead>
    <tbody>
@foreach (var item in Model) {
        <tr>
            <td>
                @Html.DisplayFor(modelItem => item.Id)
            </td>
            <td>
                @Html.DisplayFor(modelItem => item.Name)
            </td>
            <td>
                @Html.ActionLink("Edit", "Edit", new { /* id=item.PrimaryKey */ }) |
                @Html.ActionLink("Details", "Details", new { /* id=item.PrimaryKey */ }) |
                @Html.ActionLink("Delete", "Delete", new { /* id=item.PrimaryKey */ })
            </td>
        </tr>
}
    </tbody>
</table>



Dynamically Add or remove control in asp.net core using JavaScript

If you want to add some controls on your web browser, i mean to say if you want to add controls on run time then you can easily dome with any script control, without using c# code. So, here i used Java Script code to add controls on a page. And your code is

Index.cshtml

<form method="post">
    <div id="firstdiv">
        <input type="text" name="testinput" />
                <input type="button" value="add dynamic" onclick="DynamicText()"/>

            </div>
            <input type="submit" value="submit"/>
</form>

JS----file

function DynamicText() {
    var division = document.createElement('DIV');
    division.innerHTML = DynamictextBox("");
    document.getElementById("firstdiv").appendChild(division);
}
function DynamictextBox(value) {
    return '<div><input type="text" name="dyntxt" /><input type="button" onclick="ReTextBox(this)" value="Remove"/></div>';
}
function ReTextBox(div) {
    document.getElementById("firstdiv").removeChild(div.parentNode.parentNode);
}


If you want to use this code , learn :

How to Customize ViewImport.cshtml in ASP.NET CORE



Required to add or remove information of Tag Helper. I mean to say that If you want to use Tag helper into your application then must to use ViewImports.cshtml file.

ASP.NET CORE : How to Override the attribute in TagHelper

When you design custom tag Helper then you need to change the name of attribute. I mean to say that need to override the name of attribute. In C#, You can use annotation or you can say property. In square bracket simply type HtmlAttributeName property just before the class property. You can check  the video , if you want to do this