2012-02-18 1 views
0

Я нашел эту замечательную подсказку под названием qTip2. Любить его до сих пор, но он попал в проблему, используя его.Использование qTip2 с Ruby on Rails

Я смог установить и запустить qTip2 с настройкой Rails 3.1. Однако я столкнулся с проблемой, когда я использую функции ajax qTip2.

Для запроса qTip2 ajax требуется ссылка на скрипт, который должен быть выполнен перед отображением его в содержимом div всплывающей подсказки (который автоматически генерируется qTip2). Вы можете посмотреть на код, который я имею в виду здесь.

http://www.craigsworks.com/projects/qtip2/demos/#ajax

Проблема с ним в том, что он на самом деле не идут хорошо с RoR. Запрос ajax, объявленный с использованием RoR, более явный, где я могу явно указать рельсы, которые div id я хотел бы обновить.

Учитывая следующие обстоятельства, которые я должен сделать следующие вещи:

  1. содержание подсказкя должно быть динамичным
  2. мне нужно использовать функциональные возможности qTip2 AJAX, так что я мог бы создать собственный макет для подсказки содержание.

я сделал попробовать следующее, хотя:

  1. Поместите фрагмент кода HTML, который будет загружен в DIV контента в общей папке. Содержимое, загруженное с правильным форматом, но я не могу иметь динамический контент. Файлы html.erb, похоже, не работают в этой папке. Есть ли альтернатива этой папке, которая будет работать, но с динамическим контентом?

  2. Пробовал использовать qTip2 запрос ajax с RoR, но не был успешным. Что я сделал, я попытался явно определить идентификатор обновления ajax в файле ответов .js (через контроллер и представления и т. Д.). Но выяснение точного идентификатора, созданного плагином qTip2, для меня было слишком ошеломляющим.

вот что у меня есть

HTML

<a id="editor1" href="/deals_details.html.erb"> 

Javascript

$(document).ready(function() 
{ 

    $('#editor1').each(function() 
    { 
     $(this).qtip(
     { 
     content: { 
      text: '<img class="throbber" src="/assets/throbber.gif" alt="Loading..." />', 
      ajax: { 
       /*once: false*/ 
       url: $(this).attr('href') 

      }, 
      title: { 
       text: 'qTip2 Test', 
       button: true 
      } 
     }, 
     position: { 
      at: 'center', 
      my: 'center', 
      viewport: $(window), 
     }, 
     show: { 
      event: 'click', 
      solo: true 
     }, 
     hide: 'unfocus', 
     style: { 
      classes: 'ui-tooltip-wiki ui-tooltip-light ui-tooltip-shadow' 
     } 
     }) 
    }) 

    // Make sure it doesn't follow the link when we click it 
    .click(function(event) { event.preventDefault(); }); 
}); 

CSS

.ui-tooltip-wiki{ 
    max-width: 440px; 
} 

    .ui-tooltip-wiki .ui-tooltip-content{ 
     padding: 10px; 

     line-height: 12.5px; 
    } 

    .ui-tooltip-wiki h1{ 
     margin: 0 0 7px; 

     font-size: 1.5em; 
     line-height: 1em; 
    } 

    .ui-tooltip-wiki img{ padding: 0 10px 0 0; } 

    .ui-tooltip-wiki p{ margin-bottom: 9px; } 
    .ui-tooltip-wiki .note{ margin-bottom: 0; font-style: italic; color: #888; } 

Пожалуйста, помогите мне! :) Апология, если это сообщение выглядит глупо, это мой первый вопрос о stackoverflow.

ответ

0

Я думаю, что вы делаете это слишком сложно. Функция qTip ajax просто запрашивает URL-адрес, а возвращаемое значение - HTML-содержимое в теге div. Если вы посмотрите на источник демо, о котором вы упомянули, вы увидите запрос на http://www.craigsworks.com/projects/qtip2/data/burrowingowl.php. Если вы посмотрите на то, что это производит, это просто тег div с некоторым контентом (стиль выглядит иначе, потому что он далее преобразуется CSS-страницей).

Итак, возникает вопрос: можете ли вы предоставить свой динамический контент в div в ответ на URL-адрес в Rails? Конечно! Возможно, вы хотите настроить SnippetController с действием show, а затем используя довольно стандартные соглашения/маршруты Rails, ваш URL может быть /snippet/show/[ID], и у вас просто есть представление, создающее требуемый контент div.

+0

Спасибо, сэр за ваш ответ. Я сделал что-то в соответствии с предложенными вами строками (занял некоторое время для меня новичок). Я установил контроллер и посмотрел специально для фрагмента, который я хотел показать в подсказке. Однако всплывающая подсказка закончила загрузку всей веб-страницы в всплывающей подсказке. Может быть, я что-то сделал не так. btw еще раз спасибо. –

+0

Возможно, вы хотите убедиться, что макет не отображается, например, с помощью «render ...: layout => false». Дополнительную информацию см. В [руководстве по направляющим по макетам] (http://guides.rubyonrails.org/layouts_and_rendering.html). –

+0

Еще раз спасибо. Ты спасатель жизни. Я, наконец, получил работу так, как мне было нужно. Tq tq tq tq tq. Хотелось бы, чтобы у меня был наставник, чтобы я мог быстрее учиться. Еще раз спасибо. –