ASP.NET MVC 3 Razor: инициализировать массив JavaScript

Каким будет предпочтительный способ инициализации массива JS в ASP.NET MVC 3 с помощью Razor со значением, которое у меня есть в модели модели/представления?

Например, для инициализации массива строк, представляющих даты:

<script type="text/javascript">
    var activeDates = ["7-21-2011", "7-22-2011"];
</script>

с

public class MyViewModel
{    
  public DateTime[] ActiveDates { get; set; }
}

Ответы

Ответ 1

Я не совсем понимаю связь между JS и ASP.NET MVC 3 Razor. Javascript работает на стороне клиента независимо от того, какая технология была использована на сервере для создания страницы. Таким образом, на javascript массив представляет собой массив.

Существует несколько возможностей для определения массивов объектов в javascript

var activeDates = [ '7-21-2011', '7-22-2011' ];

или

var activeDates = new Array();
activeArrays.push('7-21-2011');
activeArrays.push('7-22-2011');

или еще:

var activeDates = new Array();
activeArrays[0] = '7-21-2011';
activeArrays[1] = '7-22-2011';

В конце концов все они представляют один и тот же массив. Но это массив строк, а не дат.

Если вы хотите иметь массив дат, вот что вы могли бы сделать:

var activeDates = [ 
    new Date(2011, 6, 21, 0, 0, 0, 0), 
    new Date(2011, 6, 22, 0, 0, 0, 0) 
];

Теперь единственное отношение, которое я вижу с вашим вопросом к ASP.NET MVC, состоит в том, что у вас, вероятно, есть некоторый массив в вашей модели представления:

public class MyViewModel
{
    public DateTime[] ActiveDates { get; set; }
}

который вы хотели бы сериализовать и манипулировать в массиве javascript. В этом случае синтаксис:

@model MyViewModel
<script type="text/javascript">
    var activeDates = @Html.Raw(Json.Encode(Model.ActiveDates));
</script>

Теперь из-за того, что поля DateTime являются JSON-сериализованными в .NET, вы получите следующее в сгенерированном HTML:

var activeDates = ["\/Date(1309471200000)\/","\/Date(1311199200000)\/"];

и если вы хотите преобразовать этот массив строк в массив фактических дат javascript:

var dates = $.map(activeDates, function(date, index) {
    date = date.replace('/Date(', '').replace(')/', '');  
    return new Date(parseInt(date));
});

Ответ 2

Я только что сделал это вчера и придумал это решение (если вы хотите, чтобы он выглядел как результат, который у вас есть в вашем вопросе, я использовал это с jqplot):

<script type="text/javascript">
    var activeDates = ['@Html.Raw(string.Join("', '", @ActiveDates.Select(f => string.Format("{0:MM-dd-yyyy}", f)).ToArray()))']
</script>