Как перебирать объекты в ViewData через JavaScript на странице / представлении?

Question

Во-первых, я довольно новичок в MVC и jQuery. Я прошу прощения, если мой вопрос или терминология неверны.

В настоящее время у меня в приложении MVC есть вид, отображающий список адресов. На этой же странице у меня также есть карта, на которой я хочу отобразить эти местоположения.

Я пытаюсь найти «правильный» способ получения списка объектов адреса в javascript в представлении, чтобы он мог быть перебран и отображен.

Я видел некоторые решения, которые требуют вызова getJSON для контроллера из кода javascript. Я хочу избежать этого решения, так как оно требует еще одной поездки к базе данных и веб-серверу. Вся информация, которая мне нужна для отображения адресов на карте, уже представлена ​​в View через ViewData.

Я также видел решение, в котором javascript мог бы получать доступ к данным, передаваемым в представление через ViewModel.Data, однако этот пример работал с одним объектом, а не со списком.

Буду признателен, если у кого-нибудь будут какие-либо советы или ресурсы.

Спасибо

Answer 1

Просто визуализируйте данные в свой JavaScript. Скажем, у вас есть список объектов адреса, таких как:

public class Address
{
    public string Line1 { get; set; }
    public string City { get; set; }
}

// in your controller code
ViewData["Addresses"] = new List<Address>(new Address[] { new Address() { Line1="bla", City="somewhere"}, new Address() {Line1="foo", City="somewhereelse"}});

Отобразите его в свой JavaScript следующим образом:

<script type="text/javascript">
var addresses = new Array(
<% for (int i = 0; i < ViewData["Addresses"].Count; i++) { %>
<%= i > 0 : "," : "" %>({line1:"<%= addr.Line1 %>", city:"<%= addr.City %>"})
<% } %>);
</script>

Это в основном создает массив в формате JSON с вашими адресными объектами в javascript.

ОБНОВЛЕНИЕ: Если вы хотите сделать это автоматически с использованием кода платформы вместо написания собственного кода для сериализации в JSON, взгляните на JavaScriptSerializer. Вот как это делает великий ScottGu: Совет / хитрость: создание метода расширения ToJSON () с использованием .NET 3.5

Answer 2

Технически ViewData не визуализируется для вывода HTMl, поэтому не будет отправляться в браузер клиента. Единственный способ получить доступ к ViewData - это отобразить его в объекте в виде массива HTML, например:

var cityList = new Array();
function addCity(cityId, cityName) {
    var city = new Object();
    city.CityID = cityId;
    city.CityName = cityName

    cityList .push(city);
}
<% foreach (Something.DB.City item in ViewData["Cities"] as List<City>)
   { %>
   addCity(item.Id, item.Name);
<% } %>  

Я обычно так делаю, когда мне нужно рендерить данные для javascript

Answer 3

Вы можете отформатировать данные в формате JSON на сервере (в виде строки). Назначьте это своим ViewData. Затем в вашем представлении присвойте ViewData переменной javascript.

<script type="text/javascrpt">
   var objList = <%= ViewData["objectListJSON"]; %>;

   for (var obj in objList)
   {
     ...
   }
</script>