This might be an easy one for you guys, but I'm not sure the best way to achieve it.
Is there some type of .erb I can write that asks "If :notice is present, then render..."?
Here's more about the issue:
My controller specifies a :notice for both the create and update actions (pretty standard). When I load the pages, the notices do as I'd expect and show up. When I reload the page however, (not sure why someone would do this, but I did), the :notice goes away (great, that's what I want), but the containing <div> remains.
How do I go about ensuring that the encapsulating <div> is removed along with the :notice? I'm not sure what conditionals to specify in my view or maybe controller. The view looks something like this (btw, I'm using Twitter Bootstrap JS alerts).
View
<div class="alert-message success fade in" data-alert="alert">
<a class="close" href"#">×</a>
<p><%= notice %></p>
</div>
My controller is a single scaffolded model/resource with basic structure
What I did was:
<% if notice == "[:notice string]" %>
.
.
.
<% end %>
Not sure if this is the most efficient and "Rails-y" way to do it, but it worked for me.
Related
I have a rails app where users can Sign Up/Sign In and post stories, follow other authors, what i want to achieve is how to put some content like "Authors to follow" in between of the main content while the user is scrolling (Like what twitter does with "Who to follow".
with react i have created a User_Follow_suggestion_container:
<%= react_component('FollowSuggestionsContainer') %>
It works fine, now i want to know, where to place it, so it can come randomly or after scrolling down to 20 or 30 posts.
Assuming your react component is inside a loop, you'd do something like this:
<%- #tweets.each_with_index do |tweet, index| %>
<%= tweet %>
<%- if index == 20 ( or 30 or even rand(20..30)) %>
<%= react_component('FollowSuggestionsContainer') %>
Sorry if the syntax is wrong. I haven't used ERB in years..
Edit: If you want it after scroll, you'd probably do something with JavaScript instead of Ruby/Rails.
I have a single controller that has 2 actions/views and a channel all of which have been scaffolded and pretty much using a default project.
When I load either view I can see that the channel subscribes properly.
I need the subscription to happen only on one of the views. Currently the asset pipeline appears to be compiling everything into a single js file and then serving that js file to every page.
When I scaffolded my channel it created some javascript called channel.js. How can I include channel.js with only specific actions/views?
The asset pipeline indeed compiles everything into a single JS file, so there is no built-in way to limit the execution of certain JavaScript files to specific actions.
There is a way to solve this, however. First, add this helper method to application_helper.rb:
# application_helper.rb
def body_classes(*args)
return (#body_classes || []).join(" ") if args.empty?
#body_classes ||= []
#body_classes += args.map { |klass| klass.to_s.gsub("_", "-") }
#body_classes.uniq!
nil
end
And use it in your layout:
<!-- application.html.erb -->
<body class="<%= body_classes %>">
<!-- ... -->
</body>
With this, you can specify certain body classes in your templates, to be added to the <body> tag:
<!-- your_action.html.erb -->
<%= body_classes :my_custom, :action_class %>
<h1>Your action</h1>
<!-- ... -->
The code above will add the following classes to <body>:
<body class="my-custom action-class">
Finally, you can test for these body classes in your JS code:
// your_action.js
if($("body").hasClass("my-custom")) {
// run code specific to pages with the 'my-custom' class
}
Try going into your controller that holds the method to the view you want to have the javascript incorporated in and write this inside:
def 'the view you want to effect' # This could be "index" for your index.html.erb view
#java = "channel.js"
end
Then in the following file, locate your <%= javascript_include_tag %>
views > layout > application.html.erb
Include this into your tag to load a different javascript file for any view you want with the previous process. (Try it with CSS inside your CSS include tags too.)
<%= javascript_include_tag '#{#java}' %>
My application allows a user to make a list with different categories. While making a list, if the user decides they would like another category, they may create one without leaving the page. The new category will appear in the list, and the user can begin adding items to it.
My issue seems to be that adding any Rails helpers (link_to, render) to my 'new.js.erb' file, it stops the script from doing it's thing. My new div and dropdown menu are not rendered. I get no errors on the console or the server logs. Just nothing. If I remove these methods, everything works fine.
function addCategory(){
var lastCategory = '<%= current_user.categories[-2].name %>';
console.log(lastCategory);
$('#' + lastCategory).after("<h3 class='category'><%= #category.name %></h3>\
<div class='dropdown-button' data-toggle='collapse' data-target='#<%= #category.name %>'>\
<span class='glyphicon glyphicon-chevron-down'></span>\
</div>\
<div id='<%= #category.name %>' class='collapse'>\
<h4>Create a new item here:</h4>\
<div id='append<%= #category.id %>'></div>\
<%= link_to 'Home', root_url %>\ //does not work!
</div>");
}
It's just the link_to and other methods that seem to be causing a problem. All other erb tags <%= %> seem to work and render appropriately.
My goal is to render a form and a link in this newly rendered dropdown section, but since the root of the problem seems to be Rails methods in general, I added a link_to home for clarity.
Damnit, I figured it out. Forget to add 'j' to my rails helpers to convert them to JavaScript
<%= j link_to "Home", root_url %>
Hi I am new to backbone and I understand that you essentially route javascript to HTML pages, but I cant seem to route any javascript to the application.html.erb since it doesnt have a specific URL.
I can solve this problem, by removing the HTML I want to work on and move it to the index page, but this really isnt what I want.
My "solution"
views/posts/post_index.js.coffee
class Poster.Views.PostsIndex extends Backbone.View
template: JST['posts/index']
events:
'click #new_post': 'createPost'
initialize: ->
#collection.on('reset', #render, this)
#collection.on('add', #appendEntry, this)
render: ->
$(#el).html(#template())
#collection.each(#appendEntry)
this
createPost: (event) ->
Backbone.history.navigate("/posts/new", true)
appendEntry: (post) ->
view = new Poster.Views.Post(model: post)
$('#posts_container').append(view.render().el)
index.jst.eco
<div id="menu_bar" class="jumbotron menu_bar row">
<div class="col-sm-2">
<button id="new_post" type="button" class="btn btn-default">Post</button>
</div>
<div class="col-offset-8 col-sm-2">
List
</div>
</div>
With front end frameworks your best bet is to remove anything you need js access to out of the application.html file. If you really wanted to keep that stuff in the application.html file, you could give each element you want access to an id so that you can easily find it with javascript. Other than that your best bet would be to move everything into the index page like you said.
I create a page and some parts of it are layout files that are rendered. However I want to render one of these rendered part again with javascript code.
I want to render these part again
<div id="dialog" title="Bookmark Folders" style="resize: both;">
<%=render "layouts/filetree.html.erb"%>
</div>
It render function creates this:
<div id="accordion">
<% #user.folders.each do |f| %> <h3 id="<%= f.folder_name%>" class="folderBar"><b id="folderName"><%= f.folder_name%></b> created <%=distance_of_time_in_words(f.created_at, Time.now)%> before</h3>
<div class="<%= f.folder_name.delete(" ")%>">
<%if f.docs.empty?%>
<b>-No document currently!-</b>
<%else%>
<% f.docs.each do |r|%>
<%= r.title%><br/>
<b><%=r.url%></b><br />
<%= r.snippet%><hr/>
<%end%>
<%end%>
</div>
<%end%>
</div>
Because after some execution there are some changes over "folders", I want to render this part again to see the update.
You shouldn't attempt to render erb with javascript - it's not how it's done (not to mention you'd have to write yourself a erb parser and eventually call the server for data anyway).
If on the other hand, you're asking how to issue the render of some template using Javasript and then replace old content with new one then...
Watch this http://railscasts.com/episodes/205-unobtrusive-javascript,
read this Rails 3 and RJS to get the idea of how to trigger some content updates via javascript.
General idea is
Render the initial full page
Trigger ajax call (either after some time or by manual user request) to do a request to your rails application
Handle that request and respond to it with javascript script (the script content should contain all the functionality and content to replace what you want)
It's possible to share templates between the server and the client. One library that allows for this is called mustache.
But if this is the only case you need it I'd go with the RJS approach as well.
Instead of rendering I did it AJAX way and update it on the page. Thanks for the answers but I did not use any of these.