Ruby on Rails визуальный эффект jQuery - PullRequest
0 голосов
/ 28 июля 2010

Я работаю над функцией поиска в RoR, которая в основном просто имеет крутой визуальный эффект, когда пользователь нажимает кнопку поиска.

Вот мой код для search.rhtml

  <html>
  <head>
    <title>Tutor</title>
    <%= javascript_include_tag :defaults %>
  </head>
  <body>
    <h1></h1>
        <%= form_remote_tag :url =>{ :action => :search_results }, :update => "results"  %>


                    <fieldset>
                        <legend>Tutor Search.</legend>
                        <label for="searchItField">Keyword Search.</label>

                        <input class="tfield" type="text" value="FIND YOUR TUTOR HERE" name="searchItField" id="searchItField" />
                        <span id="Submit_search">

                            <span id="Submit_search_hover"><input type="submit" id="Submit" value="Search" /></span>

                        </span>
                    </fieldset>
                </form>

    <div id="results">

    </div>
  </body>
</html>

Вот search_results.rhtml, который отображается в div результатов в search.rhtml

<% for tutors in @tutors %>
        <%= tutors.first_name %> <br/>
    <% end %>

И, наконец, вот мой контроллер и действия.

class TutorsController < ApplicationController

  def search
  end

  def search_results
     @tutors = Tutors.find_by_sql('SELECT * FROM tutors')
  end

end

Что я хочу сделать, так это создать эффект, который при загрузке результатов поиска из-за вызова ajax будет скользить вверх. Я использую jrails. Как именно этот сайт делает это. http://keyonary.com/#/paste

1 Ответ

0 голосов
/ 28 июля 2010

Короче говоря, для начала вам нужно будет сделать следующее:

  • используйте observe_field в поле ввода, которое извлекает данные из метода контроллера и обновляет определенный div с результатами
  • создайте соответствующий метод контроллера, который будет извлекать элементы (используйте ваш search_results)
  • создать представление для этого метода-контроллера, в котором будут показаны данные с необходимыми эффектами и анимацией.
...