@model List<GASArabianERP.Models.EmployeeViewModel>
@{
    ViewBag.Title = "Index";
    Layout = "~/Views/Shared/_Layout.cshtml";
}
<section class="content">
    <div class="box box-primary">
        <div class="box-header">
            <h3 class="box-title"> <span class="widget-icon"> <i class="fa fa-table"></i> </span> Employee Details</h3>
            <a href="@Url.Action("Create", "Employee")" class="btn btn-success btn-fit-height pull-right">
                <i class="fa fa-plus"> Create New  </i>
            </a>
        </div>
        <!-- /.box-header -->
        <div class="form-horizontal">
            @*<div class="box-body">*@
            <div class="form-group">
                <div class="col-sm-1"></div>
                <div class="col-sm-3">

                    @Html.DropDownList("ProjectMonitorID", null, htmlAttributes: new { @class = "form-control select2" })
                </div>
                <div class="col-sm-4">
                    <button type="button" id="btnView" class="btn btn-primary"><i class="ace-icon fa fa-eye"></i> View</button>
                </div>
            </div>
            <div class="form-group">
                <div class="col-sm-12">
                    <fieldset>
                        <div id="divEmployeeDetails">

                        </div>

                    </fieldset>
                </div>
            </div>
        </div>
    </div>

</section>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6/jquery.min.js"></script>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script>
<link rel="Stylesheet" type="text/css" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css" />
<script>
    $(document).ready(function () {
        $.ajax({
            url: '/Employee/EmployeeDetails',
            type: 'post',
            data: { Search: 1 },
            success: function (data) {
                $("#divEmployeeDetails").html(data);
            },
            error: function () {
                $("#divEmployeeDetails").html("Page Not Loading..!");
            }
        });
    });
</script>
<script>
    $(function () {
        $("#btnView").on('click', function () {
            debugger;
            var ProjectMonitorID = $("#ProjectMonitorID").val();
            $.ajax({
                url: '/Employee/EmployeeDetails',
                type: 'post',
                data: { Search: ProjectMonitorID },
                success: function (data) {
                    $("#divEmployeeDetails").html(data);
                },
                error: function () {
                    $("#divEmployeeDetails").html("Page Not Loading..!");
                }
            });

        });
    });
</script>
@section scripts {
    <script type="text/javascript" src="https://cdn.datatables.net/buttons/2.2.2/js/dataTables.buttons.min.js"></script>
    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jszip/3.1.3/jszip.min.js"></script>
    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.53/pdfmake.min.js"></script>
    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.53/vfs_fonts.js"></script>
    <script type="text/javascript" src="https://cdn.datatables.net/buttons/2.2.2/js/buttons.html5.min.js"></script>
    <script type="text/javascript" src="https://cdn.datatables.net/buttons/2.2.2/js/buttons.print.min.js"></script>

}