Posts

Donate

ASP.NET Core MVC CRUD Using Entity Framework Core, Bootstrap 4 and SQL Server

Image
Hello and Good Day! This article demonstrates on how to create an ASP.NET Core MVC application using Entity Framework Core Database First, Bootstrap 4, SQL Server, Unit Of Work And Repository Design Pattern. The IDE for this project is Visual Studio 2019 version 16.9.2. I also installed the Font Awesome icons since glyphicons are not supported in Bootstrap 4 and applied the Model Validation technique for checking of input data during submission of a form. I. Project Setup 1. Create an ASP.NET Core MVC application targetting .NET Core 3.1 or perhaps .NET 5.0 if you have it installed in your machine. 2. The project structure is composed of several folders such as Controllers, Data Access, Models and Views. For Data Access, add two more subfolders called Repository and UnitOfWork. We will need to segregate the interface and classes for the Data Access Layer. For the purpose of this tutorial, I did not add several class libraries in order keep this simple and straightforward. 3. A

@Html.ValidationMessageFor Will Always Show Or Display Error Message On Page Load In ASP.NET MVC

Image
Good afternoon! Given that you have a HTML form loaded on a page or partial view that utilize the jQuery Unobtrusive Validation that requires the user to input a note before submitting a form. However, upon running the page or partial view, the error message will always show or appear even without user interaction on page load. @model Portal.Models.JobTicketNote @{ Layout = ""; } <script src= "~/Scripts/jquery.validate.js" ></script> <script src= "~/Scripts/jquery.validate.unobtrusive.js" ></script> @using (Ajax.BeginForm("ManageJobTicketNote", "GGSDashboard", new AjaxOptions { InsertionMode = InsertionMode.Replace, UpdateTargetId = "JobTicketNotesTable" }, new { @id = "frmManageJobTicket" })) { @Html.AntiForgeryToken() @Html.HiddenFor(m => m.DataID) @Html.HiddenFor(m => m.ButtonActivity) if (Model.ButtonActivity.Equals("Edit",

How To Install Or Add Icons In ASP.NET Core MVC Pages Using Font Awesome

Image
This post illustrates on how to install or add icons to your ASP.NET Core MVC website pages using Font Awesome. If you added Bootstrap 4.x to your project, you might noticed that when you typed glyphicon in a class attribute of an html element, the intellisense does'nt show the glyphicons from Bootstrap 3.x. It's because Bootstrap 4.x does not support glyphicons anymore but instead encourage us to use Font Awesome. Given that you have already created your ASP.NET Core MVC project, the next thing to do is install via Libman the Font Awesome library. When installed, this will be mapped to your wwwroot folder. In Layout.cshtml page, reference these three files specifically fontawesome.css, regular.min.css and solid.min.css. In that way, Font Awesome is accessible globally in your project. <link rel= "stylesheet" href= "~/lib/font-awesome/css/fontawesome.css" /> <link rel= "stylesheet" href= "~/lib/Font-Awesome/css/regular.min.css&

TypeScript Bug Or Error: tsc.ps1 cannot be loaded. tsc.ps1 is not digitally signed

Image
Hello, Another error that I encountered when running TypeScript programs is "tsc : File C:\Users\gregorye\AppData\Roaming\npm\tsc.ps1 cannot be loaded. The file C:\Users\gregorye\AppData\Roaming\npm\tsc.ps1 is not digitally signed. You cannot run this script on the current system." . The full description of the bug is presented below. tsc : File C:\Users\gregorye\AppData\Roaming\npm\tsc.ps1 cannot be loaded. The file C:\Users\gregorye\AppData\Roaming\npm\tsc.ps1 is not digitally signed. You cannot run this script on the current system. For more information about running scripts and setting execution policy, see about_Execution_Policies at https:/go.microsoft.com/fwlink/?LinkID=135170. At line:1 char:1 + tsc -p d:\Greg\Typescript\Ch02\tsconfig.json + ~~~ + CategoryInfo : SecurityError: (:) [], PSSecurityException + FullyQualifiedErrorId : UnauthorizedAccess The terminal process "C:\Windows\System32\WindowsPowerShell\v1.0\powershell.exe -Command tsc -

TypeScript Error Or Bug: The term 'tsc' is not recognized as the name of a cmdlet, function, script file, or operable program.

Image
Good Day Gents! During this free-time I started setting up Node.js on my machine as part of my career goals which is learning new frameworks in preparation for new projects. So the first thing I did was to install TypeScript language to get myself familiar with Angular 2+. After I finished setting up TypeScript, I then created a simple HelloWorld program and ran the application through Visual Studio Code using the "tsc: build - tsconfig.json" command. I encountered an error which says "The term 'tsc' is not recognized as the name of a cmdlet, function, script file, or operable program. Check the spelling of the name, or if a path was included, verify that the path is correct and try again." Below are the details on my machine and packages installed:   - Operating System: Windows 10 Pro   - Node.js: 14.16.0   - npm version: 6.14.11   - Typescript: 4.2.3 (using command: "npm install -g typescript") After doing some research and reading thr

ASP.NET Core MVC Model Validation Using Data Annotation Attributes And Bootstrap 4

Image
Hi All! In this post, I'll demonstrate how to perform a model validation to a form in ASP.NET Core 3.1 MVC using Data Annotation Attributes and Bootstrap 4+ with reference to jQuery unobtrusive validation scripts to show error on the page. This concept has been applied since the early days of ASP.NET until it's recent release of .NET 5. I have applied this solution to some of the projects I've worked either ASP.NET MVC 4 or ASP.NET MVC 5. Enough talk and let's get down to business by applying this topic in a ASP.NET Core 3.1 project. First is to create an ASP.NET Core 3.1 MVC project using Visual Studio 2019 and add Bootstrap 4.0 package via NuGet as this will be used to style our form. In our Models folder, add an Employee class that contains common properties to describe an employee such as ID, Name and related data. Most of the properties are decorated with DataAnnotations attribute except for the Dependents since I'm only using a boolean value for that. pu

Donate