Download Project

Post your any code related problem to www.abctutorial.com

Follow the previous video and articles to complete the POS tutorials

Step-1:

• Add a method Inside the HomeController.cs

        [AuthorizationFilter]
        public ActionResult InvoiceList()
        {
            return View();
        }

• Add a view called InvoiceList.cs

@{
    ViewBag.Title = "InvoiceList";
    Layout = "~/Views/Shared/_Layout.cshtml";
}

<div class="col-xl-12 col-md-12 mb-12" ng-controller="HomeInvoiceList">
    <h2>Sales record</h2>
    <div class="card border-left-primary shadow h-100 py-2">
        <div class="card-body">
            <div class="row no-gutters align-items-center">
                <div class="col mr-2">
                    
                    <table class="table table-bordered" id="dataTable" width="100%" cellspacing="0">
                        <thead>
                            <tr>
                                <th>Order No</th>
                                <th>
                                    Customer name
                                </th>
                                <th>
                                    Customer Phone
                                </th>
                                <th>
                                    Sales Date
                                </th>
                                <th>
                                   Action
                                </th>
                            </tr>
                        </thead>
                        <tbody>
                            <tr ng-repeat="item in SalesList">
                                <td>{{item.OrderNo}}</td>
                                <td>{{item.CustomerName}}</td>
                                <td>{{item.CustomerPhone}} </td>
                                <td> {{item.OrderDate}}</td>
                                <td><a href="#" class="btn btn-success">Detail</a></td>
                            </tr>
                        </tbody>
                    </table>
                </div>
            </div>
        </div>
    </div>
</div>
<script src="~/Scripts/Home/HomeInvoiceListController.js"></script>

Step-2:

• Add a JavaScript file called HomeInvoiceListController.js and add below code to the file.

 (function () {
    app.controller('HomeInvoiceList', function ($scope, $http, $filter) {
        var init = function () {
            GetAllSales();
        }; //end of init
        init(); //init is called

        function GetAllSales() {
            $http.get('/Home/GetAllSales')
                .then(function (response) {
                    var data = response.data;
                    $scope.SalesList = data;
                });
        }
    });
}).call(angular);

Step-3:

• Now run the project