2
저는 여전히 Rails-Learner이고 Ajax 라이브 검색 구현에 절실합니다. 검색은 제출시 작동하지만 키 업에는 작동하지 않는 것 같습니다.rails 3.2 ajax 라이브 검색
index.html.erb
<%= form_tag contacts_path, :method => 'get', :id => "contacts_search" do %>
<p>
<%= text_field_tag :search, params[:search] %>
<%= submit_tag "Search", :name => nil %>
</p>
<div id="cresults_div"><%= render 'cresults' %></div>
<% end %>
<%= link_to 'New Contact', new_contact_path %>
contacts_controller.rb가
def index
@contacts = Contact.search(params[:search])
respond_to do |format|
format.html # index.html.erb
format.json { render json: @contacts }
end
end
index.js.erb
$("#cresults_div").html("<%= escape_javascript(render("cresults")) %>");
contact.rb을 ... 이유를 알아낼 수 없습니다
def self.search(search)
if search
where('last_name LIKE ?', "%#{search}%")
else
scoped
end
end
contacts.js.coffee
jQuery ->
# Ajax search on submit
$('#contacts_search').submit(->
$.get(this.action, $(this).serialize(), null, 'script')
false
)
# Ajax search on keyup
$('#contacts_search input').keyup(->
$.get($("#contacts_search").attr("action"), $("#contacts_search").serialize(), null, 'script')
false
)
_cresults.html.erb
<%= hidden_field_tag :direction, params[:direction] %>
<%= hidden_field_tag :sort, params[:sort] %>
<h1>Listing contacts</h1>
<table>
<tr>
<th>Salutation</th>
<th>First name</th>
<th>Last name</th>
<th>Stree</th>
<th>Street no</th>
<th>Zip</th>
<th>City</th>
<th>State</th>
<th>Country</th>
<th>Phone</th>
<th>Email</th>
<th></th>
<th></th>
<th></th>
</tr>
<% @contacts.each do |contact| %>
<tr>
<td><%= contact.salutation %></td>
<td><%= contact.first_name %></td>
<td><%= contact.last_name %></td>
<td><%= contact.stree %></td>
<td><%= contact.street_no %></td>
<td><%= contact.zip %></td>
<td><%= contact.city %></td>
<td><%= contact.state %></td>
<td><%= contact.country %></td>
<td><%= contact.phone %></td>
<td><%= contact.email %></td>
<td><%= link_to 'Show', contact %></td>
<td><%= link_to 'Edit', edit_contact_path(contact) %></td>
<td><%= link_to 'Destroy', contact, confirm: 'Are you sure?', method: :delete %></td>
</tr>
<% end %>
</table>
도 이
$(function() {
$("#contacts_search input").keyup(function() {
$.get($("#contacts_search").attr("action"), $("#contacts_search").serialize(), null, "script");
return false;
});
});
를 application.js 그러나 추가 추가로 시도 라이브 검색은하지 않습니다 타이핑 시작 ... 왜? I는 연락처 제어기 JS 콘솔
아무것도 인덱스 메소드에서
블록을 제거했다 특히이 경우 –
$ ('# contacts_search input'). keyup'의 내용을'$ ('contacts_search'). submit()'로 바꾸어보세요. –
@DaveNewton : 좋은 지적, 고마워요. 'Uncaught SyntaxError : jquery.min.js의 예기치 않은 토큰 <': 13 - 조사하려고합니다. – BeeVee