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.Display data in form on AnchorLink Click using AngularJS in ASP.Net MVC<p>Hi&nbsp;mahesh213,</p> <p>You need to verify your&nbsp;$http service that are used to populate the form.</p> <p>Check this example. Now please take its reference and correct your code.</p> <p><strong><span style="text-decoration: underline;">Database</span></strong></p> <p>For this example I have used of Northwind database that you can download using the link given below.</p> <p><a href="https://www.aspsnippets.com/Articles/Install-Microsoft-Northwind-and-Pubs-Sample-databases-in-SQL-Server-Management-Studio.aspx" target="_blank">Download Northwind Database</a></p> <p><strong><span style="text-decoration: underline;">Namespaces</span></strong></p> <pre class="brush: csharp">using System.Configuration; using System.Data.SqlClient;</pre> <p><strong><span style="text-decoration: underline;">Controller</span></strong></p> <p><strong>Home</strong></p> <pre class="brush: csharp">public class HomeController : Controller { // GET: /Home/ public ActionResult Index() { return View(); } }</pre> <p><strong>Report</strong></p> <pre class="brush: csharp">public class ReportController : Controller { // GET: /Report/ public ActionResult Index() { return View(); } public JsonResult GetEmployees() { List&lt;object&gt; employees = new List&lt;object&gt;(); string sql = &#34;SELECT TOP 5 EmployeeID,FirstName,LastName,City,Country FROM Employees ORDER BY EmployeeID ASC&#34;; using (SqlConnection conn = new SqlConnection()) { conn.ConnectionString = ConfigurationManager.ConnectionStrings[&#34;constr&#34;].ConnectionString; using (SqlCommand cmd = new SqlCommand(sql)) { cmd.Connection = conn; conn.Open(); using (SqlDataReader sdr = cmd.ExecuteReader()) { while (sdr.Read()) { employees.Add(new { EmployeeId = sdr[&#34;EmployeeID&#34;], FirstName = sdr[&#34;FirstName&#34;], LastName = sdr[&#34;LastName&#34;], City = sdr[&#34;City&#34;], Country = sdr[&#34;Country&#34;] }); } } conn.Close(); } return Json(employees, JsonRequestBehavior.AllowGet); } } }</pre> <p><strong>Report1</strong></p> <pre class="brush: csharp">public class Report1Controller : Controller { // GET: /Report1/ public ActionResult Index() { return View(); } public JsonResult GetEmployees() { List&lt;object&gt; employees = new List&lt;object&gt;(); string sql = &#34;SELECT TOP 4 EmployeeID,FirstName,LastName,City,Country FROM Employees ORDER BY EmployeeID DESC&#34;; using (SqlConnection conn = new SqlConnection()) { conn.ConnectionString = ConfigurationManager.ConnectionStrings[&#34;constr&#34;].ConnectionString; using (SqlCommand cmd = new SqlCommand(sql)) { cmd.Connection = conn; conn.Open(); using (SqlDataReader sdr = cmd.ExecuteReader()) { while (sdr.Read()) { employees.Add(new { EmployeeId = sdr[&#34;EmployeeID&#34;], FirstName = sdr[&#34;FirstName&#34;], LastName = sdr[&#34;LastName&#34;], City = sdr[&#34;City&#34;], Country = sdr[&#34;Country&#34;] }); } } conn.Close(); } return Json(employees, JsonRequestBehavior.AllowGet); } } }</pre> <p><strong><span style="text-decoration: underline;">View</span></strong></p> <p><strong>Home</strong></p> <pre class="brush: html">&lt;html xmlns=&#34;http://www.w3.org/1999/xhtml&#34;&gt; &lt;head&gt; &lt;title&gt;Index&lt;/title&gt; &lt;script type=&#34;text/javascript&#34; src=&#34;https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.7.8/angular.min.js&#34;&gt;&lt;/script&gt; &lt;script type=&#34;text/javascript&#34;&gt; var app = angular.module(&#34;MyApp&#34;, []); app.controller(&#34;MyControll&#34;, function ($scope, $http) { $scope.employees = [ { Id: 1, ControllerName: &#34;Report&#34;, Url: &#34;/report/Index/&#34; }, { Id: 2, ControllerName: &#34;Report1&#34;, Url: &#34;/report1/Index/&#34;}]; }); &lt;/script&gt; &lt;/head&gt; &lt;body ng-app=&#34;MyApp&#34; ng-controller=&#34;MyControll&#34;&gt; &lt;h4&gt;An Unordered List:&lt;/h4&gt; &lt;div ng-repeat=&#34;employee in employees&#34;&gt; &lt;ul&gt; &lt;li&gt;&lt;a href=&#34;{{employee.Url}}&#34;&gt;{{employee.ControllerName}}&lt;/a&gt;&lt;/li&gt; &lt;/ul&gt; &lt;/div&gt; &lt;div class=&#34;content&#34;&gt; &lt;/div&gt; &lt;/body&gt; &lt;/html&gt;</pre> <p><strong>Report</strong></p> <pre class="brush: html">&lt;html xmlns=&#34;http://www.w3.org/1999/xhtml&#34; &gt; &lt;head&gt; &lt;title&gt;Index&lt;/title&gt; &lt;script type=&#34;text/javascript&#34; src=&#34;https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular.min.js&#34;&gt;&lt;/script&gt; &lt;script type=&#34;text/javascript&#34;&gt; var app = angular.module(&#39;MyApp&#39;, []); app.controller(&#39;MyController&#39;, function ($scope, $http, $window) { $http({ method: &#34;get&#34;, url: &#34;/Report/GetEmployees/&#34; }).then(function (response) { $scope.Employees = response.data; }); }); &lt;/script&gt; &lt;/head&gt; &lt;body&gt; &lt;div ng-app=&#34;MyApp&#34; ng-controller=&#34;MyController&#34;&gt; &lt;table&gt; &lt;thead&gt; &lt;tr&gt; &lt;th&gt;Id&lt;/th&gt; &lt;th&gt;First Name&lt;/th&gt; &lt;th&gt;Last Name&lt;/th&gt; &lt;th&gt;City&lt;/th&gt; &lt;th&gt;Country&lt;/th&gt; &lt;/tr&gt; &lt;/thead&gt; &lt;tbody&gt; &lt;tr ng-repeat=&#34;employee in Employees&#34;&gt; &lt;td&gt;{{ employee.EmployeeId }}&lt;/td&gt; &lt;td&gt;{{ employee.FirstName }}&lt;/td&gt; &lt;td&gt;{{ employee.LastName }}&lt;/td&gt; &lt;td&gt;{{ employee.City }}&lt;/td&gt; &lt;td&gt;{{ employee.Country }}&lt;/td&gt; &lt;/tr&gt; &lt;/tbody&gt; &lt;/table&gt; &lt;br /&gt; &lt;%:Html.ActionLink(&#34;Back&#34;,&#34;Index&#34;,&#34;Home&#34;) %&gt; &lt;/div&gt; &lt;/body&gt; &lt;/html&gt;</pre> <p><strong>Report1</strong></p> <pre class="brush: html">&lt;html xmlns=&#34;http://www.w3.org/1999/xhtml&#34; &gt; &lt;head&gt; &lt;title&gt;Index&lt;/title&gt; &lt;script type=&#34;text/javascript&#34; src=&#34;https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular.min.js&#34;&gt;&lt;/script&gt; &lt;script type=&#34;text/javascript&#34;&gt; var app = angular.module(&#39;MyApp&#39;, []); app.controller(&#39;MyController&#39;, function ($scope, $http, $window) { $http({ method: &#34;get&#34;, url: &#34;/Report1/GetEmployees/&#34; }).then(function (response) { $scope.Employees = response.data; }); }); &lt;/script&gt; &lt;/head&gt; &lt;body&gt; &lt;div ng-app=&#34;MyApp&#34; ng-controller=&#34;MyController&#34;&gt; &lt;table&gt; &lt;thead&gt; &lt;tr&gt; &lt;th&gt;Id&lt;/th&gt; &lt;th&gt;First Name&lt;/th&gt; &lt;th&gt;Last Name&lt;/th&gt; &lt;th&gt;City&lt;/th&gt; &lt;th&gt;Country&lt;/th&gt; &lt;/tr&gt; &lt;/thead&gt; &lt;tbody&gt; &lt;tr ng-repeat=&#34;employee in Employees&#34;&gt; &lt;td&gt;{{ employee.EmployeeId }}&lt;/td&gt; &lt;td&gt;{{ employee.FirstName }}&lt;/td&gt; &lt;td&gt;{{ employee.LastName }}&lt;/td&gt; &lt;td&gt;{{ employee.City }}&lt;/td&gt; &lt;td&gt;{{ employee.Country }}&lt;/td&gt; &lt;/tr&gt; &lt;/tbody&gt; &lt;/table&gt; &lt;br /&gt; &lt;%:Html.ActionLink(&#34;Back&#34;,&#34;Index&#34;,&#34;Home&#34;) %&gt; &lt;/div&gt; &lt;/body&gt; &lt;/html&gt;</pre> <p><strong><span style="text-decoration: underline;">Screeenshot</span></strong></p> <p><strong><span style="text-decoration: underline;"><img src="https://i.imgur.com/KsFWmWT.gif" alt="" width="354" height="226" /></span></strong></p>https://www.aspforums.net:443/Threads/179256/Display-data-in-form-on-AnchorLink-Click-using-AngularJS-in-ASPNet-MVC/https://www.aspforums.net:443/Threads/179256/Display-data-in-form-on-AnchorLink-Click-using-AngularJS-in-ASPNet-MVC/Tue, 16 Jul 2019 04:50:48 GMT