add item with ajax - ruby-on-rails

im trying add item with ajax, all work, except the view doesnt refresh, when i force refresh, new product in the list, here is code http://pastie.org/1533605
what's wrong? im using jquery

okay, i figure it out, some problem with my markup
sry of this stupid question
$('<%= escape_javascript(render(:partial => #product))%>').insertBefore('.height');
that was final solution

Try:
$("#products").html("<%= escape_javascript(render(:partial => "products")) %>");
And I guess you'd better do $("#products").append(...) so that ou keep the former content instead of replacing it.
To conclude, consider keeping this kind of behavior on the client side, look at: http://railscasts.com/episodes/197-nested-model-form-part-2

Related

Ajax loading screen with Prototype and unobtrusive JS

I am looking for a solution of adding a loading screen (or frame) while ajax is loading the data. All the other posts I can find online is about jQuery rather than Prototype... I would swear that I will use jQuery for my next project. But anyway the code is like this, using unobtrusive JS:
in search.js.erb:
$("main_content").update("<%= escape_javascript(render(:partial => "items")) %>");
for sure there is a search.html.erb with pretty similar content:
<%= render :partial => "items" %>
to add a loading screen, do I need to add something before this update function, or in the link_to statement, or somewhere else? I am totally new to this so please don't mind stupid questions. Thanks very much.
Update: I found something useful in the old link_to_remote function, which has a :loading and a :loaded tag to make the loading image or screen show up. However this has been totally not mentioned in the latest link_to of Rails 3. Is there any way to write it into the js file?

Prototype Rails3 Autocomplete not displaying properly in IE8

In my rails3 project, I had to implement a simple text field, a div and a autocomplete helper in my view file. auto complete works well in all browsers except IE. the div element in which the results fall in keeps changing its style attribute. here is the code.
.. #form related other code
<%= text_field_tag('location') %>
<div id="location_auto_complete" class="auto_complete"> </div>
<%= auto_complete_field('location', :url => locations_path(), :indicator => 'locations_indicator', :select => 'value') %>
it works perfect in all browsers. but in IE, the auto suggestions box dislocates itself to some other part in the page. style attribute is added dynamically to that div element everytime there is a response from server.
I am using the latest fork of rails autocomplete plugin https://github.com/fidel/auto_complete . Please help, I am stuck with this problem for hours.
I ran into this same problem. Apparently it is a problem with Prototype's getOffsetParent function and IE8:
https://prototype.lighthouseapp.com/projects/8886-prototype/tickets/618-getoffsetparent-returns-body-for-new-hidden-elements-in-ie8-final#ticket-618-9
Pretty embarrassing for Prototype actually that this still hasn't been fixed since that thread is from March 2009.
Anyway, as someone in that thread mentions, you can edit your prototype.js file and change the first line of getOffsetParent to this:
getOffsetParent: function(element) {
if (element.offsetParent && Element.visible(element)) return $(element.offsetParent);
...
The && Element.visible(element) is the new part. This fixed it for me. Make sure to do a hard refresh (shift-reload) in IE8 so it picks up the new JS after your changes.

visual_effect after replace_html not working in rjs

In learning ruby on rails I've created a blog site. When the user adds a post via AJAX, the following rjs gets called:
page.replace_html 'posts', :partial => #posts
page.visual_effect :Highlight, 'post_' + #post.id.to_s
However, the highlight isn't happening.. neither is any sort of effect even a hide.
Clues:
It works if I just do an insert_html
for just the new post (but I want
to update the whole list of posts
at this time)
If I hard code the id to the next id in the sequence, it doesn't work on the post, but it does work on the next post. { ex.. hardcode post_100... no highlight on submit 100, highlight 100 on submit 101 }
Alert shows that 'post_' + #post.id.to_s is what is expected ( post_100, etc )
Any ideas or debugging suggestions?
Thanks,
Orlando
Can you alert the innerHTML of the $("post_#{#post.id}") before the visual_effect.
Does firebug give you an error when it gets to the visual_effect?
Can you do something else, like an alert after the visual_effect line?
Have you got the required js files included?
It's not really an answer to the problem, but I have since done away with reliance on rjs. Instead I'm following the pattern outlined here
http://blog.solnic.eu/2007/10/30/why-javascript-helpers-in-rails-are-evil
And now all effects are working as expected. Note that I did get the effect working when comments were added using effectively the same code that should have been working here, so I'm fairly convinced there was just some sort of weird operator error going on.

Agile web development with rails - Ajax

i m using rails 2.3.3 and web browser Firefox i have added ajax and java script and it is working too but i have to reload the page every time when i press Add to Cart button to show item additionn in the side bar it don’t show it without reloading.
anyone please help me how can it show item addition in side bar when i press Add to Cart button with out reloading the page?
If you haven't already done so, install Firebug for Firefox, for these reasons:
it'll tell you if you have a Javascript error.
it'll show you if your Ajax request is being received and its contents.
you can inspect your page elements such as the cart to see if it's set to be shown, if the ID is correct, etc. in a much faster way than browsing through the source.
and more (CSS, etc).
If you can't figure it out by looking at the Firebug console, and since you're following a tutorial, why don't you download the Depot source code and compare it with your own to see what you're doing wrong.
If you have the book, the complete source is listed at the end of the book. You can also download the source from here.
The standard ajax helper methods are link_to_remote, form_remote_tag, form_remote_for, button_for_remote. (I might have missed a few.) If you're not using one of them, you could be doing something wrong.
If you're using one of the helper methods with remote as part of the name, you might be missing the update option or the update option is pointed to the wrong html element.
For a form_remote_tag helper:
form_remote_tag(:url => {:controller => controller_name, :action => action_name, :id => id},
:update => element_to_update)
The element_to_update should be the html element's id that you're updating.

Passing large amounts of Template Code into a variable?

I'm using the following to populate a series of markers on a Google map in Rails:
marker = GMarker.new(coords, :icon => home, :title => "home", :info_window => "Info Text Goes Here" )
I'm trying to customize the info window beyond the text and trying to pass a lot of info into it, but I'm not sure exactly how to do it beyond making a really long annoying string. What's the best strategy to pass a lot of formatted info in HTML/CSS? Partials of some sort?
Ahh well, I can't yet comment, but Andrew's code should work on the View, but not in your controller.
It all depends on how your are constructing your Google map markers. If you are generating them in your controller, you'll want to create a function that will return the text for you and pass that to your GMarker object.
If you are creating them via Javascript in the view, then you'll want to use a partial to load the information in.
Perhaps describe the problem further.
Anyway, Sorry to clutter up the answer space with a comment on Andrews answer. :D
Cheers!
Dustin
You should be able do something like this from your view:
marker = GMarker.new(coords, :icon => home, :title => "home", :info_window => render(:partial => 'info_window') )
Where you have a partial in the same folder named _info_window.html.erb
For some reason, using (render :partial) as an argument supplied to the Gmarker caused only the partial to be rendered. When I changed it to render_to_string it worked.

Resources