.NET GENES

Hello and Good day! In this blog post I will demonstrate on how to add a select or dropdown control in Bootstrap-Table by Wenzhixin with an OnChange() event in ASP.NET Core MVC. For this tutorial, I will only fetch records from a List variable with fake information and not from a database for simplicity sake. To begin create an ASP.NET Core MVC using Visual Studio that targets the .NET 5 Framework and perform the rest of the steps below. I. Project Setup A. Add via libman the Bootstrap-Table by Wenzhixin using CDN as the option. B. Add via libman font-awesome using CDN as the option. C. Add the latest tableExport.js to bootstrap-table folder. D. Add Nuget Package Microsoft.AspNetCore.Mvc.NewtonsoftJson 5.x E. Add a new class in the Models folder called Product.cs Here's the project structure. II. Coding The Project A. Product.cs - Add properties that describe a product. The status property is where the Dropdown of the Boostrap-Table is bound to. public class Product {...

Good evening, When working with Detail View option in Bootstrap-Table by Wenzhixin, there's a possibility that you have to render the details information using a table element to the detail view with same number of columns and headers of the parent table as per client request. However, upon rendering the details view with the table element, the child table's columns are not aligned with the parent Bootstrap-Table such as the sample screen below. I tried different solutions such as CSS, jQuery/JavaScript and MutationObserver Pattern which work for a few details view and the rest would be in disarray. Before presenting the solution, here are the codes involved in this project. Bootrap Table With data-detail-view property enabled. <table id= "tblDetailsReport" class= "TableBorderCollapse table-striped" data-toggle= "table" data-sort-name= "JobNumber" data-sort-order= "asc" data-search= "t...