如何在这个特定的上下文中调用我的javascript函数

时间:2012-05-10 14:26:40

标签: javascript razor

任何人都可以告诉我如何在以下上下文中调用GetDuration函数:

@{
...
...
<div>  GetDuration(@item.StartDate, @item.EndDate) </div>
...
...
}

函数GetDuration()在我的上下文中提到的父DIV中动态创建另一个DIV。

我有两个问题:

  • 我不知道如何从代码
  • 中显示的位置调用我的函数GetDuration()
  • startdatum.Month.ToString("MMMM");返回"MMMM"而不是月份名称

提前致谢!

这是我的代码:

<script type="text/javascript">

function GetDuration(startdatum, einddatum) {
    var maand1 = startdatum.Month.ToString("MMMM");
    var maand2 = einddatum.Month.ToString("MMMM");
    var duration = "Date: ";
    if (maand1 == maand2) {
        duration += item.Startdate.Day.ToString()
            + " - " + item.Enddate.Day.ToString()
            + " " + maand1
            + " " + item.Startdate.Year.ToString();
    }
    else {
        duration += item.Startdate.Day.ToString()
            + item.Startdate.Month.ToString("MMMM")
            + " - " + item.Enddate.Day.ToString()
            + " " + item.Enddate.Month.ToString("MMMM")
            + " " + item.Startdate.Year.ToString();
    }
    var dynDiv = document.createElement("div");
    dynDiv.class = "HP_DateDiv";
    dynDiv.innerHTML = duration;
    document.body.appendChild(dynDiv);
}

</script>


    @{  string prevYear = "";

    foreach (var item in ViewData.Model) {

        string year = item.StartDate.Year.ToString();
        if (year != prevYear)
        {
            <div class="contentheader"> 
                @year Formula 1 Tickets
            </div>

            prevYear = year;  
        }
        <div class="HP_eventBodyDiv">
            <div class="HP_picDiv" style = "width:100px; height:100px;">
                <a href="http://www.cssdrive.com/" class="highlightit"><img  src="../../Content/Pics/auto.jpg" alt="oto" height="50" width="50"/></a>
            </div>
            <div class="HP_eventDiv">
                <div class="HP_eventNameDiv">@item.Name
            </div>
<!--This is the spot to call my function with something like "GetDuration(@item.StartDate, @item.EndDate)"-->
                <div class="HP_viewBuyBtnsDiv">
                    <input id="btn_View" type="button" value="View Event" class="contentbtn"/>
                    <input id="btn_Buy" type="button" value="Buy Tickets" class="contentbtn"/>
                </div>
            </div>
        </div>            

        };
     }

1 个答案:

答案 0 :(得分:0)

我要看看能否为你解释一下这个问题。 Razor Syntax允许我们做一些很棒的事情,比如你的观点。能够在视图上迭代集合非常棒,并且可以为创建动态页面提供一些很好的灵活性。 他们的服务器实际上是使用您提供的语法创建Razor视图,然后将构建HTML页面发送到客户端。这包括脚本标签。所以你想要做的事情不是现实的工作。您无法在@foreach中迭代地调用JavaScript函数,因为该页面尚未呈现。 一旦Razor View完全形成,你应该只考虑使用Javascript。然后,您可以使用JavaScript编辑DOM。

所以我的建议是EDIT所说的。让服务器计算该属性并将其与模型一起发送。

编辑:

等待查看更新后的代码后,我认为你的方法是错误的。我不明白为什么你用javascript来计算你的持续时间。您应该编辑要传递的模型以包含持续时间,特别是如果它是一个计算字段。然后你可以像任何其他财产一样显示持续时间。

编辑2:

public class MyNewClass
{
public DateTime StartDate {get;set;}
public DateTime EndDate {get;set;}
public int Duration
{
get{
//Do your Logic Here with startdate and enddate
}
set;
}
}