有Javascript的问题,以正确显示我的列表

时间:2015-07-09 07:45:31

标签: javascript asp.net-mvc razor

我正在研究时间报告系统,只是为了更熟悉asp.net mvc5。 但是现在我的javascript遇到了问题,我无法正确显示我的列表。

这是我的观点:

@model TimeReportV2.Models.NewTimeReportModel

@{
    ViewBag.Title = "Ny tidrapport";
}
<script type="text/javascript" language="javascript">
    $(function () {
        $(function () {
            $('#date').datepicker({
                showButtonPanel: true,
                changeMonth: true,
                changeYear: true,
                dateFormat: "yy-mm-dd",
                firstDay: 1,
                onSelect: function (dateText) {
                    $('#EndDate').datepicker('option', 'minDate', new Date(dateText));
                }
            });
        });
    });

    $(function () {
        $('#startTime').change(function() { CalculateTime(); });
        $('#endTime').change(function() { CalculateTime(); });
        $('#breakTime').change(function() { CalculateTime(); });
        CalculateTime();
    });


    function CalculateTime(){
        try{
            var startTime = $('#startTime').val();
            var endTime = $('#endTime').val();
            var breakTime = $('#breakTime').val();

            var startDate = new Date(2000,1,1,startTime.substring(0,2),startTime.substring(3,5),0,0);
            var endDate = new Date(2000,1,1,endTime.substring(0,2),endTime.substring(3,5),0,0);

            var time = endDate - startDate;

            time = time / 1000 / 60 / 60
            time = time - breakTime.substring(0,2);
            time = time - (breakTime.substring(3,5) / 60 );
            $('#workedHours').html(time + " timmar");
        }
        catch(err){
            $('#workedHours').html("---");
        }
    }

</script>
<h2>Ny tidrapport</h2>

@if (ViewData["posted"] != null)
{
    <h2 style="color:Green">Tidsrapporten tillagd.</h2>
}

<div>
    @(ViewData["missingDays"])
    @(Html.ValidationSummary())
</div>

@using (Html.BeginForm("TimeReport", "Reports", FormMethod.Post, new { enctype = "multipart/form-data" }))
{
    @(Html.Hidden("ReportId", Model.ReportId))
    <table>
        <tr>
            <td class="label">Datum</td>
            <td>
                @(Html.TextBox("date", Model.Date.ToShortDateString()))
            </td>
        </tr>
        <tr><td><br /></td></tr>

        <tr>
            <td class="label">Arbetad tid</td>
            <td>
                <table>
                    <tr>
                        <td style="width: 100px;">Starttid:</td>
                        <td>@(Html.TextBox("startTime", Model.Times.StartTime))</td>
                    </tr>
                    <tr>
                        <td>Sluttid:</td>
                        <td>@(Html.TextBox("endTime", Model.Times.EndTime))</td>
                    </tr>
                    <tr>
                        <td>Rastlängd:</td>
                        <td>@(Html.TextBox("breakTime", Model.Times.BreakTime))</td>
                    </tr>
                    <tr>
                        <td>Jobbad tid:</td>
                        <td><div id="workedHours"></div></td>
                    </tr>
                </table>
            </td>
        </tr>

    </table>

    <div id="projects">
        @foreach (var data in Model.Projects)
        {
            Html.RenderPartial("Project", data, ViewData["vd"] as ViewDataDictionary);
            (ViewData["vd"] as ViewDataDictionary)["id"] = (int)(ViewData["vd"] as ViewDataDictionary)["id"] + 1;
        }
    </div>
    <br />
    <a href="javascript:AddProject()">Lägg till projekt</a>

    <input type="submit" value="@(Model.ReportId.HasValue ? "Uppdatera" : "Spara")" />
    if (Model.ReportId.HasValue)
    {
        <input type="submit" value="Ta bort" name="delete" />
    }
}

现在它将显示如下:

<br /><a href="javascript:SetDate('2015-04-01');">2015-04-01</a><br /><a href="javascript:SetDate('2015-04-02');">2015-04-02</a><br /><a href="javascript:SetDate('2015-04-07');">2015-04-07</a><br /><a href="javascript:SetDate('2015-04-08');">2015-04-08</a><br /><a href="javascript:SetDate('2015-04-09');">2015-04-09</a><br /><a href="javascript:SetDate('2015-04-10');">2015-04-10</a><br /><a href="javascript:SetDate('2015-04-13');">2015-04-13</a><br /><a href="javascript:SetDate('2015-04-14');">2015-04-14</a><br /><a href="javascript:SetDate('2015-04-15');">2015-04-15</a><br /><a href="javascript:SetDate('2015-04-16');">2015-04-16</a><br /><a href="javascript:SetDate('2015-04-17');

但我希望它看起来像这样:

2015-04-01

2015年4月2日

2015年4月7日

2015-04-09

2015-04-09

2015年4月10日

0 个答案:

没有答案