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.What is Dependency Injection and how to use Dependency Injection in Controller of AngularJs in ASP.Net<p>hello sir&nbsp;</p> <p>i am new in angular js and want to know about dependency injection</p> <p>any one tell me the esay way what is dependency and why it is so usefull&nbsp;</p> <p>like below example we create scop and http as a injector i think</p> <pre class="brush: js"> countryApp.controller(&#39;CountryCtrl&#39;, [&#39;$scope&#39;, &#39;$http&#39;, function (scope, http){ http.get(&#39;countries.json&#39;).success(function(data) { scope.countries = data; });</pre> <p>&nbsp;</p>https://www.aspforums.net:443/Threads/853957/What-is-Dependency-Injection-and-how-to-use-Dependency-Injection-in-Controller-of-AngularJs-in-ASPNet/https://www.aspforums.net:443/Threads/853957/What-is-Dependency-Injection-and-how-to-use-Dependency-Injection-in-Controller-of-AngularJs-in-ASPNet/Mon, 12 Jun 2017 02:20:33 GMTUsing Angular Material DatePicker control in AngularJS<p>hi all</p> <p>please help, i new to Angular&nbsp;</p> <p>i have added datetime&nbsp;control in html like</p> <div> <div> <pre class="brush: html">&lt;md-form-field&gt; &lt;input mdInput [mdDatepicker]=&#34;picker&#34; placeholder=&#34;Choose a date&#34;&gt; &lt;md-datepicker-toggle mdSuffix [for]=&#34;picker&#34;&gt;&lt;/md-datepicker-toggle&gt; &lt;md-datepicker #picker&gt;&lt;/md-datepicker&gt; &lt;/md-form-field&gt;</pre> <p>but it is not reflecting in the form and how to do the validation for dates Like it Not&nbsp;Accept future Dates&nbsp;</p> </div> <div>please help me</div> <div>&nbsp;</div> <div>thanks and regards</div> <div>&nbsp;</div> <div>siddu</div> </div>https://www.aspforums.net:443/Threads/174619/Using-Angular-Material-DatePicker-control-in-AngularJS/https://www.aspforums.net:443/Threads/174619/Using-Angular-Material-DatePicker-control-in-AngularJS/Thu, 13 Dec 2018 23:30:04 GMTUpload files and form data in same request using AngularJS in ASP.Net<p>Does anybody know how i can upload image and post form data at the same time with AngularJS and web api. Its urgent!!!</p>https://www.aspforums.net:443/Threads/540230/Upload-files-and-form-data-in-same-request-using-AngularJS-in-ASPNet/https://www.aspforums.net:443/Threads/540230/Upload-files-and-form-data-in-same-request-using-AngularJS-in-ASPNet/Mon, 26 Feb 2018 02:44:45 GMTUpdate record using Web API and AngularJS in ASP.Net MVC<p>Hi,</p> <p>I want to update a row in html table using webApi and angular js</p> <p>I have created a table employee and add to the application using entity frame work's Databasefirst method</p> <p>this is code for html </p> <pre class="brush: html">&lt;div ng-app=&#34;myApp&#34;&gt; &lt;div ng-controller=&#34;myCtrl&#34; ng-init=&#34;GetAllData()&#34;&gt; &lt;p&gt;List Of Employees&lt;/p&gt; &lt;table class=&#34;table table-bordered table-hover&#34;&gt; &lt;thead class=&#34;thed-dark&#34;&gt; &lt;tr&gt;&lt;th scope=&#34;col&#34;&gt;ID&lt;/th&gt;&lt;th&gt;FirstName&lt;/th&gt;&lt;th&gt;LastName&lt;/th&gt;&lt;th&gt;Company&lt;/th&gt;&lt;th&gt;Actions&lt;/th&gt;&lt;/tr&gt;&lt;/thead&gt; &lt;tr ng-repeat=&#34;Emp in employees&#34;&gt; &lt;td&gt;{{Emp.Id}}&lt;/td&gt; &lt;td&gt;{{Emp.FirstName}}&lt;/td&gt; &lt;td&gt;{{Emp.LastName}}&lt;/td&gt; &lt;td&gt;{{Emp.Company}}&lt;/td&gt; &lt;td&gt; &lt;input type=&#34;button&#34; class=&#34;btn btn-warning&#34; value=&#34;Update&#34; ng-click=&#34;UpdateEmp(Emp)&#34; /&gt; &lt;/td&gt; &lt;/tr&gt; &lt;/table&gt; &lt;table&gt; &lt;tr&gt;&lt;td&gt;&lt;label class=&#34;col-md-4 control-label&#34;&gt;FirstName:&lt;/label&gt;&lt;/td&gt;&lt;td&gt;&lt;input type=&#34;text&#34; class=&#34;form-control&#34; placeholder=&#34;FirstName&#34; ng-model=&#34;FirstName&#34;&gt;&lt;/td&gt;&lt;/tr&gt; &lt;tr&gt;&lt;td&gt;&lt;label class=&#34;col-md-4 control-label&#34;&gt;LaststName:&lt;/label&gt;&lt;/td&gt;&lt;td&gt;&lt;input type=&#34;text&#34; class=&#34;form-control&#34; placeholder=&#34;FirstName&#34; ng-model=&#34;LastName&#34;&gt;&lt;/td&gt;&lt;/tr&gt; &lt;tr&gt;&lt;td&gt;&lt;label class=&#34;col-md-4 control-label&#34;&gt;Company:&lt;/label&gt;&lt;/td&gt;&lt;td&gt;&lt;input type=&#34;text&#34; class=&#34;form-control&#34; id=&#34;inputEmail&#34; placeholder=&#34;Company&#34; ng-model=&#34;Company&#34;&gt;&lt;/td&gt;&lt;/tr&gt; &lt;tr&gt;&lt;td&gt;&lt;input type=&#34;button&#34; id=&#34;btnSave&#34; class=&#34;form-control btn-space&#34; value=&#34;Submit&#34; ng-click=&#34;UpdateData(Emp)&#34; /&gt;&lt;/td&gt;&lt;/tr&gt; &lt;/table&gt; &lt;/div&gt; &lt;/div&gt;</pre> <p>code for displays in html table,display row in textboxes and code for updating </p> <pre class="brush: js">&lt;script src=&#34;~/Scripts/angular.min.js&#34;&gt;&lt;/script&gt; &lt;script &gt; var app = angular.module(&#34;myApp&#34;, []); app.controller(&#34;myCtrl&#34;, function ($scope, $http) { //displays in html table $scope.GetAllData = function () { $http.get(&#39;/api/employee&#39;).then(function (response) { $scope.employees = response.data }, function (status) { alert(status); }); } // //Displaying values in textboxes $scope.UpdateEmp = function (Emp) { // $scope.employees[index].FirstName = &#34;rajkumar&#34;; $scope.FirstName = Emp.FirstName; $scope.LastName = Emp.LastName; $scope.Company = Emp.Company; } //updating the data to database $scope.UpdateData = function (Emp) { Emp.FirstName = $scope.FirstName; Emp.LastName = $scope.LastName; Emp.Company = $scope.Company; alert(Emp.FirstName); $http.put(&#39;/api/Employee&#39;,Emp).then(function () { alert(&#34;success&#34;); }) } // }); &lt;/script&gt;</pre> <p>problem is code for updating is not working</p> <p>how to solve this</p> <p>regards</p> <p>Baiju</p>https://www.aspforums.net:443/Threads/460601/Update-record-using-Web-API-and-AngularJS-in-ASPNet-MVC/https://www.aspforums.net:443/Threads/460601/Update-record-using-Web-API-and-AngularJS-in-ASPNet-MVC/Mon, 06 Aug 2018 00:34:36 GMTTutorials for AngularJS 2 / 4 / 5<p>Hi,</p> <p>Is there any tutorials for Angular 2/4/5 for learning Angular step by step.</p> <p>&nbsp;</p>https://www.aspforums.net:443/Threads/476640/Tutorials-for-AngularJS-2-4-5/https://www.aspforums.net:443/Threads/476640/Tutorials-for-AngularJS-2-4-5/Thu, 14 Dec 2017 05:02:34 GMTShow Hide HTML DIV using AngularJS<p>I wonder how&nbsp; it work?</p> <pre class="brush: html">//If DIV is visible it will be hidden and vice versa. $scope.IsVisible = value == &#34;Y&#34;;</pre> <p>DIV is visible it will be hidden and vice versa</p>https://www.aspforums.net:443/Threads/210669/Show-Hide-HTML-DIV-using-AngularJS/https://www.aspforums.net:443/Threads/210669/Show-Hide-HTML-DIV-using-AngularJS/Tue, 20 Feb 2018 01:26:02 GMTSet Selected Value for DropDownList on Button click in AngularJS<p>Hi,</p> <p>we have Name and Category Fields. after clicking of edit functionality in the below code one pop up shoule be appear</p> <p>In that Name and Category Fields are displaying&nbsp;</p> <p>Name value is displaying propely but category value is showing empty</p> <p>I want to display relevant row category name on that pop up</p> <p>Update is working fine.</p> <p>Problem is after clciking of edit func() value is not displaying on Category</p> <p>Please help me&nbsp;</p> <pre class="brush: html">&lt;html&gt; &lt;head&gt; &lt;title&gt;&lt;/title&gt; &lt;/head&gt; &lt;body&gt; &lt;link rel=&#34;stylesheet&#34; href=&#34;https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css&#34;&gt; &lt;link rel=&#34;stylesheet&#34; href=&#34;https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.2-rc.1/css/select2.min.css&#34; /&gt; &lt;script src=&#34;https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js&#34;&gt;&lt;/script&gt; &lt;script type=&#34;text/javascript&#34; src=&#34;https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.2-rc.1/js/select2.min.js&#34;&gt;&lt;/script&gt; &lt;script type=&#34;text/javascript&#34; src=&#34;https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.2-rc.1/js/select2.full.js&#34;&gt;&lt;/script&gt; &lt;script src=&#34;https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js&#34;&gt;&lt;/script&gt; &lt;script src=&#34;https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.6.8/angular.min.js&#34;&gt;&lt;/script&gt; &lt;script type=&#34;text/javascript&#34;&gt; var app = angular.module(&#39;MyApp&#39;, []) app.directive(&#34;select2&#34;, function ($timeout, $parse) { return { restrict// Code goes here : &#39;AC&#39;, require: &#39;ngModel&#39;, link: function (scope, element, attrs) { console.log(attrs); $timeout(function () { element.select2(); element.select2Initialized = true; }); var refreshSelect = function () { if (!element.select2Initialized) return; $timeout(function () { element.trigger(&#39;change&#39;); }); }; var recreateSelect = function () { if (!element.select2Initialized) return; $timeout(function () { element.select2(&#39;destroy&#39;); element.select2(); }); }; scope.$watch(attrs.ngModel, refreshSelect); if (attrs.ngOptions) { var list = attrs.ngOptions.match(/ in ([^ ]*)/)[1]; // watch for option list change scope.$watch(list, recreateSelect); } if (attrs.ngDisabled) { scope.$watch(attrs.ngDisabled, refreshSelect); } } }; }); app.controller(&#39;MyController&#39;, function ($scope, $window) { $scope.EditCustomer; $scope.EditIndex; $scope.Customers = []; $scope.Orders = []; $scope.categories = [ { CategoryID: 1, CategortName: &#39;Starbuck&#39; }, { CategoryID: 2, CategortName: &#39;Appolo&#39; }, { CategoryID: 3, CategortName: &#39;Saul Tigh&#39; }, { CategoryID: 4, CategortName: &#39;Adama&#39; }] $scope.Add = function () { //Add the new item to the Array. &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp;var customer = {}; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp;customer.Name = $scope.Name; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp;customer.Category = $scope.Category.CategortName; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp;$scope.Customers.push(customer); &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp;//Clear the TextBoxes. &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp;$scope.Name = &#34;&#34;; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp;$scope.Category = &#34;&#34;; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp;$scope.Date = &#34;&#34;; &nbsp; &nbsp; &nbsp; &nbsp; }; &nbsp; &nbsp; &nbsp; &nbsp; $scope.Remove = function (index) { &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp;//Find the record using Index from Array. &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp;var name = $scope.Customers[index].Name; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp;if ($window.confirm(&#34;Do you want to delete: &#34; + name)) { &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp; //Remove the item from Array using Index. &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp; $scope.Customers.splice(index, 1); &nbsp; &nbsp; &nbsp; &nbsp; } } $scope.edit = function (index) { &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp;$scope.EditCustomer = $scope.Customers[index]; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp;$scope.Name = $scope.EditCustomer.Name; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp;$scope.Category= $scope.EditCustomer.Category; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp;$scope.EditIndex = index; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp;alert($scope.EditCustomer); &nbsp; &nbsp; &nbsp; &nbsp; } &nbsp; &nbsp; &nbsp; &nbsp; $scope.Update = function (index) { &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp;alert(&#34;updated&#34;); &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp;//Find the record using Index from Array. &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp;$scope.EditCustomer.Name = $scope.Name; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp;$scope.EditCustomer.Category = $scope.Category.CategortName; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp;$scope.Customers[index] = $scope.EditCustomer; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp;alert($scope.EditCustomer); &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp;$scope.Name = &#34;&#34;; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp;$scope.Category = &#34;&#34;; } &nbsp; &nbsp; &nbsp; &nbsp; $scope.reset = function () { $scope.Name = &#34;&#34;; $scope.Category = &#34;&#34;; &nbsp; &nbsp; &nbsp; &nbsp; } }); &lt;/script&gt; &lt;div ng-app=&#34;MyApp&#34; ng-controller=&#34;MyController&#34;&gt; &lt;table cellpadding=&#34;0&#34; cellspacing=&#34;0&#34;&gt; &lt;tr&gt; &lt;th&gt;Name&lt;/th&gt; &lt;th&gt;Category&lt;/th&gt; &lt;th&gt; &lt;/th&gt; &lt;/tr&gt; &lt;tbody ng-repeat=&#34;m in Customers&#34;&gt; &lt;tr&gt; &lt;td&gt;{{m.Name}}&lt;/td&gt; &lt;td&gt;{{m.Category}}&lt;/td&gt; &lt;td&gt;&lt;input type=&#34;button&#34; ng-click=&#34;edit($index)&#34; class=&#34;btn btn-sm btn-primary&#34; data-toggle=&#34;modal&#34; data-target=&#34;#popup2&#34; value=&#34;edit&#34; /&gt;&lt;/td&gt; &lt;td&gt; &lt;input type=&#34;button&#34; ng-click=&#34;Remove($index)&#34; value=&#34;Remove&#34; /&gt; &lt;/td&gt; &lt;/tr&gt; &lt;/tbody&gt; &lt;tfoot&gt; &lt;tr&gt; &lt;td&gt;&lt;input type=&#34;text&#34; ng-model=&#34;Name&#34; /&gt;&lt;/td&gt; &lt;td&gt; &lt;select class=&#34;input-sm form-control&#34; select2=&#34;&#34; name=&#34;CategortName&#34; ng-model=&#34;Category&#34; containerCssClass=&#34;all&#34; ng-change=&#34;GetProducts()&#34; ng-options=&#34;c as c.CategortName for c in categories&#34; ng-disabled=&#34;disabled&#34;&gt; &lt;option value=&#34;&#34;&gt;Select Category&lt;/option&gt; &lt;/select&gt; &lt;/td&gt; &lt;td&gt;&lt;input type=&#34;button&#34; ng-click=&#34;Add()&#34; value=&#34;Add&#34; /&gt;&lt;/td&gt; &lt;/tr&gt; &lt;/tfoot&gt; &lt;/table&gt; &lt;div class=&#34;modal fade&#34; id=&#34;popup2&#34; role=&#34;dialog&#34;&gt; &lt;div class=&#34;modal-dialog modal-lg&#34;&gt; &lt;div class=&#34;modal-content&#34;&gt; &lt;div class=&#34;modal-header&#34;&gt; &lt;button type=&#34;button&#34; class=&#34;close&#34; data-dismiss=&#34;modal&#34;&gt;&times;&lt;/button&gt; &lt;h4 class=&#34;modal-title&#34;&gt;Modal Header&lt;/h4&gt; &lt;/div&gt; &lt;div class=&#34;modal-body&#34;&gt; &lt;div class=&#34;s2vk-container&#34;&gt; &lt;div class=&#34;row&#34;&gt; &lt;div class=&#34;col-md-8&#34;&gt; &lt;div class=&#34;panel panel-default&#34; ng-model=&#34;EditCustomer&#34;&gt; &lt;table class=&#34;table table-condensed&#34;&gt; &lt;thead&gt; &lt;tr style=&#34;padding-left:10px; padding-right:10px;&#34; class=&#34;active&#34;&gt; &lt;th class=&#34;thick-line&#34; style=&#34;padding-left:10px; padding-right:20px; padding-top:6px; padding-bottom:6px;&#34;&gt;Name&lt;/th&gt; &lt;th style=&#34;padding-left:10px; padding-right:10px;&#34; class=&#34;thick-line&#34;&gt;Category&lt;/th&gt; &lt;th style=&#34;padding-left:10px; padding-right:10px;&#34; class=&#34;thick-line&#34;&gt;Action&lt;/th&gt; &lt;/tr&gt; &lt;tr&gt; &lt;td&gt;&lt;input type=&#34;text&#34; value=&#34;{{EditCustomer.Name}}&#34; ng-model=&#34;Name&#34; /&gt;&lt;/td&gt; &lt;td&gt; &lt;select class=&#34;input-sm form-control&#34; select2=&#34;&#34; name=&#34;CategortName&#34; ng-model=&#34;Category&#34; value=&#34;{{EditCustomer.Category}}&#34; containerCssClass=&#34;all&#34; ng-options=&#34;c as c.CategortName for c in categories&#34; ng-disabled=&#34;disabled&#34;&gt; &lt;option value=&#34;&#34;&gt;Select Category&lt;/option&gt; &lt;/select&gt; &lt;/td&gt; &lt;td&gt; &lt;button type=&#34;button&#34; class=&#34;btn btn-sm btn-primary&#34; ng-click=&#34;Update()&#34;&gt;Update&lt;/button&gt; &lt;button type=&#34;button&#34; class=&#34;btn btn-sm btn-danger&#34; ng-click=&#34;reset()&#34;&gt;cancel&lt;/button&gt; &lt;/td&gt; &lt;/tr&gt; &lt;/thead&gt; &lt;/table&gt; &lt;/div&gt; &lt;/div&gt; &lt;/div&gt; &lt;/div&gt; &lt;/div&gt; &lt;div class=&#34;modal-footer&#34;&gt; &lt;button type=&#34;button&#34; class=&#34;btn btn-default&#34; data-dismiss=&#34;modal&#34; ng-click=&#34;reset()&#34;&gt;Close&lt;/button&gt; &lt;/div&gt; &lt;/div&gt; &lt;/div&gt; &lt;/div&gt; &lt;/div&gt; &lt;/body&gt; &lt;/html&gt; </pre> <p>&nbsp;</p>https://www.aspforums.net:443/Threads/456297/Set-Selected-Value-for-DropDownList-on-Button-click-in-AngularJS/https://www.aspforums.net:443/Threads/456297/Set-Selected-Value-for-DropDownList-on-Button-click-in-AngularJS/Mon, 03 Dec 2018 01:47:33 GMTRead JSON file in AngularJS 2 Error: Cannot read property getDOM of undefined<p>Hi all</p> <p>I am doing the example for read json from the file in angular2</p> <p>here is My code.</p> <pre class="brush: js">export class JsonComponent { people: Object[]; constructor(http: Http) { http.get(&#39;people.json&#39;).subscribe(res =&gt; { this.people = res.json(); }); } active: boolean = false; toggleActiveState() { this.active = !this.active; } }</pre> <p>I am geting error in console As Cannot read property 'getDOM' of undefined</p> <p>please help me</p> <p>thanks and regards</p> <p>siddu</p>https://www.aspforums.net:443/Threads/440989/Read-JSON-file-in-AngularJS-2-Error-Cannot-read-property-getDOM-of-undefined/https://www.aspforums.net:443/Threads/440989/Read-JSON-file-in-AngularJS-2-Error-Cannot-read-property-getDOM-of-undefined/Thu, 27 Dec 2018 21:56:00 GMTPopulate HTML Table with DropDownList (HTML Select) using AngularJS<p>i have table which contains&nbsp; 5 fruits information</p> <p>in each row fruits name and a drop down is there</p> <p>values for drop down are "Select","Yes","No" </p> <p>now i have to display all the 5 fruits information below the table .</p> <p>need to display in table form with the selected dropdown values.</p> <p>Please give me idea in angularJS</p>https://www.aspforums.net:443/Threads/738471/Populate-HTML-Table-with-DropDownList-HTML-Select-using-AngularJS/https://www.aspforums.net:443/Threads/738471/Populate-HTML-Table-with-DropDownList-HTML-Select-using-AngularJS/Fri, 19 Jan 2018 05:17:17 GMTSave image path to Database using AngularJS in ASP.Net<p>====&gt;the webservice</p> <pre class="brush: csharp">[WebMethod] public string insert(string city,string country,string flag) { try { using(SqlConnection conn =new SqlConnection(clsMain.sqlconnstring)) { conn.Open(); SqlCommand cmd = new SqlCommand(&#34;spInsertUploadPicture&#34;, conn); cmd.CommandType = CommandType.StoredProcedure; cmd.Parameters.AddWithValue(&#34;@city&#34;, city); cmd.Parameters.AddWithValue(&#34;@country&#34;,country); cmd.Parameters.AddWithValue(&#34;@imgpath&#34;, string.Format(&#34;../imageUploads/{0}&#34;,flag)); cmd.ExecuteNonQuery(); return &#34;Record Uploaded Successfully&#34;; } } catch (Exception) { throw; } }</pre> <p>===&gt;&gt;&gt;&gt; the controller</p> <pre class="brush: js">.directive(&#34;fileInput&#34;,function($parse){ return { restrict: &#34;A&#34;, link: function (scope,elem,attrs) { elem.bind(&#34;change&#34;, function () { $parse(attrs.fileInput).assign(scope, elem[0].files); scope.$apply(); }); } } }) .controller(&#34;imageUploadPracticeController&#34;, function ($scope,$http,$timeout) { var vm = this; vm.loading = false; vm.msg = false; vm.error = false; // read(); vm.imageUpload = function (event) { var files = event.target.files;//filelist object var file = files[files.length - 1]; vm.file = file; var reader = new FileReader(); reader.onload = vm.imageIsLoaded; reader.readAsDataURL(file); } vm.imageIsLoaded = function (e) { $scope.$apply(function () { vm.step = e.target.result; }); } vm.btnUpload = function () { vm.loading = true; var request = $http({ url: &#39;../services/svImageUpload.asmx/insert&#39;, method: &#39;POST&#39;, data: { city: vm.City, country: vm.Country, flag: vm.file.name }, //transformRequest:angular.identity, headers: {&#39;content-type&#39;:undefined} }); request.then(function (response) { read(); vm.loading = false; vm.error = false; vm.hurray = response.data; vm.msg = true; }, function (error) { vm.error = true; vm.error = error.data; vm.loading = false; vm.msg = false; }); //console.log(vm.City + &#39; &#39; + vm.Country + &#39; &#39; + vm.file.name); } var read = function () { var request = $http(&#34;../services/svImageUpload.asmx/GetAllFiles&#34;) .then(function (response) { vm.imgUploads = response.data; }); } vm.closeSuccessMsg = function () { vm.loading = false; vm.msg = false; vm.error = false; $(&#34;#txtCity&#34;).val(&#39;&#39;); $(&#34;#txtCountry&#34;).val(&#39;&#39;); } vm.closeErrorMsg = function () { vm.loading = false; vm.msg = false; vm.error = false; $(&#34;#txtCity&#34;).val(&#39;&#39;); $(&#34;#txtCountry&#34;).val(&#39;&#39;); } });</pre>https://www.aspforums.net:443/Threads/401358/Save-image-path-to-Database-using-AngularJS-in-ASPNet/https://www.aspforums.net:443/Threads/401358/Save-image-path-to-Database-using-AngularJS-in-ASPNet/Fri, 26 May 2017 11:39:14 GMTRetrieve and display data from Database in TextBox on Button click using AngularJS in ASP.Net<p>how to retrieve data from database to textbox in asp.net angularjs</p> <p>on button click event.</p>https://www.aspforums.net:443/Threads/720928/Retrieve-and-display-data-from-Database-in-TextBox-on-Button-click-using-AngularJS-in-ASPNet/https://www.aspforums.net:443/Threads/720928/Retrieve-and-display-data-from-Database-in-TextBox-on-Button-click-using-AngularJS-in-ASPNet/Sat, 03 Feb 2018 03:54:59 GMTRead JSON object from Url in AngularJS 2<p>Hi sir,</p> <p>i am refering&nbsp; this link&nbsp;</p> <p>https://www.youtube.com/watch?v=oLtwPzr_8uA</p> <p>to read the array of json object,</p> <p>like&nbsp; that i&nbsp; created&nbsp; method ..</p> <pre>export class EmployeeService {<br /> private _url: string = 'http://localhost:8080/Employee/getEmployeeList';<br /><br /> constructor(private _http: Http) {<br /> }<br /><br /> public getallemployee() {<br /> return this._http.get(this._url)<br /> .map((response: Response ) =&gt; response.json());<br /> }<br />}</pre> <p>but i am not able to read the json data, so what can i place in the _url,</p> <p>my method getEmployeeList return array of json object,</p> <p>thanks and regards</p> <p>siddu</p>https://www.aspforums.net:443/Threads/168751/Read-JSON-object-from-Url-in-AngularJS-2/https://www.aspforums.net:443/Threads/168751/Read-JSON-object-from-Url-in-AngularJS-2/Thu, 27 Dec 2018 01:53:36 GMTPass multiple parameters from AngularJS to ASP.Net MVC controller<div class="edit-comment-hide"> <div class="comment-body markdown-body markdown-format js-comment-body"> <p>In my scenario I wanna pass two parameters (Array,string) to API controller POST method, How can I determine resource and setCode for passing two parameter?</p> </div> </div> <pre class="brush: js"> Resource: app.factory(&#34;EthnicCodeResource&#34;, [&#39;$resource&#39;, function ($resource) { return { Codes: $resource(&#39;api/Code/:collection&#39;, { collection: &#39;@collection&#39; }, { postCollection: { method: &#39;POST&#39;, isArray: true } }), Effects: $resource(&#39;api/Effects:reviewSetCode&#39;, { reviewSetCode: &#39;@reviewSetCode&#39; }, { setCode: { method: &#39;POST&#39;, isArray: true } }), HCodes: $resource(&#39;api/HCodes&#39;) } + + Save: EthnicCodeResource.Effects.setCode($rootScope.myData).$promise.then (function() { }); + API Controller: [HttpPost] public void Post(List reviewSetCode) { // + } + +In my scenario I wanna pass two parameters (Array,string)to API controller POST method, +like, [HttpPost] public void Post(List reviewSetCode, string act) { // + }. + </pre> <p>In my scenario I wanna pass two parameters (Array,string) to API controller POST method, How can I determine resource and setCode for passing two parameter?</p>https://www.aspforums.net:443/Threads/124654/Pass-multiple-parameters-from-AngularJS-to-ASPNet-MVC-controller/https://www.aspforums.net:443/Threads/124654/Pass-multiple-parameters-from-AngularJS-to-ASPNet-MVC-controller/Tue, 12 May 2015 03:53:08 GMTPass (Send) DropDownList selected Value to Controller in ASP.Net MVC using AngularJS<p>I have 3 tables table</p> <p>1)category table</p> <p>2)product table</p> <p>3)itemtable</p> <p>based upon category values it should display product i want to save productName id to itemtable</p> <p>finally after clicking of save function it can be saved to itemtable</p> <p>For me in item table productId value showing zero</p> <p>category</p> <p>CategoryID CategoryName</p> <p>1 shhs</p> <p>2 euueu</p> <p>&nbsp;</p> <p>Product</p> <p>ProductID CategoryID ProductName</p> <p>1&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;1&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; dhhdhd</p> <p>2&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;1&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; dhdhdhd</p> <p>3&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;2&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; 333</p> <p>&nbsp;</p> <p>itemtable</p> <p>Expetected ouput</p> <p>Id Name ProductID</p> <p>1&nbsp; &nbsp;mahesh 1</p> <p>2&nbsp; &nbsp;dddj&nbsp; &nbsp; &nbsp; 2</p> <p>&nbsp;</p> <p>getting output</p> <p>Id Name ProductID</p> <p>1&nbsp; &nbsp;mahesh&nbsp; &nbsp;0</p> <p>2&nbsp; &nbsp;dddj&nbsp; &nbsp; &nbsp; &nbsp; 0</p> <pre class="brush: html">@{ Layout = null; } &lt;!DOCTYPE html PUBLIC &#34;-//W3C//DTD XHTML 1.0 Transitional//EN&#34; &#34;http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd&#34;&gt; &lt;html xmlns=&#34;http://www.w3.org/1999/xhtml&#34;&gt; &lt;head&gt; &lt;title&gt;Index&lt;/title&gt; &lt;link rel=&#34;stylesheet&#34; href=&#34;https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css&#34; /&gt; &lt;link rel=&#34;stylesheet&#34; href=&#34;https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.2-rc.1/css/select2.min.css&#34; /&gt; &lt;link rel=&#34;stylesheet&#34; href=&#34;https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.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://cdnjs.cloudflare.com/ajax/libs/select2/4.0.2-rc.1/js/select2.min.js&#34;&gt;&lt;/script&gt; &lt;script type=&#34;text/javascript&#34; src=&#34;https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.2-rc.1/js/select2.full.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://ajax.googleapis.com/ajax/libs/angularjs/1.5.0/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) { $scope.Customers = []; GetCategory(); function GetCategory() { $scope.categories = []; $http({ method: &#39;Get&#39;, url: &#39;/autocomplete/GetCategories/&#39;, }).success(function (data, status, headers, config) { $scope.categories = data; }).error(function (data, status, headers, config) { $scope.message = &#39;Unexpected Error&#39;; }); } $scope.GetProducts = function () { var countryId = $scope.Category.CategoryID; var data = { &#34;CategoryID&#34;: countryId }; var config = { params: data, headers: { &#39;Accept&#39;: &#39;application/json&#39; } }; if (countryId) { $http.get(&#34;/autocomplete/GetProducts/&#39;&#34;, config) .then(function (data, status, headers, config) { $scope.products = data.data; }, function (response) { alert(response.responseText); }); } else { $scope.products = null; } } $scope.Add = function () { var customer = {}; $scope.Customers.push({ Name: $scope.Name, Product: $scope.Product.ProductName, Category: $scope.Category.CategortName, }); $scope.Name = &#34;&#34;; $scope.Category = &#34;&#34;; $scope.Product = &#34;&#34;; }; $scope.Remove = function (index) { //Find the record using Index from Array. var name = $scope.Customers[index].Category; if ($window.confirm(&#34;Do you want to delete: &#34; + name)) { //Remove the item from Array using Index. $scope.Customers.splice(index, 1); } } $scope.Save = function () { var User = {}; User[&#34;customers&#34;] = $scope.Customers; debugger; alert(JSON.stringify(User)); $http({ method: &#34;Post&#34;, url: &#34;/autocomplete/SaveOrder&#34;, data: User }).success(function (data) { alert(data); }).error(function (err) { $scope.Message = err.Message; }) }; }); &lt;/script&gt; &lt;/head&gt; &lt;body&gt; &lt;div ng-app=&#34;MyApp&#34; ng-controller=&#34;MyController&#34;&gt; &lt;table cellpadding=&#34;0&#34; cellspacing=&#34;0&#34;&gt; &lt;tr&gt; &lt;th&gt;Name&lt;/th&gt; &lt;th&gt; Category &lt;/th&gt; &lt;th&gt; Product &lt;/th&gt; &lt;th&gt; Action &lt;/th&gt; &lt;/tr&gt; &lt;tbody ng-repeat=&#34;m in Customers&#34;&gt; &lt;tr&gt; &lt;td&gt;{{m.Name}}&lt;/td&gt; &lt;td&gt; {{m.Category}} &lt;/td&gt; &lt;td&gt; {{m.Product}} &lt;/td&gt; &lt;td&gt; &lt;input type=&#34;button&#34; class=&#34;btn btn-danger&#34; ng-click=&#34;Remove($index)&#34; value=&#34;Remove&#34; /&gt; &lt;/td&gt; &lt;/tr&gt; &lt;/tbody&gt; &lt;tfoot&gt; &lt;tr&gt; &lt;td&gt; &lt;input type=&#34;text&#34; ng-model=&#34;Name&#34; class=&#34;input-sm form-control&#34; /&gt; &lt;/td&gt; &lt;td&gt; &lt;select class=&#34;input-sm form-control&#34; select2=&#34;&#34; name=&#34;CategortName&#34; ng-model=&#34;Category&#34; containerCssClass=&#34;all&#34; ng-change=&#34;GetProducts()&#34; ng-options=&#34;c as c.CategortName for c in categories&#34; ng-disabled=&#34;disabled&#34;&gt; &lt;option value=&#34;&#34;&gt;Select Category&lt;/option&gt; &lt;/select&gt; &lt;/td&gt; &lt;td&gt; &lt;select select2=&#34;&#34; ng-model=&#34;Product&#34; ng-disabled=&#34;!products&#34; class=&#34;input-sm form-control&#34; ng-options=&#34;s as s.ProductName for s in products&#34;&gt; &lt;option value=&#34;&#34;&gt;-- Select Product --&lt;/option&gt; &lt;/select&gt; &lt;/td&gt; &lt;td&gt; &lt;input type=&#34;button&#34; class=&#34;btn btn-primary&#34; ng-click=&#34;Add()&#34; value=&#34;Add&#34; /&gt; &lt;/td&gt; &lt;/tr&gt; &lt;/tfoot&gt; &lt;/table&gt; &lt;div style=&#34;padding:10px 0;&#34;&gt; &lt;input id=&#34;submit&#34; type=&#34;button&#34; value=&#34;Save&#34; name=&#34;add&#34; ng-click=&#34;Save()&#34; ng-disabled=&#34;userForm.$invalid&#34; class=&#34;btn btn-success&#34; style=&#34;padding:10px 20px&#34; reruired=reruired autofocus=autofocus /&gt; &lt;/div&gt; &lt;/div&gt; &lt;/body&gt; &lt;/html&gt;</pre> <p>&nbsp;</p> <pre class="brush: csharp">using Readanddisplayexcelfile.Models; using System; using System.Collections.Generic; using System.Linq; using System.Web; using System.Web.Mvc; namespace Readanddisplayexcelfile.Controllers { public class AutoCompleteController : Controller { private InvoiceEntities db = new InvoiceEntities(); // GET: AutoComplete public ActionResult Index() { return View(); } [HttpGet] public ActionResult GetCategories() { db.Configuration.ProxyCreationEnabled = false; var coun = db.Categories.Select(model =&gt; new { model.CategoryID, model.CategortName }).ToList(); return Json(coun, JsonRequestBehavior.AllowGet); } [HttpGet] public ActionResult GetProducts(int? CategoryID) { db.Configuration.ProxyCreationEnabled = false; var coun = db.Products.Where(model =&gt; model.ProductID == CategoryID).Select(model =&gt; new { model.ProductID, model.ProductName }).ToList(); return Json(coun, JsonRequestBehavior.AllowGet); } [HttpPost] public ActionResult SaveOrder(Itemtable[] item1) { string result = &#34;Error! Order Is Not Complete!&#34;; if (item1 != null ) { foreach (var item in item1) { //var orderId = Guid.NewGuid(); Itemtable O = new Itemtable(); //O.RAI_Id = orderId; O.Name = item.Name; O.ProductID = item.ProductID; //O.subitem1 = item.subitem1; db.Itemtables.Add(O); } db.SaveChanges(); result = &#34;Success! Order Is Complete!&#34;; } return Json(result, JsonRequestBehavior.AllowGet); } } }</pre> <p>&nbsp;</p>https://www.aspforums.net:443/Threads/525362/Pass-Send-DropDownList-selected-Value-to-Controller-in-ASPNet-MVC-using-AngularJS/https://www.aspforums.net:443/Threads/525362/Pass-Send-DropDownList-selected-Value-to-Controller-in-ASPNet-MVC-using-AngularJS/Tue, 27 Nov 2018 03:33:50 GMTHow to Print a page or DIV using AngularJS<table style="height: 132px;" width="250"> <tbody> <tr> <td>Product</td> <td>Date</td> <td>Time</td> </tr> <tr> <td>juice</td> <td>2015-02-25</td> <td>14:00:00</td> </tr> <tr> <td>cheese</td> <td>2015-02-25</td> <td>07:00:00</td> </tr> <tr> <td>CHIPS</td> <td>2015-02-25</td> <td>16:00:00</td> </tr> <tr> <td>&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> </tr> </tbody> </table> <p>i have the above table that is displayed on a web page. i want to have a button that when its clicked it must call a function to print out just the table. how do i achieve this? do i have to send this data to a text file or something first? but i need to do it in angular js.</p> <p>i have a function that displays the above table as follows&nbsp;</p> <pre class="brush: js">function Report($http) { var self = this; self.$http = $http; self.GetReport = function () { var result = Ajax.Get(self.$http, { url: GetReportjson, success: function (data) { self.DisplayReport = data; } }).error(function () { alert(&#34; error!&#34;); }); } </pre> <p>&nbsp;</p>https://www.aspforums.net:443/Threads/177845/How-to-Print-a-page-or-DIV-using-AngularJS/https://www.aspforums.net:443/Threads/177845/How-to-Print-a-page-or-DIV-using-AngularJS/Wed, 25 Feb 2015 02:09:22 GMTGet url path without querystring using AngularJS in ASP.Net<p>Hi,</p> <p>When try get url&nbsp;path (home.html or page.html) with</p> <p><strong>var url = $location.path();</strong></p> <p>on my current path in browser add this&nbsp;<strong>#/home.html</strong></p> <p>and url look this:&nbsp;<a href="http://localhost:12241/home.html#/home.html">http://localhost:12241/home.html#/home.html</a></p> <p>i want only&nbsp;<a href="http://localhost:12241/home.html#/home.html">http://localhost:12241/home.html</a></p> <p>What is this, how solve this?</p>https://www.aspforums.net:443/Threads/206684/Get-url-path-without-querystring-using-AngularJS-in-ASPNet/https://www.aspforums.net:443/Threads/206684/Get-url-path-without-querystring-using-AngularJS-in-ASPNet/Wed, 15 Jun 2016 06:35:19 GMTGet checked CheckBox rows and store in array variable in AngularJS<p>after clicking of taxes pop up it can display id ,chekcbox and value textboxes i want to save only selected check box values to above row for n no of rows i can do like this</p> <p>before clicking of add function in taxes we have some values on popup</p> <p>i want to save only selected checkbox values to above row</p> <pre class="brush: sql">CREATE TABLE [dbo].[AutoPopList]( [id] [int] IDENTITY(1,1) NOT NULL, [value] [numeric](18, 0) NULL ) ON [PRIMARY] GO</pre> <pre class="brush: csharp">public JsonResult getAll1() { List&lt;AutoPopList&gt; Emp = db.AutoPopLists.ToList(); return Json(Emp, JsonRequestBehavior.AllowGet); }</pre> <pre class="brush: html">@{ Layout = null; } &lt;html&gt; &lt;head&gt; &lt;title&gt;&lt;/title&gt; &lt;/head&gt; &lt;body&gt; &lt;link rel=&#34;stylesheet&#34; href=&#34;https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css&#34;&gt; &lt;script src=&#34;https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js&#34;&gt;&lt;/script&gt; &lt;script 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;//ajax.googleapis.com/ajax/libs/angularjs/1.3.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, RegistrationService) { //Loads all Employee records when page loads loadEmployees(); function loadEmployees() { var EmployeeRecords = RegistrationService.gettaxes(); EmployeeRecords.then(function (d) { //success $scope.taxes = d.data; }, function () { alert(&#34;Error occured while fetching employee list...&#34;); }); } $scope.Customers = []; $scope.taxes = []; $scope.Add = function () { loadEmployees(); //Add the new item to the Array. var customer = {}; customer.Name = $scope.Name; customer.Country = $scope.Country; customer.taxes = $scope.taxes; $scope.Customers.push(customer); //Clear the TextBoxes. $scope.Name = &#34;&#34;; $scope.Country = &#34;&#34;; }; app.service(&#34;RegistrationService&#34;, function ($http) { //get All taxes this.gettaxes = function () { return $http.get(&#34;/dynamicaalyaddremove/getAll1&#34;); }; }); &lt;/script&gt; &lt;div ng-app=&#34;MyApp&#34; ng-controller=&#34;MyController&#34;&gt; &lt;table cellpadding=&#34;0&#34; cellspacing=&#34;0&#34;&gt; &lt;tr&gt; &lt;th&gt;Name&lt;/th&gt; &lt;th&gt;Country&lt;/th&gt; &lt;th&gt;taxes&lt;/th&gt; &lt;th&gt;&amp;nbsp;&lt;/th&gt; &lt;/tr&gt; &lt;tbody ng-repeat=&#34;m in Customers&#34;&gt; &lt;tr&gt; &lt;td&gt;{{m.Name}}&#34;&lt;/td&gt; &lt;td&gt;{{m.Country}}&lt;/td&gt; @*&lt;td value=&#34;{{m.subitems}}&#34;&gt;&lt;button type=&#34;button&#34; data-ng-model=&#34;subitems&#34; data-toggle=&#34;modal&#34; data-target=&#34;#popup&#34;&gt;Click&lt;/button&gt;&lt;/td&gt;*@ &lt;td value=&#34;{{m.subitems1}}&#34;&gt; &lt;button type=&#34;button&#34; class=&#34;btn btn-primary&#34; ng-init=&#34;clicked=false&#34; ng-click=&#34;clicked=!clicked&#34;&gt; View Orders &lt;/button&gt; &lt;div class=&#34;modal fade in&#34; aria-hidden=&#34;false&#34; style=&#34;display: block;&#34; ng-show=&#34;clicked&#34;&gt; &lt;div class=&#34;modal-dialog&#34;&gt; &lt;div class=&#34;modal-content&#34;&gt; &lt;div class=&#34;modal-header&#34;&gt; &lt;button type=&#34;button&#34; class=&#34;close&#34; ng-click=&#34;clicked=false&#34;&gt; &times; &lt;/button&gt; &lt;h4 class=&#34;modal-title&#34;&gt; Order Details &lt;/h4&gt; &lt;/div&gt; &lt;div class=&#34;modal-body&#34;&gt; &lt;table class=&#34;table table-condensed&#34;&gt; &lt;thead&gt; &lt;tr style=&#34;padding-left: 10px; padding-right: 10px;&#34; class=&#34;active&#34;&gt; &lt;th class=&#34;thick-line&#34; style=&#34;padding-left: 10px; padding-right: 20px; padding-top: 6px; padding-bottom: 6px;&#34;&gt; id &lt;/th&gt; &lt;th style=&#34;padding-left: 10px; padding-right: 10px;&#34; class=&#34;thick-line&#34;&gt; Value &lt;/th&gt; &lt;th style=&#34;padding-left: 10px; padding-right: 10px;&#34; class=&#34;thick-line&#34;&gt; Action &lt;/th&gt; &lt;/tr&gt; &lt;/thead&gt; &lt;tbody ng-repeat=&#34;o in m.taxes&#34;&gt; &lt;tr&gt; &lt;td&gt; {{o.id}} &lt;/td&gt; &lt;td&gt; &lt;span ng-show=&#34;editOrder != true&#34;&gt;{{o.value}}&lt;/span&gt; &lt;input ng-show=&#34;editOrder&#34; type=&#34;text&#34; ng-model=&#34;o.value&#34; class=&#34;form-control&#34; /&gt; &lt;/td&gt; &lt;td&gt; &lt;button class=&#34;btn btn-primary&#34; type=&#34;button&#34; ng-show=&#34;editOrder != true &amp;&amp; editingOrder != true&#34; id=&#34;Button1&#34; ng-click=&#34;editOrder = true; EditOrder(o)&#34;&gt; &lt;i class=&#34;fa fa-fw fa-pencil&#34;&gt;&lt;/i&gt; &lt;/button&gt; &lt;button class=&#34;btn btn-primary&#34; type=&#34;button&#34; ng-show=&#34;editOrder&#34; id=&#34;Button2&#34; ng-click=&#34;editOrder = false; SaveOrder($index)&#34;&gt; &lt;i class=&#34;fa fa-save&#34;&gt;&lt;/i&gt; &lt;/button&gt; &lt;/td&gt; &lt;/tr&gt; &lt;/tbody&gt; &lt;/table&gt; &lt;/div&gt; &lt;div class=&#34;modal-footer&#34;&gt; &lt;button type=&#34;button&#34; class=&#34;btn btn-primary&#34; ng-click=&#34;clicked=false&#34;&gt; Ok &lt;/button&gt; &lt;/div&gt; &lt;/div&gt; &lt;/div&gt; &lt;/div&gt; &lt;/td&gt; &lt;td&gt; &lt;input type=&#34;button&#34; ng-click=&#34;Remove($index)&#34; value=&#34;Remove&#34; /&gt; &lt;/td&gt; &lt;/tr&gt; &lt;/tbody&gt; &lt;tfoot&gt; &lt;tr&gt; &lt;td&gt;&lt;input type=&#34;text&#34; ng-model=&#34;Name&#34; /&gt;&lt;/td&gt; &lt;td&gt;&lt;input type=&#34;text&#34; ng-model=&#34;Country&#34; /&gt;&lt;/td&gt; &lt;td&gt;&lt;button type=&#34;button&#34; ng-model=&#34;subitems1&#34; data-toggle=&#34;modal&#34; data-target=&#34;#popup1&#34;&gt;Click&lt;/button&gt;&lt;/td&gt; &lt;td&gt;&lt;input type=&#34;button&#34; ng-click=&#34;Add()&#34; value=&#34;Add&#34; /&gt;&lt;/td&gt; &lt;/tr&gt; &lt;/tfoot&gt; &lt;/table&gt; &lt;div class=&#34;modal fade&#34; id=&#34;popup1&#34; role=&#34;dialog&#34;&gt; &lt;div class=&#34;modal-dialog&#34;&gt; &lt;div class=&#34;modal-content&#34;&gt; &lt;div class=&#34;modal-header&#34;&gt; &lt;button type=&#34;button&#34; class=&#34;close&#34; data-dismiss=&#34;modal&#34;&gt;&times;&lt;/button&gt; &lt;h4 class=&#34;modal-title&#34;&gt;Modal Header&lt;/h4&gt; &lt;/div&gt; &lt;div class=&#34;modal-body&#34;&gt; &lt;div class=&#34;s2vk-container&#34;&gt; &lt;div class=&#34;row&#34;&gt; &lt;div class=&#34;col-md-8&#34;&gt; &lt;div class=&#34;panel panel-default&#34;&gt; &lt;table class=&#34;table table-condensed&#34;&gt; &lt;thead&gt; &lt;tr style=&#34;padding-left:10px; padding-right:10px;&#34; class=&#34;active&#34;&gt; &lt;th class=&#34;thick-line&#34; style=&#34;padding-left:10px; padding-right:20px; padding-top:6px; padding-bottom:6px;&#34;&gt;Id&lt;/th&gt; &lt;th class=&#34;thick-line&#34; style=&#34;padding-left:10px; padding-right:20px; padding-top:6px; padding-bottom:6px;&#34;&gt;Checkbox&lt;/th&gt; &lt;th style=&#34;padding-left:10px; padding-right:10px;&#34; class=&#34;thick-line&#34;&gt;Value&lt;/th&gt; &lt;th style=&#34;padding-left:10px; padding-right:10px;&#34; class=&#34;thick-line&#34;&gt;Action&lt;/th&gt; &lt;/tr&gt; &lt;/thead&gt; &lt;tbody&gt; &lt;tr style=&#34;padding-left:20px; padding-right:20px;&#34; ng-model=&#34;myData3&#34; ng-repeat=&#34;subitem in taxes&#34;&gt; &lt;td&gt;{{subitem.id}}&lt;/td&gt; &lt;td&gt;&lt;input type=&#34;checkbox&#34; name=&#34;vehicle1&#34; ng-model=&#34;checkbox&#34; &gt; &lt;/td&gt; &lt;td&gt; &lt;span ng-show=&#34;editOrder != true&#34;&gt;{{subitem.value}}&lt;/span&gt; &lt;input ng-show=&#34;editOrder&#34; type=&#34;text&#34; ng-model=&#34;subitem.value&#34; class=&#34;form-control&#34; /&gt; &lt;/td&gt; &lt;td&gt; &lt;button class=&#34;btn btn-primary&#34; type=&#34;button&#34; ng-show=&#34;editOrder != true &amp;&amp; editingOrder != true&#34; id=&#34;Button1&#34; ng-click=&#34;editOrder = true; EditOrder(subitem)&#34;&gt; &lt;i class=&#34;fa fa-fw fa-pencil&#34;&gt;&lt;/i&gt; &lt;/button&gt; &lt;button class=&#34;btn btn-primary&#34; type=&#34;button&#34; ng-show=&#34;editOrder&#34; id=&#34;Button2&#34; ng-click=&#34;editOrder = false; SaveOrder($index)&#34;&gt; &lt;i class=&#34;fa fa-save&#34;&gt;&lt;/i&gt; &lt;/button&gt; &lt;/td&gt; &lt;/tr&gt; &lt;/tbody&gt; &lt;/table&gt; &lt;/div&gt; &lt;/div&gt; &lt;/div&gt; &lt;/div&gt; &lt;/div&gt; &lt;div class=&#34;modal-footer&#34;&gt; &lt;button type=&#34;button&#34; class=&#34;btn btn-default&#34; data-dismiss=&#34;modal&#34;&gt;Close&lt;/button&gt; &lt;/div&gt; &lt;/div&gt; &lt;/div&gt; &lt;/div&gt; &lt;/div&gt; &lt;/body&gt; &lt;/html&gt;</pre> <p>&nbsp;</p>https://www.aspforums.net:443/Threads/192913/Get-checked-CheckBox-rows-and-store-in-array-variable-in-AngularJS/https://www.aspforums.net:443/Threads/192913/Get-checked-CheckBox-rows-and-store-in-array-variable-in-AngularJS/Tue, 20 Nov 2018 21:29:05 GMTEdit Update Nested Table Parent Child Rows on Button Click in AngularJS<p>If we run code above and it can dispaly one screen</p> <p>In that screen i need to edit a row based upon id&nbsp;</p> <p>for parent and child row i need edit functionality</p> <pre class="brush: html">@{ Layout = null; } &lt;html&gt; &lt;head&gt; &lt;title&gt;&lt;/title&gt; &lt;/head&gt; &lt;body&gt; &lt;link rel=&#34;stylesheet&#34; href=&#34;https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css&#34;&gt; &lt;script src=&#34;https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js&#34;&gt;&lt;/script&gt; &lt;script 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;//ajax.googleapis.com/ajax/libs/angularjs/1.3.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, $window) { $scope.Customers = [ { Name: &#34;John Hammond&#34;, Country: &#34;United States&#34;, Orders: [ { OrderId: 10248, Freight: 32.38, ShipCountry: &#39;France&#39; }, { OrderId: 10249, Freight: 12.43, ShipCountry: &#39;Japan&#39; }, { OrderId: 10250, Freight: 66.35, ShipCountry: &#39;Russia&#39; } ] }, ]; $scope.Orders = []; $scope.Add = function () { //Add the new item to the Array. var customer = {}; customer.Name = $scope.Name; customer.Country = $scope.Country; customer.Orders = $scope.Orders; $scope.Customers.push(customer); $scope.Orders = []; //Clear the TextBoxes. $scope.Name = &#34;&#34;; $scope.Country = &#34;&#34;; }; $scope.add2 = function () { var items = {}; items.OrderId = $scope.OrderId; items.Freight = $scope.Freight; items.ShipCountry = $scope.ShipCountry; $scope.Orders.push(items); $scope.OrderId = &#34;&#34;; $scope.Freight = &#34;&#34;; $scope.ShipCountry = &#34;&#34;; } $scope.Remove = function (index) { //Find the record using Index from Array. var name = $scope.Customers[index].Name; if ($window.confirm(&#34;Do you want to delete: &#34; + name)) { //Remove the item from Array using Index. $scope.Customers.splice(index, 1); } } $scope.remove1 = function (index) { var name = $scope.Orders[index].OrderId; if ($window.confirm(&#34;Do you want to delete: &#34; + name)) { $scope.Orders.splice(index, 1); } } }); &lt;/script&gt; &lt;div ng-app=&#34;MyApp&#34; ng-controller=&#34;MyController&#34;&gt; &lt;table cellpadding=&#34;0&#34; cellspacing=&#34;0&#34;&gt; &lt;tr&gt; &lt;th&gt;Name&lt;/th&gt; &lt;th&gt;Country&lt;/th&gt; &lt;th&gt;Orders&lt;/th&gt; &lt;th&gt;&amp;nbsp;&lt;/th&gt; &lt;/tr&gt; &lt;tbody ng-repeat=&#34;m in Customers&#34;&gt; &lt;tr&gt; &lt;td&gt;{{m.Name}}&#34;&lt;/td&gt; &lt;td&gt;{{m.Country}}&lt;/td&gt; @*&lt;td value=&#34;{{m.subitems}}&#34;&gt;&lt;button type=&#34;button&#34; data-ng-model=&#34;subitems&#34; data-toggle=&#34;modal&#34; data-target=&#34;#popup&#34;&gt;Click&lt;/button&gt;&lt;/td&gt;*@ &lt;td value=&#34;{{m.subitems}}&#34;&gt; &lt;table class=&#34;table table-bordered&#34; cellpadding=&#34;0&#34; cellspacing=&#34;0&#34;&gt; &lt;tr&gt; &lt;th&gt;Order Id&lt;/th&gt; &lt;th&gt;Freight&lt;/th&gt; &lt;th&gt;ShipCountry&lt;/th&gt; &lt;/tr&gt; &lt;tbody ng-repeat=&#34;o in m.Orders&#34;&gt; &lt;tr&gt; &lt;td&gt;{{o.OrderId}}&lt;/td&gt; &lt;td&gt;{{o.Freight}}&lt;/td&gt; &lt;td&gt;{{o.ShipCountry}}&lt;/td&gt; &lt;/tr&gt; &lt;/tbody&gt; &lt;/table&gt; &lt;/td&gt; &lt;td&gt;&lt;input type=&#34;button&#34; ng-click=&#34;Remove($index)&#34; value=&#34;Remove&#34; /&gt;&lt;/td&gt; &lt;/tr&gt; &lt;/tbody&gt; &lt;tfoot&gt; &lt;tr&gt; &lt;td&gt;&lt;input type=&#34;text&#34; ng-model=&#34;Name&#34; /&gt;&lt;/td&gt; &lt;td&gt;&lt;input type=&#34;text&#34; ng-model=&#34;Country&#34; /&gt;&lt;/td&gt; &lt;td&gt;&lt;button type=&#34;button&#34; ng-model=&#34;subitems&#34; data-toggle=&#34;modal&#34; data-target=&#34;#popup&#34;&gt;Click&lt;/button&gt;&lt;/td&gt; &lt;td&gt;&lt;input type=&#34;button&#34; ng-click=&#34;Add()&#34; value=&#34;Add&#34; /&gt;&lt;/td&gt; &lt;/tr&gt; &lt;/tfoot&gt; &lt;/table&gt; &lt;div class=&#34;modal fade&#34; id=&#34;popup&#34; role=&#34;dialog&#34;&gt; &lt;div class=&#34;modal-dialog&#34;&gt; &lt;div class=&#34;modal-content&#34;&gt; &lt;div class=&#34;modal-header&#34;&gt; &lt;button type=&#34;button&#34; class=&#34;close&#34; data-dismiss=&#34;modal&#34;&gt;&times;&lt;/button&gt; &lt;h4 class=&#34;modal-title&#34;&gt;Modal Header&lt;/h4&gt; &lt;/div&gt; &lt;div class=&#34;modal-body&#34;&gt; &lt;div class=&#34;s2vk-container&#34;&gt; &lt;div class=&#34;row&#34;&gt; &lt;div class=&#34;col-md-8&#34;&gt; &lt;div class=&#34;panel panel-default&#34;&gt; &lt;table class=&#34;table table-condensed&#34;&gt; &lt;thead&gt; &lt;tr style=&#34;padding-left:10px; padding-right:10px;&#34; class=&#34;active&#34;&gt; &lt;th class=&#34;thick-line&#34; style=&#34;padding-left:10px; padding-right:20px; padding-top:6px; padding-bottom:6px;&#34;&gt;OrderId&lt;/th&gt; &lt;th style=&#34;padding-left:10px; padding-right:10px;&#34; class=&#34;thick-line&#34;&gt;Freight&lt;/th&gt; &lt;th style=&#34;padding-left:10px; padding-right:10px;&#34; class=&#34;thick-line&#34;&gt;ShipCountry&lt;/th&gt; &lt;th style=&#34;padding-left:10px; padding-right:10px;&#34; class=&#34;thick-line&#34;&gt; &lt;/th&gt; &lt;/tr&gt; &lt;/thead&gt; &lt;tbody&gt; &lt;tr style=&#34;padding-left:20px; padding-right:20px;&#34; ng-model=&#34;myData2&#34; ng-repeat=&#34;subitem in Orders&#34;&gt; &lt;td&gt;{{subitem.OrderId}}&lt;/td&gt; &lt;td&gt;{{subitem.Freight}}&lt;/td&gt; &lt;td&gt;{{subitem.ShipCountry}}&lt;/td&gt; &lt;td&gt; &lt;button type=&#34;button&#34; class=&#34;btn btn-sm btn-danger&#34; ng-click=&#34;remove1($index)&#34; readonly=readonly&gt;Delete&lt;/button&gt; &lt;/td&gt; &lt;/tr&gt; &lt;/tbody&gt; &lt;tfoot&gt; &lt;tr style=&#34;padding-left:20px; padding-right:20px;&#34;&gt; @*&lt;td&gt;&lt;input type=&#34;text&#34; ng-model=&#34;Id&#34;/&gt;&lt;/td&gt;*@ &lt;td&gt; &lt;input type=&#34;text&#34; class=&#34;input-sm form-control&#34; ng-model=&#34;OrderId&#34; /&gt; &lt;/td&gt; &lt;td&gt; &lt;input type=&#34;text&#34; class=&#34;input-sm form-control&#34; ng-model=&#34;Freight&#34; /&gt; &lt;/td&gt; &lt;td&gt; &lt;input type=&#34;text&#34; class=&#34;input-sm form-control&#34; ng-model=&#34;ShipCountry&#34; /&gt; &lt;/td&gt; &lt;td&gt; &lt;button type=&#34;button&#34; class=&#34;btn btn-primary&#34; ng-click=&#34;add2()&#34;&gt;Add&lt;/button&gt; &lt;/td&gt; &lt;/tr&gt; &lt;/tfoot&gt; &lt;/table&gt; &lt;/div&gt; &lt;/div&gt; &lt;/div&gt; &lt;/div&gt; &lt;/div&gt; &lt;div class=&#34;modal-footer&#34;&gt; &lt;button type=&#34;button&#34; class=&#34;btn btn-default&#34; data-dismiss=&#34;modal&#34;&gt;Close&lt;/button&gt; &lt;/div&gt; &lt;/div&gt; &lt;/div&gt; &lt;/div&gt; &lt;/div&gt; &lt;/body&gt; &lt;/html&gt;</pre> <p>&nbsp;</p>https://www.aspforums.net:443/Threads/694292/Edit-Update-Nested-Table-Parent-Child-Rows-on-Button-Click-in-AngularJS/https://www.aspforums.net:443/Threads/694292/Edit-Update-Nested-Table-Parent-Child-Rows-on-Button-Click-in-AngularJS/Fri, 16 Nov 2018 03:23:12 GMTDynamically add remove Rows in nested Table in AngularJS<p>see we have 3 text boxes name,country and subitems</p> <p>after clicking of subitems one popup should appear in that pop up again we have 3 text boxes&nbsp;&nbsp;OrderId,Freight,ShipCountry&nbsp;</p> <p>Right now my requirement is i want dynamically add/remove rows in parent row in the same way</p> <p>for chikd row also we have&nbsp;dynamically add/remove rows</p> <p>subitems is a child row&nbsp;</p> <p>I haven't wrote any code for pop up&nbsp;</p> <p>I don't know where&nbsp; to&nbsp; start&nbsp; popup code for child row&nbsp;</p> <p>after clicking of subitems popup textbox also i need to add/remove n no of rows&nbsp;</p> <pre class="brush: html">@{ Layout = null; } &lt;!DOCTYPE html PUBLIC &#34;-//W3C//DTD XHTML 1.0 Transitional//EN&#34; &#34;http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd&#34;&gt; &lt;html&gt; &lt;head&gt; &lt;title&gt;&lt;/title&gt; &lt;/head&gt; &lt;body&gt; &lt;script type=&#34;text/javascript&#34; src=&#34;//ajax.googleapis.com/ajax/libs/angularjs/1.3.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, $window) { $scope.Customers = [ { Name: &#34;John Hammond&#34;, Country: &#34;United States&#34;, Orders: [ { OrderId: 10248, Freight: 32.38, ShipCountry: &#39;France&#39; }, { OrderId: 10249, Freight: 12.43, ShipCountry: &#39;Japan&#39; }, { OrderId: 10250, Freight: 66.35, ShipCountry: &#39;Russia&#39; } ] }, { Name: &#34;Mudassar Khan&#34;, Country: &#34;India&#34;, Orders: [ { OrderId: 10248, Freight: 32.38, ShipCountry: &#39;France&#39; }, { OrderId: 10249, Freight: 12.43, ShipCountry: &#39;Japan&#39; }, { OrderId: 10250, Freight: 66.35, ShipCountry: &#39;Russia&#39; } ] }, { Name: &#34;Suzanne Mathews&#34;, Country: &#34;France&#34;, Orders: [ { OrderId: 10248, Freight: 32.38, ShipCountry: &#39;France&#39; }, { OrderId: 10249, Freight: 12.43, ShipCountry: &#39;Japan&#39; }, { OrderId: 10250, Freight: 66.35, ShipCountry: &#39;Russia&#39; } ] }, { Name: &#34;Robert Schidner&#34;, Country: &#34;Russia&#34;, Orders: [ { OrderId: 10248, Freight: 32.38, ShipCountry: &#39;France&#39; }, { OrderId: 10249, Freight: 12.43, ShipCountry: &#39;Japan&#39; }, { OrderId: 10250, Freight: 66.35, ShipCountry: &#39;Russia&#39; } ] } ]; $scope.Add = function () { //Add the new item to the Array. var customer = {}; customer.Name = $scope.Name; customer.Country = $scope.Country; $scope.Customers.push(customer); //Clear the TextBoxes. $scope.Name = &#34;&#34;; $scope.Country = &#34;&#34;; }; $scope.Remove = function (index) { //Find the record using Index from Array. var name = $scope.Customers[index].Name; if ($window.confirm(&#34;Do you want to delete: &#34; + name)) { //Remove the item from Array using Index. $scope.Customers.splice(index, 1); } } }); &lt;/script&gt; &lt;div ng-app=&#34;MyApp&#34; ng-controller=&#34;MyController&#34;&gt; &lt;table cellpadding=&#34;0&#34; cellspacing=&#34;0&#34;&gt; &lt;tr&gt; &lt;th&gt;Name&lt;/th&gt; &lt;th&gt;Country&lt;/th&gt; &lt;th&gt;subitems&lt;/th&gt; &lt;/tr&gt; &lt;tbody ng-repeat=&#34;m in Customers&#34;&gt; &lt;tr&gt; &lt;td&gt;&lt;input type=&#34;text&#34; value=&#34;{{m.Name}}&#34; /&gt;&lt;/td&gt; &lt;td&gt;&lt;input type=&#34;text&#34; value=&#34;{{m.Country}}&#34; /&gt;&lt;/td&gt; &lt;td&gt; &lt;table cellpadding=&#34;0&#34; cellspacing=&#34;0&#34;&gt; &lt;tr&gt; &lt;th&gt;Order Id&lt;/th&gt; &lt;th&gt;Freight&lt;/th&gt; &lt;th&gt;ShipCountry&lt;/th&gt; &lt;/tr&gt; &lt;tbody ng-repeat=&#34;o in m.Orders&#34;&gt; &lt;tr&gt; &lt;td&gt;{{o.OrderId}}&lt;/td&gt; &lt;td&gt;{{o.Freight}}&lt;/td&gt; &lt;td&gt;{{o.ShipCountry}}&lt;/td&gt; &lt;/tr&gt; &lt;/tbody&gt; &lt;/table&gt; &lt;/td&gt; &lt;td&gt;&lt;input type=&#34;button&#34; ng-click=&#34;Remove($index)&#34; value=&#34;Remove&#34; /&gt;&lt;/td&gt; &lt;/tr&gt; &lt;/tbody&gt; &lt;tfoot&gt; &lt;tr&gt; &lt;td&gt;&lt;input type=&#34;text&#34; ng-model=&#34;Name&#34; /&gt;&lt;/td&gt; &lt;td&gt;&lt;input type=&#34;text&#34; ng-model=&#34;Country&#34; /&gt;&lt;/td&gt; &lt;td&gt;&lt;input type=&#34;button&#34; ng-click=&#34;Add()&#34; value=&#34;Add&#34; /&gt;&lt;/td&gt; &lt;/tr&gt; &lt;/tfoot&gt; &lt;/table&gt; &lt;/div&gt; &lt;/body&gt; &lt;/html&gt;</pre> <p>&nbsp;</p>https://www.aspforums.net:443/Threads/193879/Dynamically-add-remove-Rows-in-nested-Table-in-AngularJS/https://www.aspforums.net:443/Threads/193879/Dynamically-add-remove-Rows-in-nested-Table-in-AngularJS/Wed, 14 Nov 2018 04:56:41 GMTMerge Table Rows for same column value using AngularJS in ASP.Net<p>I want to display record on my html page like this.</p> <table> <tbody> <tr> <td width="399"> <p>Invoice No 1</p> </td> <td width="399"> <p>Product 1</p> </td> </tr> <tr> <td width="399"> <p>&nbsp;</p> </td> <td width="399"> <p>Product 2</p> </td> </tr> <tr> <td width="399"> <p>&nbsp;</p> </td> <td width="399"> <p>Product 3</p> </td> </tr> <tr> <td width="399"> <p>Invoice No 2</p> </td> <td width="399"> <p>Product 1</p> </td> </tr> <tr> <td width="399"> <p>Invoice No 3</p> </td> <td width="399"> <p>Product 1</p> </td> </tr> <tr> <td width="399"> <p>Invoice No 4</p> </td> <td width="399"> <p>Product 1</p> </td> </tr> <tr> <td width="399"> <p>&nbsp;</p> </td> <td width="399"> <p>Product 2</p> </td> </tr> <tr> <td width="399"> <p>&nbsp;</p> </td> <td width="399"> <p>Product 3</p> </td> </tr> </tbody> </table> <p>&nbsp;I have this information in a list here's my code</p> <p>&nbsp;</p> <pre class="brush: csharp">static void Main(string[] args) { List&lt;Program&gt; listdata = new List&lt;Program&gt;(); listdata.Add(new Program { InvoiceNo=001, Product=&#34;Product1&#34;}); listdata.Add(new Program { InvoiceNo = 001, Product = &#34;Product2&#34; }); listdata.Add(new Program { InvoiceNo = 001, Product = &#34;Product3&#34; }); listdata.Add(new Program { InvoiceNo = 001, Product = &#34;Product4&#34; }); listdata.Add(new Program { InvoiceNo = 001, Product = &#34;Product5&#34; }); listdata.Add(new Program { InvoiceNo = 002, Product = &#34;Product1&#34; }); listdata.Add(new Program { InvoiceNo = 003, Product = &#34;Product1&#34; }); listdata.Add(new Program { InvoiceNo = 004, Product = &#34;Product1&#34; }); listdata.Add(new Program { InvoiceNo = 004, Product = &#34;Product2&#34; }); listdata.Add(new Program { InvoiceNo = 004, Product = &#34;Product3&#34; }); foreach (var item in listdata) { Console.WriteLine(String.Format(&#34;Invoice No : {0} Product : {1}&#34;,item.InvoiceNo,item.Product)); } Console.ReadLine(); }</pre> <p>Had used foreach for example purpose,have to display data on a html page in ng-repeat in angular js am not able to arrange the required list in this format as displayed above.</p>https://www.aspforums.net:443/Threads/110395/Merge-Table-Rows-for-same-column-value-using-AngularJS-in-ASPNet/https://www.aspforums.net:443/Threads/110395/Merge-Table-Rows-for-same-column-value-using-AngularJS-in-ASPNet/Sun, 09 Apr 2017 02:08:19 GMT