ASPForums.Net RSS Feedhttp://www.aspforums.net/Handlers/RSS.ashxLatest additions to the content that appears on ASPForums.Net(c) 2019 www.aspforums.com. All rights reserved.Check and display control based on Database column using AngularJS in ASP.Net MVC<p>Hi&nbsp;mahesh213,</p> <p>Check this example. Now please take its reference and correct your code.</p> <p><strong><span style="text-decoration: underline;">Model</span></strong></p> <pre class="brush: csharp">public class OrderDetails { public Report1 Orders { get; set; } public List&lt;ReportSetting&gt; Items { get; set; } }</pre> <p><strong><span style="text-decoration: underline;">Controller</span></strong></p> <pre class="brush: csharp">public class HomeController : Controller { // GET: /Home/ public ActionResult Index() { return View(); } public JsonResult GetReports() { TestEntities db = new TestEntities(); return Json(db.Report1.ToList(), JsonRequestBehavior.AllowGet); } [HttpPost] public JsonResult Edit(int rID) { TestEntities db = new TestEntities(); Report1 report = new Report1(); report = (from o in db.Report1 where o.RId == rID select o).FirstOrDefault(); string query = report.RQuery; System.Text.RegularExpressions.Regex regex = new System.Text.RegularExpressions.Regex(@&#34;\{.*?\}&#34;); System.Text.RegularExpressions.MatchCollection matches = regex.Matches(query); List&lt;string&gt; cnames = new List&lt;string&gt;(); foreach (var item in matches) { cnames.Add(item.ToString().Replace(&#34;{&#34;, &#34;&#34;).Replace(&#34;}&#34;, &#34;&#34;).Trim()); } List&lt;ReportSetting&gt; listSetting = new List&lt;ReportSetting&gt;(); var settings = (from i in db.ReportSettings where i.RId == rID &amp;&amp; cnames.Contains(i.CName) select new { RSId = i.RSId, CName = i.CName, CType = i.CType, FromTable = i.FromTable, DisplayCName = i.DisplayCName, ValueCName = i.ValueCName, Date = i.Date, }).ToList(); foreach (var setting in settings) { listSetting.Add(new ReportSetting { RSId = setting.RSId, CName = setting.CName, CType = setting.CType, FromTable = setting.FromTable, DisplayCName = setting.DisplayCName, ValueCName = setting.ValueCName, Date = setting.Date }); } var settingsNotInDb = cnames.Where(p =&gt; !settings.Any(p2 =&gt; p2.CName == p)); foreach (var item in settingsNotInDb) { listSetting.Add(new ReportSetting { RSId = rID, CName = item.Trim(), CType = &#34;&#34; }); } OrderDetails details = new OrderDetails(); details.Orders = report; details.Items = listSetting; return Json(details, JsonRequestBehavior.AllowGet); } }</pre> <p><strong><span style="text-decoration: underline;">View</span></strong></p> <pre class="brush: html">&lt;html&gt; &lt;head&gt; &lt;title&gt;Index&lt;/title&gt; &lt;link rel=&#34;stylesheet&#34; href=&#34;https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/css/bootstrap.min.css&#34; /&gt; &lt;script type=&#34;text/javascript&#34; src=&#34;https://cdnjs.cloudflare.com/ajax/libs/jquery/1.10.2/jquery.min.js&#34;&gt;&lt;/script&gt; &lt;script type=&#34;text/javascript&#34; src=&#34;https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js&#34;&gt;&lt;/script&gt; &lt;script type=&#34;text/javascript&#34; src=&#34;https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.5/angular.js&#34;&gt;&lt;/script&gt; &lt;script type=&#34;text/javascript&#34; src=&#34;https://cdn.jsdelivr.net/npm/angular-utils-pagination@0.11.1/dirPagination.js&#34;&gt;&lt;/script&gt; &lt;script type=&#34;text/javascript&#34;&gt; var app = angular.module(&#39;MyApp&#39;, [&#39;angularUtils.directives.dirPagination&#39;]) app.controller(&#34;MyController&#34;, [&#39;$scope&#39;, &#39;$http&#39;, &#39;$anchorScroll&#39;, &#39;myService&#39;, function ($scope, $http, $anchorScroll, myService) { var getReports = myService.GetReports(); getReports.then(function (response) { $scope.reports = response.data; }); var RId; //Edit code for ReportSettings $scope.Edit = function (rId) { RId = rId; $.post(&#34;/Home/Edit/&#34;, { rID: rId }, function (r) { RId = r.Orders.RId; var id1 = RId; $scope.Details = []; for (var i = 0; i &lt; r.Items.length; i++) { var customer = {}; var itemId = r.Items[i].RSId; customer.RId = r.Orders.RId; customer.RSId = r.Items[i].RSId; customer.CName = r.Items[i].CName; customer.CType = r.Items[i].CType; customer.FromTable = r.Items[i].FromTable; customer.DisplayCName = r.Items[i].DisplayCName; customer.ValueCName = r.Items[i].ValueCName; customer.Date = r.Items[i].Date; $scope.Details.push(customer); if (r.Items[i].CType.toLowerCase() == &#34;dropdown&#34;) { $scope.Details[i][&#34;isDisabledDate&#34;] = true; $scope.Details[i][&#34;isDisabledFromTable&#34;] = false; $scope.Details[i][&#34;isDisabledDisplayCName&#34;] = false; $scope.Details[i][&#34;isDisabledValueCName&#34;] = false; $scope.Details[i].Date = &#34;&#34;; } else if (r.Items[i].CType.toLowerCase() == &#34;datepicker&#34;) { $scope.Details[i][&#34;isDisabledFromTable&#34;] = true; $scope.Details[i][&#34;isDisabledDisplayCName&#34;] = true; $scope.Details[i][&#34;isDisabledValueCName&#34;] = true; $scope.Details[i][&#34;isDisabledDate&#34;] = false; $scope.Details[i].FromTable = &#34;&#34;; $scope.Details[i].DisplayCName = &#34;&#34;; $scope.Details[i].ValueCName = &#34;&#34;; } else if (r.Items[i].CType.toLowerCase() == &#34;textbox&#34;) { $scope.Details[i][&#34;isDisabledFromTable&#34;] = true; $scope.Details[i][&#34;isDisabledDisplayCName&#34;] = true; $scope.Details[i][&#34;isDisabledValueCName&#34;] = true; $scope.Details[i][&#34;isDisabledDate&#34;] = true; $scope.Details[i].FromTable = &#34;&#34;; $scope.Details[i].DisplayCName = &#34;&#34;; $scope.Details[i].ValueCName = &#34;&#34;; $scope.Details[i].Date = &#34;&#34;; } } $scope.$apply(); }); } } ]); app.service(&#34;myService&#34;, function ($http) { this.GetReports = function (user) { return $http.get(&#34;/Home/GetReports&#34;); } }); &lt;/script&gt; &lt;/head&gt; &lt;body ng-app=&#34;MyApp&#34; ng-controller=&#34;MyController&#34;&gt; &lt;div id=&#34;dvContainer&#34;&gt; &lt;div&gt; &lt;div class=&#34;table-responsive &#34;&gt; &lt;table id=&#34;dvData&#34; cellpadding=&#34;12&#34; class=&#34;table table-bordered table-hover table-striped&#34; style=&#34;margin-left: 20px; margin-right: 20px;&#34;&gt; &lt;tr class=&#34;success&#34;&gt; &lt;th&gt;&lt;b&gt;RNo&lt;/b&gt;&lt;/th&gt; &lt;th&gt;&lt;b&gt;RName&lt;/b&gt;&lt;/th&gt; &lt;th&gt;&lt;b&gt;RQuery&lt;/b&gt;&lt;/th&gt; &lt;th&gt;&lt;b&gt;ControlActions&lt;/b&gt;&lt;/th&gt; &lt;/tr&gt; &lt;tr dir-paginate=&#34;report in reports|itemsPerPage:10&#34;&gt; &lt;td&gt; &lt;input type=&#34;hidden&#34; ng-model=&#34;report.RId&#34; /&gt;{{report.RNo}} &lt;/td&gt; &lt;td&gt;{{report.RName}}&lt;/td&gt; &lt;td&gt;{{report.RQuery }}&lt;/td&gt; &lt;td&gt;&lt;a class=&#34;glyphicon glyphicon-edit&#34; ng-click=&#34;Edit(report.RId)&#34; href=&#34;&#34;&gt;&lt;/a&gt;&lt;/td&gt; &lt;/tr&gt; &lt;/table&gt; &lt;/div&gt; &lt;/div&gt; &lt;/div&gt; &lt;hr /&gt; &lt;div id=&#34;Div1&#34;&gt; &lt;div&gt; &lt;div class=&#34;table-responsive &#34;&gt; &lt;table id=&#34;tblOrders&#34; class=&#34;table table-responsive table-bordered&#34;&gt; &lt;tr class=&#34;success&#34;&gt; &lt;th&gt;Cname&lt;/th&gt; &lt;th&gt;Ctype&lt;/th&gt; &lt;th&gt;From Table&lt;/th&gt; &lt;th&gt;DisplayCName&lt;/th&gt; &lt;th&gt;ValueCName&lt;/th&gt; &lt;th&gt;Date&lt;/th&gt; &lt;/tr&gt; &lt;tbody dir-paginate=&#34;detail in Details|itemsPerPage:10&#34;&gt; &lt;tr&gt; &lt;td&gt;{{detail.CName}}&lt;/td&gt; &lt;td&gt; &lt;select id=&#34;ddlCType&#34; ng-model=&#34;detail.CType&#34; class=&#34;form-control&#34; ng-change=&#34;TypeChange(CType,detail.Cname)&#34;&gt; &lt;option value=&#34;&#34;&gt;Select Value&lt;/option&gt; &lt;option value=&#34;Dropdown&#34;&gt;Dropdown&lt;/option&gt; &lt;option value=&#34;Datepicker&#34;&gt;DatePicker&lt;/option&gt; &lt;option value=&#34;Textbox&#34;&gt;Textbox&lt;/option&gt; &lt;/select&gt; &lt;/td&gt; &lt;td&gt;&lt;input type=&#34;text&#34; class=&#34;form-control&#34; ng-model=&#34;detail.FromTable&#34; ng-disabled=&#34;detail.isDisabledFromTable&#34; /&gt;&lt;/td&gt; &lt;td&gt;&lt;input type=&#34;text&#34; class=&#34;form-control&#34; ng-model=&#34;detail.DisplayCName&#34; ng-disabled=&#34;detail.isDisabledDisplayCName&#34; /&gt;&lt;/td&gt; &lt;td&gt;&lt;input type=&#34;text&#34; class=&#34;form-control&#34; ng-model=&#34;detail.ValueCName&#34; ng-disabled=&#34;detail.isDisabledValueCName&#34; /&gt;&lt;/td&gt; &lt;td&gt; &lt;select id=&#34;ddlDate&#34; ng-model=&#34;detail.Date&#34; class=&#34;form-control&#34; ng-disabled=&#34;detail.isDisabledDate&#34;&gt; &lt;option value=&#34;&#34;&gt;Select&lt;/option&gt; &lt;option value=&#34;Today&#34;&gt;Today&lt;/option&gt; &lt;option value=&#34;Yesterday&#34;&gt;Yesterday&lt;/option&gt; &lt;/select&gt; &lt;/td&gt; &lt;/tr&gt; &lt;/tbody&gt; &lt;/table&gt; &lt;/div&gt; &lt;/div&gt; &lt;/div&gt; &lt;/body&gt; &lt;/html&gt;</pre> <p><strong><span style="text-decoration: underline;">Screenshot</span></strong></p> <p><strong><span style="text-decoration: underline;"><img src="https://i.imgur.com/2FSy4UG.gif" alt="" width="472" height="336" /></span></strong></p>https://www.aspforums.net:443/Threads/910158/Check-and-display-control-based-on-Database-column-using-AngularJS-in-ASPNet-MVC/https://www.aspforums.net:443/Threads/910158/Check-and-display-control-based-on-Database-column-using-AngularJS-in-ASPNet-MVC/Thu, 06 Jun 2019 07:51:17 GMT