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.
Related
I have a link_to method in my Ruby on Rails application in one of the views, and when I click on it, the controller is set to do a whole bunch of things... But for some reason I'm seeing this GET request twice even when I click on the link one time.
Here's what the link looks like:
<%= link_to image_tag("excel.png"), spreadsheet_technical_report_path(report) %>
Which goes to /technical_report/id/spreadsheet and here's what it looks like in the controller:
def spreadsheet
spreadsheet = GenerateSpreadsheet.generate(params[:id])
send_file spreadsheet
end
I've even replaced the contents of that function with a binding.pry, and it hits it twice! This is so confusing. my whole GenerateSpreadsheet model does a variety of things and takes approximately a minute, and this second request does nothing but double that time.
Can someone please tell me what I'm missing here? I don't have a view set up for this since I want it to just send the user a download prompt (which it's doing) and not necessarily go to a view. I don't even know if not having a view is even relevant here.
JS
To add to the comments, the main issue here would likely be that you've bound some javascript to the page's a elements.
With an absence of remote: true and other hooks, the only thing which would likely cause a double-fire from your link_to is if Javascript is sending an ajax request too.
You mention that you...
removed //= require tree . from my application.js
... whilst good that this fixed the issue, you have to remember that nothing happens with computers without them being told to do it. IE your "link" wouldn't just double-click for the sake of it.
If your JS works when you remove the //require_tree ., you'll want to look at the other JS files you have. There will be one where you're binding to the $("a").on("click" event, which is likely leading to the double-firing of your link.
Thanks to chaitanya saraf's comment, I just removed the "//= require tree ." from my application.js to get this fixed. Once I got rid of this, I added this to my config/initializers/asset.rb file
Rails.application.config.assets.precompile += [/.*\.js/,/.*\.css/]
Got rid of this annoying problem nice and easily.
I'm thinking AJAX is probably the most logical route to my answer, but I can't find a way to use an AJAX post without making my routing convention useless. As far as I have been able to tell, using
<%= form_for(#post) do |f| %>
you can not give the form_for helper an ID- at least, not with 'do |f|' in there. If I'm understanding this line of code correctly..
$("#test").ajaxForm({url: '/posts', type: 'post'})
Then I would need to give my form tag an ID. If that is true, I could get around that by doing
<form id="test">
But then not only would I have to rename all my helpers, I would have to edit my controller to parse the data posted by the form. Given the size of my project, that could take a week... and it cuts the potential for scale to an extent.
A synopsis for why I'm doing this-
I have a form that is technically an "edit" page, but it is more of a mix of show, edit, and new. There is a mix of info from last month's work, edit boxes for last month's work, and new boxes for this month's. There are four main "blocks" to the page, and each has a separate set of information which may or may not be stored in a separate database table, which may or may not be related to any of the other tables.
It is important for employees to be able to post updates on a regular basis- every few seconds or so. However, this kills system resources as each time they post, it re-loads the entire page. I have code bashed out to use AJAX to refresh specific blocks upon button click, but it does me no good if the entire page automatically re-freshes after the post anyway. Is there a way to either disable the reload in the update action, or to post in a different manner using AJAX so that the page does not refresh/redirect?
Using rails 3.0.20
Using ruby 1.8.7 (2012-10-12 patchlevel 371)
Using Ubuntu 12.04 LTS
I would look at the form_for docs (http://api.rubyonrails.org/classes/ActionView/Helpers/FormHelper.html#method-i-form_for).
The quick answer is you need to add remote: true to your form_for.
I'm still a beginner at web development. It's not my profession. So go easy.
I started building a rails app today, and realized it would make my application so much better if I could get certain links to display in a separate div instead of a new page, or refreshing the entire page. I'm not quite sure how to search for this, and I keep chasing red herrings with google.
Basically, I have a list in a div on the left side of the page, and when one item from that list is clicked, it should appear in the right div. (Nothing else on the page need be changed)
That's really as simple as it is. Do I need to use Javascript for this? Can I get away with the rails js defaults, or should I be using JQuery?
Is there a way to do this without javascript? I really just need a push in the right direction here, I'm tired of not even knowing how to search for this, or what documentation I should be reading.
Like I said, go easy, and you should just go ahead and err to the side of caution, and assume I know nothing. Seriously. :)
Thanks in advance,
-Kevin
(By the way, I'm developing with Rails 3)
Create your views (along with controllers) to be shown inside the div for each item on the left menu. Lets say we have the following structure now:
Item1 (Clicking on it will fetch:
http://myapp.com/item1)
Item2 (Clicking on it will fetch:
http://myapp.com/item2)
and so on...
make sure you only render the html to be put inside your content div. Should not include <head> <body> etc. tags
In your main page you may have your markup like this >
<div id="leftMenu">
Item 1
Item 2
</div>
<div id="content">
Please click on an item on the left menu to load content here
</div>
Finally, add the following Javascript (you'll need jQuery; trust me it's a good decision).
$("#leftMenu a").click(function () {
$("#content").load($(this).attr("href")); //load html from the url and put it in the #content element
return false; //prevent the default href action
});
You will need JavaScript if you want to avoid reloading the page. You can use link_to for links in your lists, and you'll need to use :remote => true to make it send AJAX requests to the server. The server will need to respond appropriately and supply HTML for your div.
link_to documentation is here: http://api.rubyonrails.org/classes/ActionView/Helpers/UrlHelper.html#method-i-link_to (and admittedly it isn't very useful for AJAX functionality).
The last post in this thread shows one possible solution you could use.
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.
The ActiveScaffold list view has a search form that is loaded via ajax when a user click the search link. I'd prefer to have the form show by default when a user opens a list page.
I've figured out a way to trigger the ajax call when the page loads, but I'm wondering if there's a way to get ActiveScaffold to render the form automatically. Is there a template or a method I can override? I've had a look through the code but there's nothing obvious, at least to me.
Update:
srboisvert's answer inspired me to have a better look.
The trick is to use Template overrides to refactor the following: list.rhtml, _list_header.rhtml, _search.rhtml so that the search form partial renders inline.
There is a way to get it rendered automatically:
active_scaffold :model do |config|
config.list.always_show_search = true
end
I don't currently have an active scaffold project handy but here is how I would figure it out.
I'd use firefox with firebug installed and take a look at what is called when the link is clicked. Then I would go look at that javascript and what it is generating. Then I would search the source for any part of the code or combination that would be fairly unique to the search box ajax. After that it should be easy to cut and past it in without the ajaxyness.
The option
config.list.always_show_search = true
works fine, but only on concrete controller. It throws an exception when used in AS set_default block. Somebody know better solution then to include it in every controller (apart from overriding the template which is handy but complicates version updates)