I have a liveview called Menu with 3 Live Component Categories, Products, and Variants
phx-click set up on each category, product, so when click on category, handle_event will
return assign(socket, :products, products) ProductsComponent will products for the clicked category, and click on product, Variants will show.
And the handle_events are inside the Menu View
defmodule MyAppWeb.Admin.LocationLive.Menu do
use MyAppWeb, :live_view
import MyAppWeb.Admin.LocationLive.Helpers,
only: [
get_categories: 1,
get_products: 2,
get_variants: 2
]
alias MyApp.Manager.Base
#impl true
def mount(%{"id" => location_id}, _session, socket) do
case Base.get_location(location_id) do
nil ->
{:noreply, redirect(socket, Routes.admin_business_path(MyAppWeb.Endpoint, :index))}
location ->
{:ok,
socket
|> assign(:page_title, "Menu")
|> assign(:location, location)
|> assign(:products, [])
|> assign(:variants, [])
|> assign(:selected_category_id, nil)
|> assign(:selected_product_id, nil)
|> assign(:categories, get_categories(location)), temporary_assigns: [categories: []]}
end
end
#impl true
def handle_event(
"show-products",
%{"category" => category_id},
socket
) do
location = get_location(socket)
{:noreply,
socket
|> assign(:products, get_products(location, category_id))
|> assign(:variants, [])
|> assign(:selected_category_id, category_id)}
end
#impl true
def handle_event(
"show-variants",
%{"product" => product_id},
socket
) do
location = get_location(socket)
{:noreply,
socket
|> assign(:variants, get_variants(location, product_id))
|> assign(:selected_product_id, product_id)}
end
defp get_location(socket) do
socket.assigns.location
end
end
menu.html.leex
<div class="row">
<div class="<%= row_parts_class(4) %>">
<div class="align-items-center <%= row_parts_class(12) %>">
<h5 class="h5 font-weight-bold text-default">Categories</h5>
</div>
<%= live_component #socket, MyAppWeb.Admin.LocationLive.CategoriesComponent,
categories: #categories,
location: #location,
id: "categories-component"
%>
</div>
<div class="<%= row_parts_class(4) %>">
<div class="align-items-center <%= row_parts_class(12) %>">
<h5 class="h5 font-weight-bold text-default">Products</h5>
</div>
<%= live_component #socket, MyAppWeb.Admin.LocationLive.ProductsComponent,
products: #products,
location: #location,
category_id: #selected_category_id,
id: "products-component"
%>
</div>
<div class="<%= row_parts_class(4) %>">
<div class="align-items-center <%= row_parts_class(12) %>">
<h5 class="h5 font-weight-bold text-default">Variants</h5>
</div>
<%= live_component #socket, MyAppWeb.Admin.LocationLive.VariantsComponent,
variants: #variants,
location: #location,
product_id: #selected_product_id,
id: "variants-component"
%>
</div>
</div>
My problem is that after clicking on product, and variants are shown, then I go back to click on another category, it will show new products, but the old variants are still there. So I tried to assign(socket, :variants, []) in category handle_event, but it throws an error in console no component for CID 2, and the old Products and Variants components remain unchanged.
Anyone has any idea how to fix this or maybe a workaround to clear out the VariantsComponent everytime a category is clicked?
Thanks!
After playing around with it, I got the variants to hide by setting selected_product_id to nil and put an if statement around the Variants live component
<%= if #selected_product_id do %>
<%= live_component #socket, MyAppWeb.Admin.LocationLive.VariantsComponent,
variants: #variants,
location: #location,
product_id: #selected_product_id,
id: "variants-component"
%>
<% end %>
and inside of menu
{:noreply,
socket
|> assign(:products, get_products(location, category_id))
|> assign(:selected_product_id, nil)
|> assign(:selected_category_id, category_id)}
I guess this way, when live view pushes change to the view, it will check the if it should render the live component, which ends up hiding the variants component when selected_product_id is nil
Related
I am receiving the following error on a project of mine: First argument in form cannot contain nil or be empty. I am trying to create an edit page for my code. Fairly new with Rails and trying to learn without scaffolding.
Controller:
class BooksController < ApplicationController
def new
#book = Book.new
#authors = Author.all
end
def edit
#book = Book.find(params[:id])
end
def show
#Notice how the #books is plural here.
#books = Book.all
#authors = Author.all
##books = Book.where(id: params[:id])
end
#Create method will save new entries
def create
#book = Book.new(book_params)
#authors = Author.all
if #book.save
flash[:success] = "Book Added to Databse!"
redirect_to #book
else
render 'new'
end
end
private
#Note that this method will go up into the create method above.
def book_params
params.require(:book).permit(:title, :pub_date, :publisher, :author_id)
end
end
Model Page: (For Book)
class Book < ActiveRecord::Base
validates :title, :pub_date, :publisher, presence: true
validates :title, uniqueness: true
belongs_to :author
end
Model Page: (For Author)
class Author < ActiveRecord::Base
validates :name, presence: true
validates :name, uniqueness: true
has_many :books
end
Edit page:
<h1>Update a book entry</h2>
<div class="row">
<div class="col-md-6 col-md-offset-3">
<%= form_for(#book) do |f| %> **ERROR SEEMS TO BE RIGHT HERE!!!**
<%= render 'form' %>
<div class="form-group">
<%= f.label :title %>
<%= f.text_field :title, class: 'form-control' %>
</div>
<div class="form-group">
<%= f.label :pub_date %>
<%= f.text_field :pub_date, class: 'form-control' %>
</div>
<div class="form-group">
<%= f.label :publisher %>
<%= f.text_field :publisher, class: 'form-control' %><br />
</div>
<div class="form-group">
<%= f.select(:author_id,
#authors.collect {|a| [ a.name, a.id ]},
{:include_blank => 'Please select an author'},
class: "form-control") %><br />
</div>
<%= f.submit 'Save Changes', class: "btn btn-primary" %>
<% end %>
</div>
</div>
Render form page (_form.html.erb)
<% if #book.errors.any? %>
<div id="error_explanation">
<div class="alert alert-danger">
<h2><%= pluralize(#book.errors.count, "error") %>
prohibited this entry from being saved:</h2>
<ul>
<% #book.errors.full_messages.each do |msg| %>
<li><%= msg %></li>
<% end %>
</ul>
</div>
</div>
<% end %>
SHOW PAGE:
<div class="move">
<h1>Showing Book Titles:</h1>
</div><br />
<div class="row">
<% #books.each do |book| %>
<div class="col-md-4">
<div class="panel panel-default">
<div class="panel-body">
<h2><%= book.title %></h2>
<h2><%= book.publisher %></h2>
<h2><%= book.pub_date %></h2>
<h2><%= book.author.name %></h2>
<h2><%= link_to "Edit", edit_path, class: "btn btn-primary" %>
</div>
</div>
</div>
<% end %>
Here is my Log telling me what is wrong:
Started GET "/edit" for ::1 at 2015-08-14 16:49:17 -0400
Processing by BooksController#edit as HTML
Rendered books/edit.html.erb within layouts/application (2.2ms)
Completed 500 Internal Server Error in 9ms (ActiveRecord: 0.0ms)
ActionView::Template::Error (First argument in form cannot contain nil or be empty):
3: <div class="row">
4: <div class="col-md-6 col-md-offset-3">
5:
6: <%= form_for(#book) do |f| %>
7: <%= render 'form' %>
8:
9: <div class="form-group">
app/views/books/edit.html.erb:6:in `_app_views_books_edit_html_erb___525891009649529081_70260522100960'
I will say that I have deleted the first 14 books from my data base and so the first book start on ID 14. Not sure if that matters.
Finally, I have tried adding all of these different instance variables to my controller in the edit method:
##book = Book.where(id: params[:id])
##book = Book.find_by_id(params[:id])
##book = Book.all
##book = Book.find_by_id(params[:id])
#book = Book.new(book_params)
#When I use the two below lines,
there are no error pages but create a new entry.
##book = Book.new
##authors = Author.all
Any Help will be appreciated! Thank you for your time!!!
This error means that the first argument to form_for is a nil value (in this case #book). Most of the times I've seen this, it's due to malformed controller actions, but that doesn't look to be the case here. From what I can tell, it's one of two things:
You're trying to edit a Book that doesn't exist. Do a .nil? check on it before deciding to render the form, and render an error message (or redirect) instead.
Your routes are broken, and the edit action is not rendering the edit view. This is most likely not the case.
EDIT:
After updating with your template for show, this looks like your problem:
<%= link_to "Edit", edit_path, class: "btn btn-primary" %>
I see two problems with this (though I'll need to see the output of rake routes to verify). Firstly, you need to pass an argument to the edit path (without them, where would your params come from?). Secondly, the default route for this would be edit_book_path.
Try this:
<%= link_to "Edit", edit_book_path(book), class: "btn btn-primary" %>
Assuming book ID 14 is in your database, you should be able to navigate to localhost:3000/books/14/edit if you created it with something like resources :books (documentation here). If this doesn't work, either your routes are not defined correctly or book with ID 14 does not exist in your database.
On your show view, change the link_to line to:
<%= link_to 'Edit', edit_book_path(book), class: "btn btn-primary" %>
So two changes:
Again, assuming book is a Restful resource, when you run rake_routes, you should see the path to edit is edit_book_path.
You need to pass the book instance with the path so Rails knows which object you wish to edit.
I found the correct syntax here.
Hope this helps.
I have a Rails ajax form to submit.When user will give the correct data it will search the database and do the operation accordingly.If user is giving the Wrong data it should display user to alert message.But it is not happening like that.
I am explaining my codes below.
home.html.erb
<% if current_admin %>
<p class="flash-message"><%=flash[:notice]%></p>
<div class="col-md-6" style="float:none; margin:auto;">
<%= form_for :sdf ,:url => {:action => "scan_report" },remote: true do |f| %>
<% if params[:receipt_no] %>
<div class="input-group bmargindiv1 col-md-12"> <span class="input-group-addon text-left">Receipt No. Scan :</span>
<%= f.text_field :Receipt_No,:class => "form-control", :value => params[:receipt_no] %><%= f.submit "Scan Report" %>
</div>
<% else %>
<div class="input-group bmargindiv1 col-md-12"> <span class="input-group-addon text-left">Receipt No. Scan :</span>
<%= f.text_field :Receipt_No,:class => "form-control",placeholder:"Receipt No. scan" %><%= f.submit "Scan Report" %>
</div>
<% end %>
<% end %>
<% end %>
controller/homes_contorller.rb
class HomesController < ApplicationController
def home
#sdf=TSdf.new
respond_to do |format|
format.html
format.js
end
end
def scan_report
if #sdf=TSdf.find_by_Receipt_No(params[:sdf][:Receipt_No])
if #sdf && #sdf.HCSY_Status=='YES'
#hcsy=THcsy.find_by_Sdp_Id(#sdf.Sdp_Id)
#hcsy_deatils=THcsyDetails.find_by_HCSY_ID(#hcsy.id)
#woods=THcsyFundTypeMaster.find_by_Fund_Type_Code(1)
#burn=THcsyFundTypeMaster.find_by_Fund_Type_Code(2)
#good=THcsyFundTypeMaster.find_by_Fund_Type_Code(3)
#swd=THcsyFundTypeMaster.find_by_Fund_Type_Code(5)
#photo=THcsyFundTypeMaster.find_by_Fund_Type_Code(6)
end
else
flash[:notice]="Not Found"
end
end
end
In this form its only taking the correct input but if user is trying to give the wrong input the else part is not executing.Please help me to resolve this error and let me to know how can i make this ajax call in below format.
$('form').submit(function() {
var valuesToSubmit = $(this).serialize();
$.ajax({
type: "POST",
url: $(this).attr('action'), //sumbits it to the given url of the form
data: valuesToSubmit,
dataType: "JSON" // you want a difference between normal and ajax-calls, and json is standard
}).success(function(json){
console.log("success", json);
});
return false; // prevents normal behaviour
});
Please help me.I am using Rails version 3.2.19.
Here you send AJAX POST request to scan_report, and if it is successful it should render template scan_report.js.erb, and rendered template will appear in json variable in success callback.
But if params are not valid, the same template is rendered, but all instance variables are missing. And probably empty json is returned or an error appears in log.
Anyway, if you'd like to change flash in remote form, you should put custom code in fail callback. Something like
$("#flash").html('<%= j render flash[:notice] %>');
I'm using an example from Eric London http://ericlondon.com/2014/03/13/rails-4-submit-modal-form-via-ajax-and-render-js-response-as-table-row.html
And have adapted it slightly to my scenario:
While editing a Team (model) I want to pop a modal form to Add a new User. I can get this working i.e. when all fields are correct, the record is saved and the modal closes, but I am not getting errors back into the modal when there is a problem.
I also am uncertain how to structure the Create controller action correctly - this is definitely not right.
In the Users controller, create action (below) I can save the record as I expect, I have commented out the original code (I still need this - its the defaults for normal user management)
def create
#if params[:modal].nil? || params[:modal] == ''
# create! { users_url }
#else
respond_to do |format|
password = Devise.friendly_token.first(6)
#user.password = password
#user.password_confirmation = password
#user.external = true
if #user.save!
format.js { render action: 'show', status: :created, location: #user }
else
format.js { render json: #user.errors, status: :unprocessable_entity }
end
end
#end
end
the show.js.erb view
$('#new_user_modal').modal_success();
and the application.js code:
$(document).ready(function(){
$(document).bind('ajaxError', 'form#new_user', function(event, jqxhr, settings, exception){
// note: jqxhr.responseJSON undefined, parsing responseText instead
$(event.data).render_form_errors( $.parseJSON(jqxhr.responseText) );
});
});
(function($) {
$.fn.modal_success = function(){
// close modal
this.modal('hide');
// clear form input elements
// todo/note: handle textarea, select, etc
this.find('form input[type="text"]').val('');
// clear error state
this.clear_previous_errors();
};
$.fn.render_form_errors = function(errors){
$form = this;
this.clear_previous_errors();
model = this.data('model');
// show error messages in input form-group help-block
$.each(errors, function(field, messages){
$input = $('input[name="' + model + '[' + field + ']"]');
$input.closest('.form-group').addClass('has-error').find('.help-block').html( messages.join(' & ') );
});
};
$.fn.clear_previous_errors = function(){
$('.form-group.has-error', this).each(function(){
$('.help-block', $(this)).html('');
$(this).removeClass('has-error');
});
}
}(jQuery));
in the teams form I have the link and the modal definition:
<%# Added Bootstrap data modal attribute %>
<%= link_to 'Add an External User', '#new_user_modal', 'data-toggle' => 'modal', class: 'btn btn-default' %>
<%# Bootstrap modal markup. #see: http://getbootstrap.com/javascript/#modals %>
<div class="modal fade" id="new_user_modal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
<h4 class="modal-title" id="myModalLabel">Create new User</h4>
</div>
<div class="modal-body">
<%# Render the new person form (passing modal => true to enable remote => true) %>
<%= render 'users/new', modal: true %>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
in the users/_new.html.erb view I have:
<% #user = User.new %>
<%= simple_form_for #user, remote: true, input_html: {role: :form, 'data-model' => 'user'} do |f| -%>
<% if #user.errors.any? %>
<div id="error_explanation">
<h2><%= pluralize(#user.errors.count, "error") %> prohibited this user from being saved:</h2>
<ul>
<% #user.errors.full_messages.each do |msg| %>
<li><%= msg %></li>
<% end %>
</ul>
</div>
<% end %>
<fieldset>
<!-- username -->
<%= f.input :remote_id, label: "Payroll Code / Username" %>
<!-- basic settings -->
<div class="row">
<div class="col-md-6">
<%= f.input :first_name %>
</div>
<div class="col-md-6">
<%= f.input :last_name %>
</div>
</div>
<%= f.input :email %>
</fieldset>
<div class="actions">
<%= f.submit 'Submit', class: 'btn btn-primary' %>
</div>
<% end -%>
So, to sum up where I am at:
I want to add new users from a modal form while editing another
model
The approach above mostly works...
But is heinously ugly - it
feels wrong/messy and I am not happy with it.
It seems you don't have any 'help-block' classes on your form.
Try:
$.each(errors, function(field, messages){
$input = $('input[name="' + model + '[' + field + ']"]');
$span_error = $("<span></span>").addClass('help-block').html( messages.join(' & ') );
$form_input = $input.closest('.form-group').addClass('has-error').find('.form-control');
$span_error.insertAfter($form_input);
});
Instead of:
// show error messages in input form-group help-block
$.each(errors, function(field, messages){
$input = $('input[name="' + model + '[' + field + ']"]');
$input.closest('.form-group').addClass('has-error').find('.help-block').html( messages.join(' & ') );
});
I have a course model and there is a many to many relationship with category, i am using a multi select on my form to get an array of objects, A course also can have a partner and the user can select this from a single select, but when i want to save to the database I call the params then I get a string instead of an object. not to sure how I can solve this
<%= form_for #course do |f| %>
<section class="new_course">
<div class="row collapse">
<div class="medium-5 small-centered column">
<%= f.label :course_title, :class=>"custom-prefix-class" %>
<%= f.text_field :title, :autofocus => true, :class=>"custom-input-class" %>
</div>
</div>
<div class="row collapse">
<div class="medium-5 small-centered column">
<%= f.label :start_date, :class=>"custom-prefix-class" %>
<%= f.text_field :start_date, :class=>"custom-input-class" %>
</div>
</div>
<div class="row">
<div class="medium-5 column with_chosen">
<%= f.collection_select :categories,
Category.all ,:id,:name,
{ include_blank: true},
{ class: 'chosen-select', :multiple=>true, :data => { :placeholder => ' ' }}
%>
</div>
</div>
<div class="row">
<div class="medium-5 column">
<%= f.collection_select :partner,
Partner.all.collect, :id,:name ,
{ include_blank: true },
{ class: 'chosen-select', :multiple=>false, :data => { :placeholder => ' Brand Partner' }}
%>
</div>
</div>
In my controller
def create
#course = Course.new(course_params)
end
if #course.save
render :action=>'new'
end
end
private
def course_params
params.require(:course).permit(:title, :start_date,:duration,:partner,:categories => [])
end
//rails server output
Started POST "/courses" for 127.0.0.1 at 2014-02-07 16:45:28 +0200
Processing by CoursesController#create as HTML
Parameters: {"utf8"=>"✓", "authenticity_token"=>"sKhAF2X6VOXTxZC9Pt51RFQfZSKdzXVWji6x4uwg+rI=", "course"=>{"title"=>"Marketing ", "start_date"=>"14-02-2014", "categories"=>["", "1", "2"], "partner"=>"1", "duration"=>"2-weeks"}, "commit"=>"Add new course"}
Completed 500 Internal Server Error in 3ms
ActiveRecord::AssociationTypeMismatch (Partner(#70274068591140) expected, got String(#70274066607160)):
app/controllers/courses_controller.rb:24:in `create'
try this out:-
it seems as that partner is a model and course has_one partner, so you
have to assign partner class object instead of id as string
actually as you can see in in question above value of
params[:course][:partner]
=> "1"
is a string now if you try to do something like #course.partner
= '1' it will raise an error like above, as on left hand side we have parter association and right and side a string.
just do this
def course_params
params.require(:course).permit(:title, :start_date,:duration,:partner,:categories => [])
if params[:course][:partner].present?
params[:course][:partner] = Partner.find params[:course][:partner]
end
end
Here is the users show view where they are supposed to show up. ..
<section>
<div id= "purchases">
<%= render 'shared/micropost_form_purchase' %>
</div>
<div id="sales">
<%= render 'shared/micropost_form_sale' %>
</div>
</section>
<%= #sales %> <%# This is just to see if it outputs anything. It doesn't :( %>
<div id="purchases list">
<ol class="microposts">
<%= render #purchases unless #purchases.nil? %>
</ol>
</div>
<div id="sales list">
<ol class="microposts">
<%= render #sales unless #sales.nil? %>
</ol>
</div>
so the forms (partials) are loading fine, but then when I make a post, in either one, neither the purchases list nor the sales list shows up. I checked the database and they are being created along with an entry in the column indicating kind (either sale or purchase).
Here are the forms:
<%= form_for (#micropost) do |f| %>
<div class="field no-indent">
<%= f.text_area :content, placeholder: "What's something else you want to buy?" %>
<%= hidden_field_tag 'micropost[kind]', "purchase" %>
</div>
<%= f.submit "Post", class: "btn btn-large btn-primary" %>
<% end %>
and
<%= form_for (#micropost) do |f| %>
<div class="field no-indent">
<%= f.text_area :content, placeholder: "What's something else you want to buy?" %>
<%= hidden_field_tag 'micropost[kind]', "sale" %>
</div>
<%= f.submit "Post", class: "btn btn-large btn-primary" %>
<% end %>
also, here is the show part of the users_controller.rb
def show
#user = User.find(params[:id])
#micropost=Micropost.new
#microposts = #user.microposts.paginate(page: params[:page])
end
and here is the show part of the microposts_controller.rb
def show
#micropost = Micropost.find(params[:id])
#microposts = Micropost.where(:user_id => #user.id)
#purchases= #microposts.collect{ |m| m if m.kind == "purchase"}.compact
#sales = #microposts.collect{ |m| m if m.kind == "sale"}.compact
end
additionally, with the help of this post (http://stackoverflow.com/questions/12505845/ruby-error-wrong-number-of-arguments-0-for-1#12505865) the variables #microposts, #purchases, and #sales are all outputting correctly in the console.
can anyone help me out?
edit: using scopes as suggested by the answer given works in the console (it outputs everything correctly, but they still don't show up in the view. Does this mean it is something wrong with my syntax for the users show page?
edit 2:
Here is the view/microposts/_micropost.html.erb code
<li>
<span class="content"><%= micropost.content %></span>
<span class="timestamp">
Posted <%= time_ago_in_words(micropost.created_at) %> ago.
</span>
<% if current_user?(micropost.user) %>
<%= link_to "delete", micropost, method: :delete,
confirm: "You sure?",
title: micropost.content %>
<% end %>
</li>
I'm making some assumptions without seeing more of your code, but it looks like you could
write what you've shown a little differently. I'm assuming your databases are migrating
and have the required columns, e.g., Micropost#kind, Micropost#user_id, etc.
You can use scopes to refine a collection of microposts more expressively. It might be helpful to read
up about ActiveRecord scopes: http://guides.rubyonrails.org/active_record_querying.html#scopes.
class Micropost < ActiveRecord::Base
belongs_to :user
scope :purchases, where(:kind => "purchase")
scope :sales, where(:kind => "sale")
# your code
end
I'm also assuming your user has many microposts:
class User < ActiveRecord::Base
has_many :microposts
# your code
end
For your forms, I'd suggest attaching your hidden field to the form object (f.hidden_field) so
you don't have to specify the name as 'micropost[kind]'.
<%= form_for(#micropost) do |f| %>
<div class="field no-indent">
<%= f.text_area :content, placeholder: "What's something else you want to buy?" %>
<%= f.hidden_field :kind, :value => "sale" %>
</div>
<%= f.submit "Post", class: "btn btn-large btn-primary" %>
<% end %>
In MicropostsController#show, you can use your new scopes:
def show
#micropost = Micropost.find(params[:id])
#microposts = #user.microposts
#purchases = #microposts.purchases
#sales = #microposts.sales
end
You should also confirm that your MicropostsController#create action is actually adding
the microposts to the user sending the form (I'm assuming a current user method).
def create
#micropost = current_user.microposts.create(params[:micropost])
# yada
end
You can also confirm expected results on rails console after creating purchases or sales micropost with:
Micropost.purchases
Micropost.sales
Again, I could be missing something without seeing more of the code base.
Check Micropost.count, #purchases.count, #sales.count (by printing them in the controller, or some part of the view) to see if the records actually exist.
Also, if you want to render collections likes #sales and #purchases, you need to make sure that the model partial exists (_micropost.html.erb in your case). That is probably where you need to look for the view errors. For all you know, that file could be empty, thus no errors will show up at all.
The problem might also lie in your microposts#create (or whichever action that you are saving the micropost in), the micropost should be associated with the current_user:
#micropost = current_user.microposts.build(params[:micropost])
Taking this and your previous question into account, I suggest you go through the original code for the RoR tutorial again (and verify that all tests are passing) before taking it apart. You can always add new tests to it for your experiments and they will help in figuring out where you went wrong.