@model IEnumerable<Fab2ApprovalSystem.Models.Training>
@{IEnumerable<Fab2ApprovalSystem.Models.TrainingGroup> trainingGroups = ViewBag.TrainingGroups;}
<style>

    tr:nth-child(even) {
        background: #CCC
    }

    tr:nth-child(odd) {
        background: #FFF
    }
</style>
<button class="btn btn-default btn-primary" id="ResetFilters">Reset Filters</button>
<table class="table">
    <tr>
        <th>
            ECN#
        </th>
        <th>
            ECN Title
        </th>
        <th>
            Started Date
        </th>

        <th>
            Completed Date
        </th>
        <th>
            Assigned Groups
            <br />
            @Html.DropDownList("GroupFilter", new SelectList(trainingGroups, "TrainingGroupID", "TrainingGroupName"), "- Select Group Filter -")
        </th>
        <th>
            Status
            <br />
            <select id="StatusFilter">
                <option value="0">- Select an option -</option>
                <option value="1">Complete</option>
                <option value="2">In Progress</option>
                <option value="3">Cancelled</option>
            </select>
        </th>
        <th>

        </th>
    </tr>
    @foreach (var item in Model)
    {
        <tr>
            <td>
                @Html.DisplayFor(modelItem => item.ECN)
            </td>
            <td>
                @Html.DisplayFor(modelItem => item.Title)
            </td>
            <td>
                @Html.DisplayFor(modelItem => item.StartedDate)
            </td>

            <td>
                @Html.DisplayFor(modelItem => item.CompletedDate)
            </td>
            <td>
                @Html.DisplayFor(modelItem => item.ECNTrainingGroups)

            </td>
            @if (item.Deleted == true)
            {
                <td>Cancelled</td>
            }
            else
            {
                if (item.Status == true)
                {
                    <td>Complete</td>
                }
                else
                {
                    <td>In Progress</td>
                }
            }

            <td>
                <button class="btn btn-default btn-primary" id="ViewTraining" onclick="ViewTraining(@item.TrainingID)">View Training</button>
            </td>

        </tr>
    }

</table>
<script type="text/javascript">
    $('#GroupFilter').on('change', function () {
        var SelectedGroup = document.getElementById('GroupFilter').value;
        var sendInfo = {
            filterType: 1,
            filterValue: SelectedGroup

        };
        //alert(SelectedUser);
        $.ajax({
            url: '@Url.Action("TrainingReportsView", "Training")',
            contentType: "application/json; charset=utf-8",
            type: 'POST',
            data: JSON.stringify(sendInfo),
            //dataType: "json",
            success: function(data) {

                    //alert('add success');
                    $("#DataDisplay").html(data);
                
        }
        });

    })
    $('#StatusFilter').on('change', function () {
            
        var SelectedStatus = document.getElementById('StatusFilter').value;
            if (SelectedStatus != '0') {
                var sendInfo = {
                filterType: 2,
                filterValue: SelectedStatus
            };
            $.ajax({
                url: '@Url.Action("TrainingReportsView", "Training")',
                contentType: "application/json; charset=utf-8",
                type: 'POST',
                data: JSON.stringify(sendInfo),
                success: function(data) {
                    $("#DataDisplay").html(data);
                }
            });
        }
    })
    function ViewTraining(trainingId) {
        //var SelectedAssignment = document.getElementById('GroupFilter').value;
        var sendInfo = {
            trainingID: trainingId,
            groupFilter: '@ViewBag.GroupFilter'
        };
        //alert(SelectedUser);
        //alert('test')
        $.ajax({
            url: '@Url.Action("ViewTrainingAssignmentsReportView", "Training")',
            contentType: "application/json; charset=utf-8",
            type: 'POST',
            data: JSON.stringify(sendInfo),
            //dataType: "json",
            success: function(data) {

                    //alert('add success');
                    $("#DataDisplay").html(data);
                
        }
        });
    }
    $('#ResetFilters').on('click', function () {
        var SelectedGroup = document.getElementById('GroupFilter').value;
        var sendInfo = {
            filterType: 0,
            filterValue: ''

        };
        //alert(SelectedUser);
        $.ajax({
            url: '@Url.Action("TrainingReportsView", "Training")',
            contentType: "application/json; charset=utf-8",
            type: 'POST',
            data: JSON.stringify(sendInfo),
            //dataType: "json",
            success: function(data) {

                    //alert('add success');
                    $("#DataDisplay").html(data);
                
        }
        });

    })
</script>