@{
    ViewBag.Title = "EquipmentMobilization";
    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>Equipment Mobilization</h3>
        </div>
        <!-- /.box-header -->
        <div class="box-body">
            <div class="form-horizontal">
                <div class="form-group">

                    <div class="col-sm-3">
                        <b>Select Project</b>
                        @Html.DropDownList("EquipmentMonitorID", null, htmlAttributes: new { @class = "form-control select2", @onchange = "GetProjectData();" })
                    </div>
                    <div class="col-sm-2">
                        <b>Start Date</b>
                        <input type="text" id="Equip_StartDate" class="form-control" readonly />
                    </div>
                    <div class="col-sm-2">
                        <b>End Date</b>
                        <input type="text" id="Equip_EndDate" class="form-control" readonly />
                    </div>
                    <div class="col-sm-2">
                        <b>Actual Date</b>
                        <input type="text" id="Actual_Date" class="form-control" readonly />
                    </div>

                </div>
                <div class="form-group">
                    <div class="col-sm-12">
                        <div id="divEmployeeDetails">

                        </div>
                    </div>
                </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 src="~/Content/dateFormat.js"></script>
<script>
    function GetProjectData() {
        var EquipmentMonitorID = $("#EquipmentMonitorID").val();
        $.ajax({
            url: '/EquipmentMobilization/GetProjectMonitor',
            type: 'post',
            data: { EquipmentMonitorID: EquipmentMonitorID },
            success: function (response) {
                if (response != null) {
                    var len = response.length;
                    for (var i = 0; i < len; i++) {
                        var SDate = new Date(parseInt(response[i].Equip_StartDate.substr(6)));
                        var dtS = SDate.format("mm/dd/yyyy");
                        var EDate = new Date(parseInt(response[i].Equip_EndDate.substr(6)));
                        var dtE = EDate.format("mm/dd/yyyy");
                        var ActDate = new Date(parseInt(response[i].Actual_Date.substr(6)));
                        var dtAct = ActDate.format("mm/dd/yyyy");
                        $('#Equip_StartDate').val(dtS);
                        $('#Equip_EndDate').val(dtE);
                        $('#Actual_Date').val(dtAct);

                        $.ajax({
                            url: '/EquipmentMobilization/EquipmentMobilization',
                            type: 'post',
                            data: { Equip_StartDate: dtS, Equip_EndDate: dtAct, EquipmentMonitorID: EquipmentMonitorID },
                            success: function (data) {
                                $("#divEmployeeDetails").html(data);
                            },
                            error: function () {
                                $("#divEmployeeDetails").html("Page Not Loading..!");
                            }
                        });
                    }
                }
                else {
                    $("input[name='Equip_StartDate']").val("");
                    alert("This Project is not available in ProjectMonitor");
                }
            }
        });
    }
</script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.3/jquery.min.js"></script>
@*<script>
    function GetDetail() {
        var EquipmentMonitorID = $("#EquipmentMonitorID").val();
        var Equip_StartDate = $("#Equip_StartDate").val();
        var Equip_EndDate = $("#ActualDate").val();

        $.ajax({
            url: '/EquipmentMobilization/EquipmentMobilization',
            type: 'post',
            data: { Equip_StartDate: Equip_StartDate, Equip_EndDate: Equip_EndDate, EquipmentMonitorID: EquipmentMonitorID },
            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>

}