
@{
    Layout = null;
}

<!DOCTYPE html>

<html ng-app="app">
<head>
    <script src="~/Scripts/angular.min.js"></script>
    <script src="~/Scripts/jquery-2.1.4.min.js"></script>
    <script>
        var app = angular.module('app', []);
        app.controller('Controller', function ($scope, $http) {
            $scope.isShow = false;
            $scope.isShopShow = false;
            $scope.selectedConsoles = null;
            $scope.Consoles = [];
            $http({
                method: 'GET',
                url: '/Home/GetConsoles'                
            }).success(function (result) {
                $scope.Consoles = result;
            });
            $scope.GetGames = function ()
            {
                $scope.selectedGames = null;
                $scope.Games = [];

                $scope.isShopShow = false;
                //$scope.selectedShops = null;
                //$scope.Shops = [];

                $http({
                    method: 'GET',
                    url: '/Home/GetGames',
                    params: { ConsoleID: $scope.selectedConsoles }
                }).success(function (result) {
                    $scope.Games = result;
                    $scope.isShow = true;
                });
            }
            $scope.GetShops = function () {
                $scope.selectedShops = null;
                $scope.Shops = [];
                $http({
                    method: 'GET',
                    url: '/Home/GetShops',
                    params: { GameID: $scope.selectedGames }
                }).success(function (result) {
                    $scope.Shops = result;
                    $scope.isShopShow = true;
                });
            }
        });
    </script>
    <meta name="viewport" content="width=device-width" />
    <title>Index</title>
</head>
<body>
    <div ng-controller="Controller"> 
        <select ng-model="selectedConsoles" ng-options="item.Id as item.Name for item in Consoles" ng-change="GetGames()">
            <option value="">Konsole Seçiniz</option>
        </select>
        <select ng-model="selectedGames" ng-options="item.Id as item.Name for item in Games" ng-show="isShow" ng-change="GetShops()">
            <option value="">Oyun Seçiniz</option>
        </select>
        <select ng-model="selectedShops" ng-options="item.Id as item.Name for item in Shops" ng-show="isShopShow">
            <option value="">Dükkan Seçiniz</option>
        </select>
    </div>
</body>
</html>
