Untitled

@model ModelFolder.Models.NewRedemptions
<head>
    <meta name="viewport" content="width=device-width" />
    <link rel="stylesheet" href="~/Content/bootstrap.paper.css" />

    @{
        ViewBag.Title = "New Redemption";
        Layout = "~/Views/Shared/_Layout.cshtml";
    }
</head>


<div class="container">

</div>
<div>
    <div style="margin-top: 60px;"></div>

    <h2>New Redemption</h2>

    <h3>Upload File</h3>

    @*@ViewBag.result*@

    @using (Html.BeginForm("Index", "NewRedemption", null, FormMethod.Post, new { enctype = "multipart/form-data", id = "redemptionForm" }))
    {
        @Html.AntiForgeryToken()
        @Html.ValidationSummary()

        <div class="form-group">
            <label class="control-label">Upload Files</label><br />
            <label class="btn btn-default btn-file" for="dataFile">
                <input type="file" id="dataFile" name="upload" style="display:none;" onchange="$('#upload-file-info').html(this.files[0].name)">
                Choose File
            </label>
            <span class="" id="upload-file-info">

            </span>
        </div>

        <div class="form-group">
            <input type="submit" value="Submit Files" class="btn btn-primary" data-toggle="modal" data-target="#myModal" onclick="document.getElementById('redemptionForm').submit()"/>
        </div>


        <div class="modal fade" id="myModal" role="dialog">
            <div class="modal-dialog modal-lg">
                <div class="modal-content">
                    <div class="modal-header">
                        <button type="button" class="close" data-dismiss="modal">&times;</button>
                        <h5 class="modal-title">Preview Upload</h5>
                    </div>

                    <div class="modal-body">
                        @if (Model != null)
                        {
                            <table  class="table table-responsive table-striped table-hover" cellspacing="0" width="100%">
                                <thead>
                                    <tr>
                                        <th>Fund Code</th>
                                        <th>Fund Name</th>
                                        <th>EA Account Number</th>
                                        <th>Registrar Account Number</th>
                                        <th>Investor Name</th>
                                        <th>Redeem Units</th>
                                        <th>Tracker ID</th>
                                    </tr>
                                </thead>
                                <tbody>
                                    @foreach (var data in Model.Item)
                                    {
                                        <tr>
                                            <td>@data.FunCode</td>
                                            <td>@data.FunCode</td>
                                            <td>@data.AccountNumber</td>
                                            <td>@data.RegistrarAccountNo</td>
                                            <td>@data.InvestorName</td>
                                            <td>@data.RedeemUnit</td>
                                            <td>@data.PDFImages</td>
                                        </tr>
                                    }
                                </tbody>
                            </table>
                        }
                        else
                        {
                            <center>
                                <i class="fa fa-circle-o-notch fa-spin fa-3x fa-fw"></i>
                                <span class="sr-only">Loading...</span>
                            </center>
                        }
                    </div>

                    <div class="modal-footer">
                        <button type="button" class="btn btn-primary savechanges">Save changes</button>
                        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
                    </div>
                </div>
            </div>
        </div>

        if (Model != null)
        {
            <div class="alert alert-dismissible alert-success">
                <button type="button" class="close" data-dismiss="alert">&times;</button>
                <strong>@ViewBag.result</strong>
            </div>

            <div class="well">
                <table id="example" class="table table-responsive table-striped table-hover" cellspacing="0" width="100%" style="display:none;">
                    <thead>
                        <tr>
                            <th>Fund Code</th>
                            <th>Fund Name</th>
                            <th>EA Account Number</th>
                            <th>Registrar Account Number</th>
                            <th>Investor Name</th>
                            <th>Redeem Units</th>
                            <th>Tracker ID</th>
                        </tr>
                    </thead>
                    <tbody>
                        @foreach (var data in Model.Item)
                        {
                            <tr>
                                <td>@data.FunCode</td>
                                <td>@data.FunName</td>
                                <td>@data.AccountNumber</td>
                                <td>@data.RegistrarAccountNo</td>
                                <td>@data.InvestorName</td>
                                <td>@data.RedeemUnit</td>
                                <td>@data.PDFImages</td>
                            </tr>
                        }
                    </tbody>
                </table>
            </div>
        }
    }
</div>

<script src="~/Scripts/jquery-1.10.2.min.js"></script>
<script src="~/Scripts/jquery.validate.min.js"></script>
@*<script src="~/Scripts/jquery.validate.unobtrusive.min.js"></script>
<script src="~/Scripts/jquery.unobtrusive-ajax.js"></script>*@

<script src="https://cdnjs.cloudflare.com/ajax/libs/jszip/3.1.3/jszip.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.32/pdfmake.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.32/vfs_fonts.js"></script>

<script src="~/Scripts/DataTables/jquery.dataTables.min.js"></script>
<script src="~/Scripts/DataTables/dataTables.bootstrap.min.js"></script>
<script src="~/Scripts/DataTables/dataTables.buttons.min.js"></script>
<script src="~/Scripts/DataTables/buttons.flash.min.js"></script>
<script src="~/Scripts/DataTables/buttons.html5.min.js"></script>
<script src="~/Scripts/DataTables/buttons.print.min.js"></script>


<script>
        $(document).ready(function () {
            $('#example').DataTable({
                dom: 'Bfrtip',
                buttons: [
                    'copy', 'csv', 'excel', 'pdf', 'print'
                ],
                "paging": true,
                "searching": true,
                "ordering": true,
                "language":
                {
                    "processing": "<div class='overlay custom-loader-background'><i class='fa fa-cog fa-spin custom-loader-color'></i></div>"
                },
                "processing": true
            });

            $('.savechanges').click(function () {
                $('#example').show();
            });
        });
</script>