ASP.NET MVC 2 и динамический JavaScript - PullRequest
1 голос
/ 17 августа 2010

У меня есть неупорядоченный список, который при нажатии на элемент отображает несколько изображений с помощью плагина Fancybox JavaScript.

Я пытаюсь преобразовать это в ASP.NET MVC 2 и хочу динамически передать изображениеПути и заголовки и т. Д. Для JavaScript, чтобы они не были жестко закодированы.

HTML

  <ul>
    <li><a href="DisplayImages();" title="Images"> Show Images</a></li>
    </ul>

Javascript

function DisplayImages() {

    $.fancybox([
{ 'href': 'Image Path goes here', 'title': 'Image Title goes here' },
{ 'href': 'Another Image path goes here', 'title': 'Another image title' }
], {
    'padding': 0,
    'transitionIn': 'none',
    'transitionOut': 'none',
    'type': 'image',
    'changeFade': 0

})
};

Возможно ли это сделать?Любая помощь очень ценится

Спасибо

1 Ответ

0 голосов
/ 17 августа 2010

Если я правильно вас понял, вы, возможно, ищете это:

function DisplayImages() {
  $.fancybox([
    { 'href': '<%= Model.ImagePath %>', 
      'title': '<%= Model.ImageTitle %>' },
    { 'href': '<%= Model.AnotherImagePath %>', 
      'title': '<%= Model.AnotherImageTitle %>' }], 
    {'padding': 0 //yada yada}    
   })
};

Предполагая, что вы пишете этот код в виде aspx / ascx, он будет вставлять данные со стороны сервера непосредственно в визуализированный html аналогично' echo ' делает в PHP.

Модель - это объект, который вы передадите для просмотра с контроллера.

Вот инструкции от СтивенаВальтер.


Если ваша проблема на самом деле не столько в встраивании данных со стороны сервера, сколько в передаче в качестве аргумента нескольких путей к изображениям и заголовков для плагина, вы можете проверить, как JSONСериализация (<- это только один способ сделать это) работает.Скорее всего, я бы создал <a href="http://www.asp.net/mvc/tutorials/creating-custom-html-helpers-cs" rel="nofollow noreferrer"> htmlHelper , который сериализует передаваемый объект и использовал бы его так:

$.fancybox([<%= Html.ToJSON(Model.Images)%>], 
  {'padding': 0 //yada yada}    
})
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...