Hi..I would be happy to get some support.
What I want is:
1. a query field #type in some letters looking for a name
2. a dynamic updated list according to the typed-in letters
What I have:
#view
<%= text_field_tag :query%>
<ul id=''results''>
<%@clients.each do |client|%>
<li><%= client.name%></li>
<%end%>
</ul>
#controller
def search
@clients = Client.where("name like ?", "%#{params[:query]}
%").limit(5)
end
#coffee
jQuery ($) ->
$("#query").change ->
$.get "search", (data) ->
$("#results").html data
What is happing now is that it lists all names..and if I type in some
letters and click return ..the whole page is getting rendered
again..in the list
How code it right?
Thanks
--
You received this message because you are subscribed to the Google Groups
"Ruby on Rails: Talk" group.
To post to this group, send email to
rubyonrails-talk-/JYPxA39Uh5TLH3MbocFF+G/Ez6ZCGd0@public.gmane.org
To unsubscribe from this group, send email to
rubyonrails-talk+unsubscribe-/JYPxA39Uh5TLH3MbocFF+G/Ez6ZCGd0@public.gmane.org
For more options, visit this group at
http://groups.google.com/group/rubyonrails-talk?hl=en.
On May 9, 12:58 pm, Werner <webagentur.la...-gM/Ye1E23mwN+BqQ9rBEUg@public.gmane.org> wrote:> What I have: > > #view > <%= text_field_tag :query%> > > <ul id=''results''> > <%...@clients.each do |client|%> > <li><%= client.name%></li> > <%end%> > </ul> > > #controller > def search > @clients = Client.where("name like ?", "%#{params[:query]} > %").limit(5) > end > > #coffee > jQuery ($) -> > $("#query").change -> > $.get "search", (data) -> > $("#results").html data > > What is happing now is that it lists all names..and if I type in some > letters and click return ..the whole page is getting rendered > again..in the listYour javascript is not actually doing anything with the value of the query text field (take a look at the params received by your code). The get method takes as its optional 2nd argument a map or string of data, ie in your case {query: $(this).val()} (since this is in that event handler, ''this'' will be the text field. You also want to ask rails to render without a layout. You can either do this with render :layout => false or you can set the layout at the controller level Fred> > How code it right? > Thanks-- You received this message because you are subscribed to the Google Groups "Ruby on Rails: Talk" group. To post to this group, send email to rubyonrails-talk-/JYPxA39Uh5TLH3MbocFF+G/Ez6ZCGd0@public.gmane.org To unsubscribe from this group, send email to rubyonrails-talk+unsubscribe@googlegroups.com. For more options, visit this group at http://groups.google.com/group/rubyonrails-talk?hl=en.
Am 10.05.2012 um 09:30 schrieb Frederick Cheung: Hi Fred thanks..> > > On May 9, 12:58 pm, Werner <webagentur.la...-gM/Ye1E23mwN+BqQ9rBEUg@public.gmane.org> wrote: > >> What I have: >> >> #view >> <%= text_field_tag :query%> >> >> <ul id=''results''> >> <%...@clients.each do |client|%> >> <li><%= client.name%></li> >> <%end%> >> </ul> >> >> #controller >> def search >> @clients = Client.where("name like ?", "%#{params[:query]} >> %").limit(5) >> end >> >> #coffee >> jQuery ($) -> >> $("#query").change -> >> $.get "search", (data) -> >> $("#results").html data >> > > Your javascript is not actually doing anything with the value of the > query text field (take a look at the params received by your code).SELECT `clients`.* FROM `clients` WHERE (name like ''%%'') => true.. :-( Can you please tell me some more about.. as I am not really familiar with js/coffee>> $.get "search", (data) ->As I understand it in (data) should be the value of :query giving it to the action search @clients = Client.where("name like ?", "%#{params[:query]}%") But this is not happening> The get method takes as its optional 2nd argument a map or string of > data, ie in your case {query: $(this).val()} (since this is in that > event handler, ''this'' will be the text field.This is a little unclear to me.> You also want to ask rails to render without a layout. You can either > do this with render :layout => false or you can set the layout at the > controller level >Thanks for your patience. Werner Laude webagentur.laude-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org -- You received this message because you are subscribed to the Google Groups "Ruby on Rails: Talk" group. To post to this group, send email to rubyonrails-talk-/JYPxA39Uh5TLH3MbocFF+G/Ez6ZCGd0@public.gmane.org To unsubscribe from this group, send email to rubyonrails-talk+unsubscribe-/JYPxA39Uh5TLH3MbocFF+G/Ez6ZCGd0@public.gmane.org For more options, visit this group at http://groups.google.com/group/rubyonrails-talk?hl=en.
Here is what you need to do (there are multiple ways of doing it, I am showing you an easy one, definitely not the best one). You actually have 2 different views, one that renders the search page and another one that renders only the list content, which is invoked through jquery. The behavior you see now is because you use just one view.> #view > <%= text_field_tag :query%> > > <ul id=''results''> > <%...@clients.each do |client|%> > <li><%= client.name%></li> > <%end%> > </ul>needs to become> #view > <%= text_field_tag :query%> > > <ul id=''results''> > </ul>> #view - results > <%...@clients.each do |client|%> > <li><%= client.name%></li> > <%end%>Your controller needs to become controller def search end def results @clients = Client.where("name like ?", "%#{params[:query]} %").limit(5) render :layout => false end and your coffeescript #coffee jQuery ($) -> $("#query").change -> searchText = $("#query").val() # Need to uriEncode searchText here, there should be a good jquery way to do so. $.get "/path to your route/results?query=#{searchText}", (data) -> $("#results").html data Please keep in mind that I haven''t done anything in rails for quite some time, so the above code is not perfect and probably contains bugs. But it should show the general idea. On Thu, May 10, 2012 at 2:06 AM, Werner Laude < webagentur.laude-gM/Ye1E23mwN+BqQ9rBEUg@public.gmane.org> wrote:> > Am 10.05.2012 um 09:30 schrieb Frederick Cheung: > > Hi Fred thanks.. > > > > On May 9, 12:58 pm, Werner <webagentur.la...-gM/Ye1E23mwN+BqQ9rBEUg@public.gmane.org> wrote: > > What I have: > > > #view > > <%= text_field_tag :query%> > > > <ul id=''results''> > > <%...@clients.each do |client|%> > > <li><%= client.name%></li> > > <%end%> > > </ul> > > > #controller > > def search > > @clients = Client.where("name like ?", "%#{params[:query]} > > %").limit(5) > > end > > > #coffee > > jQuery ($) -> > > $("#query").change -> > > $.get "search", (data) -> > > $("#results").html data > > > > Your javascript is not actually doing anything with the value of the > query text field (take a look at the params received by your code). > > > SELECT `clients`.* FROM `clients` WHERE (name like ''%%'') > => true.. :-( > > Can you please tell me some more about.. as I am not really familiar with > js/coffee > > $.get "search", (data) -> > > > As I understand it in (data) should be the value of :query giving it to > the action search > > @clients = Client.where("name like ?", "%#{params[:query]}%") > > But this is not happening > > > The get method takes as its optional 2nd argument a map or string of > data, ie in your case {query: $(this).val()} (since this is in that > event handler, ''this'' will be the text field. > > > This is a little unclear to me. > > You also want to ask rails to render without a layout. You can either > do this with render :layout => false or you can set the layout at the > controller level > > > Thanks for your patience. > > Werner Laude > webagentur.laude-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org > > > > -- > You received this message because you are subscribed to the Google Groups > "Ruby on Rails: Talk" group. > To post to this group, send email to rubyonrails-talk-/JYPxA39Uh5TLH3MbocFF+G/Ez6ZCGd0@public.gmane.org > To unsubscribe from this group, send email to > rubyonrails-talk+unsubscribe-/JYPxA39Uh5TLH3MbocFF+G/Ez6ZCGd0@public.gmane.org > For more options, visit this group at > http://groups.google.com/group/rubyonrails-talk?hl=en. >-- You received this message because you are subscribed to the Google Groups "Ruby on Rails: Talk" group. To post to this group, send email to rubyonrails-talk-/JYPxA39Uh5TLH3MbocFF+G/Ez6ZCGd0@public.gmane.org To unsubscribe from this group, send email to rubyonrails-talk+unsubscribe-/JYPxA39Uh5TLH3MbocFF+G/Ez6ZCGd0@public.gmane.org For more options, visit this group at http://groups.google.com/group/rubyonrails-talk?hl=en.
On May 10, 10:06 am, Werner Laude <webagentur.la...-gM/Ye1E23mwN+BqQ9rBEUg@public.gmane.org> wrote:> Am 10.05.2012 um 09:30 schrieb Frederick Cheung: > > >> #coffee > >> jQuery ($) -> > >> $("#query").change -> > >> $.get "search", (data) -> > >> $("#results").html data > > > Your javascript is not actually doing anything with the value of the > > query text field (take a look at the params received by your code). > > SELECT `clients`.* FROM `clients` WHERE (name like ''%%'') > => true.. :-( > > Can you please tell me some more about.. as I am not really familiar with js/coffee > > >> $.get "search", (data) -> > > As I understand it in (data) should be the value of :query giving it to the action search >actually, no, here data is the parameter that is passed to your ajax callback function (which contains the response from the server).> @clients = Client.where("name like ?", "%#{params[:query]}%") > > But this is not happeningWhen you make an ajax request like that, you need to actually set the parameters that you want to pass. Right now you''re passing no parameters, so params[:query] is nil $.get ''search'', {query: ''foo''}, (data) -> ... would result in params[:query] being foo and $.get ''search'', {query: $(''#query'').val() }, (data) -> ... would pass the value of the field with id query (and since this code is being called from the change event handler attached to the text field, you can shorten that slightly to $(this).val() instead of $ (''#query'').val() Fred> > > The get method takes as its optional 2nd argument a map or string of > > data, ie in your case {query: $(this).val()} (since this is in that > > event handler, ''this'' will be the text field. > > This is a little unclear to me. > > > You also want to ask rails to render without a layout. You can either > > do this with render :layout => false or you can set the layout at the > > controller level > > Thanks for your patience. > > Werner Laude > webagentur.la...-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org-- You received this message because you are subscribed to the Google Groups "Ruby on Rails: Talk" group. To post to this group, send email to rubyonrails-talk-/JYPxA39Uh5TLH3MbocFF+G/Ez6ZCGd0@public.gmane.org To unsubscribe from this group, send email to rubyonrails-talk+unsubscribe@googlegroups.com. For more options, visit this group at http://groups.google.com/group/rubyonrails-talk?hl=en.
Am 10.05.2012 um 14:07 schrieb Frederick Cheung: Thanks Fred.. great..> > > $.get ''search'', {query: $(''#query'').val() }, (data) -> > ... > > would pass the value of the field with id query (and since this code > is being called from the change event handler attached to the text > field, you can shorten that slightly to $(this).val() instead of $ > (''#query'').val() >Werner Laude webagentur.laude-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org -- You received this message because you are subscribed to the Google Groups "Ruby on Rails: Talk" group. To post to this group, send email to rubyonrails-talk-/JYPxA39Uh5TLH3MbocFF+G/Ez6ZCGd0@public.gmane.org To unsubscribe from this group, send email to rubyonrails-talk+unsubscribe-/JYPxA39Uh5TLH3MbocFF+G/Ez6ZCGd0@public.gmane.org For more options, visit this group at http://groups.google.com/group/rubyonrails-talk?hl=en.