在asp.net mvc应用程序中从Javascript访问C#变量

本文关键字:Javascript 访问 变量 asp net mvc 应用程序 | 更新日期: 2023-09-27 18:22:36

我在How to use javascript variables in C# and vise versa中遇到问题:我将此Model传递到视图:

public List<Tache> Get_List_Tache()
{
    Equipe _equipe = new Equipe();
    List<Tache> liste_initiale = _equipe.Get_List_tache();
    return liste_initiale;
}

这是一个对象Tache的列表,我想在其中使用它的三个字段Tache_descriptionBegin_dateEnd_date

在我的JavaScript代码中,我有这个函数,它运行良好:

       <script>
        $(document).ready(function () {
            var date = new Date();
            var d = date.getDate();
            var m = date.getMonth();
            var y = date.getFullYear();
            $('#calendar').fullCalendar({
                theme: true,
                header: {left: 'prev,next today',center: 'title',right: 'month,agendaWeek,agendaDay'},
                editable: true,
                events: [
                         @foreach (var m in Model.Get_List_Tache())
                          {
                        @:{title : @m.Tache_description , start: @m.Begin_date , end :  @m.Begin_date }
                          }
                        ]
                });
                                        });
</script>

数组events的值只是为了测试,我需要用Model的值填充events。对于这样的每个元素:title = Tache_descriptionstart = Begin_dateend = End_date

那么我该如何完成这项任务呢?有什么建议吗?

在asp.net mvc应用程序中从Javascript访问C#变量

试试这个,

foreach (var item in YourList)
{
    events: [{ title: '@item.title', start: '@item.start', end: '@item.end'}]
}

所以,在这段代码中,只需替换模型实体的名称。

在javascript:中创建foreach剃刀循环

var date = new Date();
var d = date.getDate();
var m = date.getMonth();
var y = date.getFullYear();
$('#calendar').fullCalendar({
    theme: true,
    header: {left: 'prev,next today',center: 'title',right: 'month,agendaWeek,agendaDay'},
    editable: true,
    events: [
    @
    {
      bool isFirst = true;
    }
    @foreach(var m in Model)
    {
        if(!isFirst)
        {
          @:,
        }
        @:{title: @m.Tache_description, ...<other properties here>}
        isFirst = false;
    }
    ]
});

对于title,您可以执行title="@Tache_description"

不确定Begin_date和End_date的格式/类型,您可能需要一些函数将日期读取为javascript格式。不应该那么难。

循环遍历每个元素,并将这些元素添加到事件数组中。它有点像。。。

events = new Array()
@foreach(tache in list){
    item = { blah : blah, blah : blah };
    events.push(item);
}

对于这个c#列表中的每个c#项,编写以下几行javascript。您最终可能会得到一个非常长的javascript代码块,但它应该可以做到这一点。上面是伪代码。

要补充Darin的答案:如果您需要外部JavaScript文件中的服务器端变量,请查看以下博客文章:使用部分Razor视图生成外部JavaScript文件

1:如果您的模型期望Tache的列表,那么您就拥有了可以操作的整个列表。

2:您可以通过调用您的操作Get_List_Tache(),使用jquery ajax将数据作为json数据获取。

假设这个javascript在您的页面中是内联的,您可以执行以下操作:

@model IList<Tache>
<script type="text/javascript">
    var events = @Html.Raw(Json.Encode(Model.Select(x => new { title = x.Description, start = x.Begin.ToString("o"), end = x.End.ToString("o") })));
    $('#calendar').fullCalendar({
        theme: true,
        header: { 
            left: 'prev,next today',
            center: 'title',
            right: 'month,agendaWeek,agendaDay'
        },
        editable: true,
        events: events
    });
</script>

本例假设Tache模型具有属性DescriptionBeginEnd:

public class Tache
{
    public string Description { get; set; }
    public DateTime Begin { get; set; }
    public DateTime End { get; set; }
}

如果这个脚本在一个单独的javascript文件中,您仍然可以在视图中设置一个全局events变量,该变量稍后将被脚本使用。或者,您可以使用AJAX调用来获取这个模型。