rails - select all checkboxes inside a div before submitting form - ruby-on-rails

I have a new batch form where user can select books from a div using the checkbox and click on a button to put them in another div which represents the selected books.
It works a bit like a listbox where user can move items between the different boxes except that here am using checkbox and div.
I have done the moving of books from one div to another using jquery.
See code below:
<% form_for #batch do |f| %>
<label style="width: 150px">Batch Name:</label><%= f.text_field :BAT_BATCH_NAME %>
<div id="all_books">
<% #books.each do |book| %>
<div id="book<%= book.BK_OID %>" bookid="<%= book.BK_OID %>" class="innertxt">
<ul>
<li>Book ID: <%= book.BK_OID %></li>
<li>Name: <%= book.BK_NAME %></li>
<li>
<input type="checkbox" name="batch[book_ids][]" id="select<%= book.BK_OID %>" value=<%= book.BK_OID %> class="selectit" />
</li>
</ul>
</div>
<% end %>
<div style="width:100px; text-align:center; margin-left:20px; padding-top: 100px; width:75px; float:left;">
Right »<br /><br />
« Left
</div>
<div id="selected_books"> </div>
<br/><br/>
<%= f.submit 'Update Batch Details' %>
<% end %>
Currently, only the selected books are saved, whether they are found in the 'all_books' div or 'selected_books' div.
However, I want all entries in the 'selected_books' div to be submitted when saving the batch, whether their checkboxes have been checked or not. and ignore all selected entries in the 'all_books' div.
In short, when saving the batch, i want to save only those books found in the 'selected_books' div and ignore the rest whether their checkboxes have been checked or not.
I hope i was clear enough.
I would be really grateful if someone could point me the right direction on how to do that.
Many many thanks for any suggestion provided.

$("#formid").submit(function(){ $("#selected_books").find("input:checkbox").attr({checked: "checked"}); });
That should do the trick.

Related

Is there a conflict with this code and FancyBox3?

Can anyone tell me whats wrong with this section of code? I recently got this to work, but found out soon after the functionality for the Fancybox gallery stopped working. The a link element is only a sliver compared to the over all element. Im not sure if thats it. I know the most recent edit I made was to fix the surrounding row from .row-fluid to .row since that broke my layout. Below is the code:
<body id="portfolio">
<div class="container-fluid" id="particles-js"></div>
<%= render 'layouts/altmenu_gallery' %>
<h1>Portfolio</h1>
<div id="gallery" class="container-fluid">
<% #photos.each_slice(4) do |group| %>
<div class="row ">
<% group.compact.each do |photo| %>
<div class= "col-md-3">
<a class="fancybox" data-fancybox="gallery" href="<%=image_path photo.file_url %>" data-caption="<%= photo.description %>">
<%= image_tag photo.file_url, class:' img-fluid img-thumbnail' if photo.file.present? %>
</a>
</div>
<% end %>
</div>
<% end %>
<br class="clear">
</div>
<%= link_to 'New Photo', new_photo_path %>
</body>
Sorry, but it is not possible to tell without seeing the actual html code or, preferably, live demo. Maybe this issue arises because you have not escaped photo.description and that breaks html code, but, as I said, I can not be sure.

Multiply select html5 form sends only one result if selected several options

I am trying to use a simple html5 form in Ruby on Rails. My fieldset code:
<fieldset class="form-group">
<legend><%= question.title %></legend>
<% question.answers.each do |answer| %>
<div class="form-check">
<label class="form-check-label">
<input type="checkbox" class="form-check-input" name="question-<%= question.id %>" value="answer-<%= answer.id %>">
<%= answer.title %>
</label>
</div>
<% end %>
</fieldset>
is displayed correct, and when I select one or several options and submit, I have only one parameter in the request as it were radiobutton form although I selected several variants:
{"question-162"=>"answer-467"}
How to make this form working correct and send multiply parameters in the submit request?
Change the name attribute of the checkbox to question-<%= question.id %>[] (adding trailing []), and you will get request parameters like below:
{"question-1"=>["answer-1", "answer-3"]}

How to access a single attribute of associated model inside a loop?

I extremely need your assistance. I have many to many :through relationship models: Product, Category and Categorization(as intermediate model). In my view I want to iterate through #products and fetch category's
field "title" on each iteration.
Here's my view:
<div class="col-md-9">
<div class="row">
<section id="projects">
<ul id="thumbs">
<!-- Item Project and Filter Name -->
<% #products.each do |product| %>
<% product.categories.each do |category| %>
<li class="item-thumbs col-md-4 <%= category.title %> ">
<% end %>
<!-- Fancybox - Gallery Enabled - Title - Full Image -->
<a class="hover-wrap fancybox" data-fancybox-group="gallery" title="The City" >
<span class="overlay-img"></span>
<%= icon 'font-icon-plus' %>
</a>
<!-- Thumb Image and Description -->
<%= image_tag product.product_images, alt: product.description %>
<p><%= product.price %></p>
</li>
<!-- End Item Project -->
<% end %>
</ul>
</section>
</div>
As you see, I need to get category's title on each iteration so as to insert it to li "class" and link each product tab to a menu "li".
The problem is that when I iterate through #categories inside #products loop, it executes just once therefore I don't get category's title for each product.
It looks to me like your loop is repeatedly creating the opening li tag rather than collecting all the category titles like you want, resulting in invalid HTML. Try writing your markup like so instead:
<div class="col-md-9">
<div class="row">
<section id="projects">
<ul id="thumbs">
<!-- Item Project and Filter Name -->
<% #products.each do |product| %>
<!-- RELEVANT CHANGES RIGHT HERE! -->
<li class="item-thumbs col-md-4 <%= product.categories.pluck(:title).join(' ') %>">
<!-- Fancybox - Gallery Enabled - Title - Full Image -->
<a class="hover-wrap fancybox" data-fancybox-group="gallery" title="The City" >
<span class="overlay-img"></span>
<%= icon 'font-icon-plus' %>
</a>
<!-- Thumb Image and Description -->
<%= image_tag product.product_images, alt: product.description %>
<p><%= product.price %></p>
</li>
<!-- End Item Project -->
<% end %>
</ul>
</section>
</div>
</div>
This uses Rails' handy pluck method to grab all the relevant category titles directly from the database, then joins them together with spaces to make a valid class string. Is this the effect you were looking for?

rails dynamic data hover over

I am trying to create a hover over action for items inside of a dynamically created loop. I have no idea what the object names are or how many there are. As of now, I have the list printed correctly and a hover over working, however the hover over only prints the info from the first item, no matter which one you are hovering over
<% #reward_definitions_with_user_points.each do |definition| %>
<li>
<a href="#" data-class="popover-inside" data-toggle="popover-follow" data-placement="right" data-btn-edit="hover" data-target="#point-tracker-popover">
<%= definition.first.name %><span class="points"><%= format_points(definition.second) %> pts.</span>
</a>
<div id="point-tracker-popover" style="display:none">
<div class="popover-title"><%=definition.first.name%></div>
<div class="popover-content">
<div class="popover-inner popover-lg">
<%=definition.first.description%><span class="points"><%= format_points(definition.first.points) %> pts.</span>
</div>
</div>
</div>
</li>
<% end %>
For example: if the my list is a,b,c,d,e,f and I want the hover over to display each letter in sequence when activated. However it will display 'a' in the hoverover no matter which one the mouse activates.
You should probably mention that the problem you're having is with popovers. Also showing the html generated by your loop would be helpful. You seem to imply from the tags that popovers are an html5 thing, but I thought they were a part of twitter-bootstrap?
Having said all that...
What you are describing is clearly related to data-target="#point-tracker-popover". Which I believe is pointing to id="point-tracker-popover". The div with this id is being generated inside of your loop (having multiple elements with the same id is bad and is why you are experiencing the behavior you mentioned).
Changing your loop to use each_with_index should fix your problem.
<% #reward_definitions_with_user_points.each_with_index do |definition, index| %>
<li>
<a href="#" data-class="popover-inside" data-toggle="popover-follow" data-placement="right" data-btn-edit="hover" data-target="#point-tracker-popover-<%= index %>">
<%= definition.first.name %><span class="points"><%= format_points(definition.second) %> pts.</span>
</a>
<div id="point-tracker-popover-<%= index %>" style="display:none">
<div class="popover-title"><%=definition.first.name%></div>
<div class="popover-content">
<div class="popover-inner popover-lg">
<%=definition.first.description%><span class="points"><%= format_points(definition.first.points) %> pts.</span>
</div>
</div>
</div>
</li>
<% end %>
Of course, you may be able to simply change the target to a class like data-target=".point-tracker-popover" and change the id="point-tracker-popover" to be class="point-tracker-popover"; which would be a much cleaner approach. I am really not familiar with popovers, though, so I cannot say if this is the only problem you have, or if the second approach will work.

'Add to Cart' button fails using 'Display: inline' in in Agile Web Development with Rails (4th edition)

I cannot make my 'Add to Cart' button inline next to the product price, for some reason that I do not understand, the button appears below the product price.
Here my development settings:
ruby 1.9.3p392
rails 4.0.0.rc2
I following the DEPOT project and I am stuck in ITERATION D3 where the author insert a button next to the product price through the following CSS code:
#store .entry form, #store .entry form div {
display: inline;
}
and my views/store/index.html.erb as follow:
<% if notice %>
<p id="notice"><%= notice %></p>
<% end %>
<h1>Your Pragmatic Catalog</h1>
<% #products.each do |product| %>
<div class="entry">
<%= image_tag(product.image_url) %>
<h3><%= product.title %></h3>
<%= sanitize(product.description) %>
<div class="price_line">
<span class="price"><%= number_to_currency(product.price) %></span>
<%= button_to 'Add to Cart' , line_items_path(:product_id => product) %>
</div>
</div>
<% end %>
Also I have reviewing the HTML rendered from Google Chrome:
<div class="price_line">
<span class="price">$34.95</span>
<form action="/line_items?product_id=4" class="button_to" method="post">
<div><input type="submit" value="Add to Cart" /><input name="authenticity_token"
type="hidden" value="yTcDgb4x1h98dXnI0dQqHv4hjfqduSBPMwsLLL3GeHw=" />
</div></form>
</div>
I have tested over Google Chrome, Firefox, IE9 and Opera. It seems that is not a problem related to browser. I need someone who can explain this weird behavior what could be the smartest way to solve it. :-)
Thanks in advance for any input.

Resources