Observe_field в Rails 3 - PullRequest
       1

Observe_field в Rails 3

0 голосов
/ 12 ноября 2010

Я пытаюсь заполнить поле наблюдения_ в рельсах 3.

В рельсах 2.3.5 у меня есть: -

 <%= observe_field 'query',  :frequency => 2,
                            :update => "search_results",                                
                            :url => {:controller => params[:area], :action => "search",:area =>  params[:area]},
                            :method=>:get,
                            :with => "query" %>

Что отлично работает, проверяя мой текстовый запрос text_field_tag ​​и обновляеммои "search_results" каждые две секунды.Это то, что я пытаюсь смоделировать с помощью прототипа.

На данный момент я имею в базовом приложении в Rails 3: -

<script>
document.observe("dom:loaded", function() { 
$('search').observe('change', 
respondToChange());
});
</script>

или

<script>
document.observe("dom:loaded", function() {
new Form.Element.Observer(
'search',
1, 
respondToChange()
) });
</script>

И то, и другое запускает функцию responseToChange, когда страница загружается, несмотря на «dom: загружен», а затем больше не наблюдает.

Кто-нибудь имеет представление о том, как я могу получить повторные проверки наблюдателя на моем "поиск "text_field_tag.

Ответы [ 3 ]

0 голосов
/ 14 ноября 2010

Вот мой полный код, если кому-то интересно. Этот код наблюдает «поиск» text_field_tag ​​каждые 2 секунды, и если происходит изменение значения, он запускает поиск автоматически. Думаю, теперь с кнопкой «Отправить» можно покончить. Я мог бы добавить :autocomplete => "off", :onKeyPress=>"return disableEnterKey(event)") %> к text_field_tag, чтобы отключить ключ возврата, не уверен.

В моем index.html.erb у меня есть:

<h1>Listing homepages</h1>
<div id = "testsearch">
   <%=render :partial => 'homepage'%>     
</div>
<%= form_tag homepages_path, :method => 'get', :remote => true do %>
<%= label_tag(:search, "Search for:") %> 
<%= text_field_tag :search, params[:search]%>
<%= submit_tag "search", :name => nil %>
<%end%>

<%= set_focus_to_id 'search' %>               // I have a helper "set_focus_to_id"

<script>
document.observe("dom:loaded", function() {   // ensures the page is loaded first
new Form.Element.Observer(                    // Observes the text_field_tag every 2 seconds
  'search',
  2, 
  respondToChange                         //refrences the function in the Layout <head> 
)                                         // on a change in search calls respondToChange
});
</script>
<br />
<%= link_to 'New Homepage', new_homepage_path %>

В моем приложении Layout head у меня есть:

<script>
function respondToChange() {
$('search').up('form').submit()            // The ".up finds the form in the DOM"
};
</script

В моем контроллере # index у меня есть:

 def index
  @homepages = Homepage.search(params[:search]) //".search method is in the Model"
  respond_to do |format|
   format.html # index.html.erb
   format.xml  { render :xml => @homepages }
   format.js
 end
end

В моей модели: 1013 *

def self.search(search_item)
   if search_item
    self.where('section LIKE ?', "%#{search_item}%")    //Handles the ajax call.
   else
    self.all                                            //Handles the html call on startup.
   end
end

В помощнике у меня есть:

def set_focus_to_id(id)
  javascript_tag("$('#{id}').focus()");
end

В части "_homepage" у меня есть:

<table>
  <tr>
    <th>Id</th>
    <th>Section</th>
    <th>Link</th>
    <th>Description</th>
    <th></th>
    <th></th>
    <th></th>
 </tr>

<% for homepage in @homepages %>

  <tr>
    <td><%= homepage.id %></td>
    <td><%= homepage.section %></td>
    <td><%= homepage.link %></td>
    <td><%= homepage.description %></td>
    <td><%= link_to 'Show', homepage %></td>
    <td><%= link_to 'Edit', edit_homepage_path(homepage) %></td>
    <td><%= link_to 'Destroy', homepage, :confirm => 'Are you sure?', :method => :delete %></td>
  </tr>
<%end%>

</table>

А в index.js.erb у меня есть:

$('testsearch').update("<%= escape_javascript(render :partial => 'homepage') %>");

Если у кого-то есть какие-либо комментарии о том, как я могу улучшить это, пожалуйста, свяжитесь со мной или скажите.

0 голосов
/ 17 ноября 2010

Я думаю, что теперь я решил проблему выполнения вызова ajax с помощью программирования.Мне придется проверить это во всех типах браузеров, но на данный момент он работает в Firefox и Safari.Теперь я также переместил javascript "document.observe (" dom :loaded "и функцию, которую он вызывает" responseToChange () ", в заголовок приложения с помощью content_for. Все остальные файлы остались прежними.

В моем индексе.html.erb У меня теперь есть: -

<h1>Listing homepages</h1>
<div id = "testsearch">
     <%=render :partial => 'homepage'%>     
</div>
<%= form_tag homepages_path, :method => 'get', :remote => true do %>
    <%= label_tag(:search, "Search for:") %> 
<%= text_field_tag :search, params[:search]%>
 <%= submit_tag "search", :name => nil %>
<%end%>

<%= set_focus_to_id 'search' %>               

<% content_for :search_javascript do %>

function respondToChange() {

    var pars = 'search=' + $('search').getValue()

        new Ajax.Request("<%= homepages_path %>" ,{
        method: 'get',
        parameters: pars
    }); 
};

document.observe("dom:loaded", function() {   
    new Form.Element.Observer(                
      'search',
      2, 
      respondToChange

    )                                         
});

<% end %>

<br />
<%= link_to 'New Homepage', new_homepage_path %>

В моем файле макета приложения у меня теперь есть: - GardenR3 <% = stylesheet_link_tag: все%> <% = javascript_include_tag: значения по умолчанию%> <% = csrf_meta_tag%>

<script>
 <%= yield :search_javascript %>
</script>

</head>
<body>

<%= yield %>

</body>
</html>
0 голосов
/ 13 ноября 2010

Благодаря "themiddleman" и "agnaki" где-то там в эфире я решил проблему:

Используйте respondToChange, а не respondToChange()

Поскольку скобки () выполняют функцию, тогда как без () она ссылается на нее.

$('search').observe('change', respondToChange);
 // only triggers when the focus is moved away from the text_field.

new Form.Element.Observer(
  'search',
  1,
respondToChange
) }); 

//................................repeatedly checks the text_field,every 1 second, and call the function if there is a any change.
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...