Some reason this form worked locally, but now when I put the code on a Digital Ocean droplet the submit button no longer submits.. It doesn't do anything, and does not go to the controller. Not sure what's wrong. Code for partial is attached below:
<%= form_for(#amazon, url: amazon_index_path) do |f| %>
<div class="col-md-12 well"> <!-- This is the first well, and says take
up all the 8 rows we have-->
<div class="form-group">
<h4>Merchant Id</h4>
<div class="input-group input-group-lg">
<div class="input-group-addon border">
<span class="glyphicon glyphicon-user" aria-hidden="true"></span>
</div>
<%= f.text_field :merchant_id, :placeholder => "Merchant Id",
class: "form-control input-group-lg", required: true %>
</div>
</div>
<div class="form-group">
<h4>
Marketplace
</h4>
<div class="input-group input-group-lg">
<div class="input-group-addon border">
<span class="glyphicon glyphicon-globe" aria-hidden="true"></span>
</div>
<%= f.select :marketplace,
grouped_options_for_select(marketplace_listing),
{}, class: 'form-control input-group-lg' %>
</div>
</div>
<div class="form-group">
<h4>MWS Auth Token</h4>
<div class="input-group input-group-lg">
<div class="input-group-addon border">
<span class="glyphicon glyphicon-file" aria-hidden="true"></span>
</div>
<%= f.text_field :auth_token, hide_label: true,:placeholder => "MWS
Auth Token",
class: "form-control input-group-lg", required: true %>
</div>
</div>
<%= f.submit 'Save Profile', class: 'btn btn-green btn-lg btn-block' %>
</div> <!--this is the well and takes up the 8 columns -->
<% end %>
I did just get this error in the console:
enteReferenceError: ShopifyApp is not defined
ShopifyApp.ready(function(){r code here
Related
Below code snippet is a case add form where it shows the select tag in UI but if it is clicked on its arrow button nothing is viewed, in-browser console it shows all the select options.
<div id="addCaseForm" style="display:none">
<%= form_tag("#{#view.addUrl}", method: "post") do %>
<div class="row padlef">
<div class="col-sm-8">
<div class="form-group">
<%= label_tag("Case Title:") %>
<%= text_field_tag(:name) %>
<div class="help-block with-errors"></div>
<div>
<div>
</div>
<div class="padlef">
<div class="form-group">
<div class="col-sm-3 f-n32 p7-lr">
<%= label_tag("Assign To") %>
<%= select_tag 'userId', option_for_select_assignee %>
<div class="help-block with-errors"></div>
</div>
<div class="col-md-3 f-n32 p7-lr">
<%= label_tag("Priority")%>
<%= select_tag 'priority', option_for_select_priority %>
<div class="help-block with-errors"></div>
</div>
<div class="col-md-2 f-n32 p7-lr">
<%= label_tag("Case Type") %>
<%= select_tag 'c_type', option_for_select_c_type %>
<div class="help-block with-errors"></div>
</div>
<div class="form-group margboth margbot col-md-12 clearfix">
<a class="btn btn-primary ftn16 hvr-shutter-out-horizontal cancelAddCase"><i class="fa fa-times-circle "></i> Cancel</a>
<button type="button" class="btn btn-primary submit ftn16 hvr-shutter-out-horizontal pull-left" ><i class="fa fa-plus-circle "></i> Add</button>
</div>
</div>
<div>
<% end %>
</div>
and the helper code is as follows
module CaseHelper
def option_for_select_priority
return([['Urgent','P0'],['P1','P1'],['P2','P2'],['P3','P3'],['P4','P4']])
end
def option_for_select_assignee
list = [['','Unassigned']]
#view.members.sort_by(&:show_name).each do |member|
list << ["#{member.id}", "#{member.show_name}"]
end
return(list)
end
def option_for_select_c_type
return ([['Issue','issue'],['Change Request','C-R']])
end
end
Not sure how you're able to view the correct HTML in developer tools, because this...
select_tag 'priority', option_for_select_priority
returns...
<select id="priority" name="priority">
[["Urgent", "P0"], ["P1", "P1"], ["P2", "P2"], ["P3", "P3"], ["P4", "P4"]]
</select>
So what you really want is to wrap the method option_for_select_priority inside the options_for_select call. Like this...
select_tag 'priority', options_for_select(option_for_select_priority)
which returns...
<select id="priority" name="priority">
<option value="P0">Urgent</option>
<option value="P1">P1</option>
<option value="P2">P2</option>
<option value="P3">P3</option>
<option value="P4">P4</option>
</select>
I'm building a Real Estate app where users can add amenities like bathrooms, garage, kitchen, etc etc.
The thing is, I want that if the user introduces a number, say 1 bathroom and 1 kitchen and if he leaves in blank the other amenities, it will only display the one he filled. Im using nested attributes:
property.rb model
class Property < ApplicationRecord
belongs_to :owner
has_many :amenities
accepts_nested_attributes_for :amenities
end
amenity.rb model
class Amenity < ApplicationRecord
belongs_to :property
end
show.html.erb
<div class="section">
<div class="row">
<div class="container">
<div class="col l6">
<h5>Description</h5>
<p class="text-justify"><%= #property.description %></p>
</div>
<div class="col l6">
<h5>Amenities</h5>
<!--Nested icons-->
<% #property.amenities.each do |amenity|%>
<div class="col l2">
<div class="center-align">
<i class="material-icons-two-tone px32 no-margin-top-bottom">fitness_center</i>
<p class="no-margin-top-bottom">gym</p>
<p class="no-margin-top-bottom"><%= amenity.gym %></p>
</div>
</div>
<div class="col l2">
<div class="center-align">
<i class="material-icons-two-tone px32 no-margin-top-bottom">fitness_center</i>
<p class="no-margin-top-bottom">kitchen</p>
<p class="no-margin-top-bottom"><%= amenity.kitchen %></p>
</div>
</div>
<% end %>
</div>
</div>
</div>
Property web form
<%= form_with(model: property, local: true) do |form| %>
<% if property.errors.any? %>
<div id="error_explanation">
<h2><%= pluralize(property.errors.count, "error") %> prohibited this property from being saved:</h2>
<ul>
<% property.errors.full_messages.each do |message| %>
<li><%= message %></li>
<% end %>
</ul>
</div>
<% end %>
<div class="section">
<div class="row">
<div class="container">
<div class="col l9">
<div class="col l5">
<div class="input-field">
<i class="material-icons-two-tone prefix">edit</i>
<label for="icon_prefix"><%= form.label :name %></label><br />
<%= form.text_field :name, class:"form-control" %>
</div>
</div>
<div class="col l6">
<div class="input-field">
<i class="material-icons-two-tone prefix">edit</i>
<label for="icon_prefix"><%= form.label :description %></label><br />
<%= form.text_area :description, class:"form-control materialize-textarea" %>
</div>
</div>
<div class="col l2">
<div class="input-field">
<i class="material-icons-two-tone"></i>
<label for="icon_prefix"><%= form.label :price %></label>
<%= form.number_field :price, class:"form-control" %>
</div>
</div>
</div>
<div class="col l12">
<div class="section">
<h5>Amenidades</h5>
<%= form.fields_for :amenities do |amenities_form| %>
<div class="col l2">
<div class="input-field">
<i class="material-icons-two-tone prefix">fitness_center</i>
<label for="icon_prefix"><%= amenities_form.label :gym %></label><br>
<%= amenities_form.number_field :gym %>
</div>
</div>
<div class="col l2">
<div class="input-field">
<i class="material-icons-two-tone prefix">kitchen</i>
<label for="icon_prefix"><%= amenities_form.label :kitchen %></label><br>
<%= amenities_form.number_field :kitchen %>
</div>
</div>
<div class="col l2">
<div class="input-field">
<i class="material-icons-two-tone prefix">garage</i>
<label for="icon_prefix"><%= amenities_form.label :garage %></label><br>
<%= amenities_form.number_field :garage %>
</div>
</div>
<% end %>
</div>
</div>
</div>
</div>
</div>
<div class="section">
<div class="actions center-align">
<%= form.submit class:"waves-effect waves-light btn" %>
</div>
</div>
<% end %>
As you can see I have to duplicate the icons but the problem is that if the user leaves blank the number will not show but the icon will, so I just want to display the icon and the amenity number dynamically.
I will appreciate your help!! :D
In your show.html.erb you can add conditions - I have added for amenity.gym
<div class="section">
<div class="row">
<div class="container">
<div class="col l6">
<h5>Description</h5>
<p class="text-justify"><%= #property.description %></p>
</div>
<div class="col l6">
<h5>Amenities</h5>
<!--Nested icons-->
<% #property.amenities.each do |amenity|%>
<% if amenity.gym.present? %> ----> From Here
<div class="col l2">
<div class="center-align">
<i class="material-icons-two-tone px32 no-margin-top-bottom">fitness_center</i>
<p class="no-margin-top-bottom">gym</p>
<p class="no-margin-top-bottom"><%= amenity.gym %></p>
</div>
</div>
<% end %> -- Till Here
<div class="col l2">
<div class="center-align">
<i class="material-icons-two-tone px32 no-margin-top-bottom">fitness_center</i>
<p class="no-margin-top-bottom">kitchen</p>
<p class="no-margin-top-bottom"><%= amenity.kitchen %></p>
</div>
</div>
<% end %>
</div>
</div>
</div>
I've got a form with nested attributes fields, made with form_with model:
<%= form_with model: [ :admin, #event ], local: true, class: "event-form" do |form| %>
<%= form.hidden_field :event_category_id %>
<div class="row">
<div class='col-xs-12 col-sm-7'>
<ul class="nav nav-tabs" role="tablist">
<li role="presentation" class="active">
Wersja Polska
</li>
<li role="presentation">Wersja Angielska</li>
</ul>
<div class="tab-content">
<div role="tabpanel" class="tab-pane panel panel-default fade in active" id="<%= dom_id #event %>-pl-tab">
<div class='panel-body'>
<div class='checkbox'>
<label>
<%= form.check_box :pl_active, class: 'panel-activator' %>
Aktywna
</label>
</div>
...
and in that form i'm using fields_for nested attributes:
<div class='panel panel-default'>
<div class='panel-heading'>
<div class='row'>
<div class='col-xs-6'>
<%= form.label :event_variants %>
</div>
<div class='col-xs-6 text-right'>
<%=link_to 'Dodaj', new_admin_event_variant_path( event_id: #event, index: #event.event_variants.size ), id: "add-event-variant", class: 'btn btn-sm btn-primary', remote: true %>
</div>
</div>
</div>
<div class='panel-body event-variants sortable'>
<%- #event.event_variants.each_with_index do |event_variant, index| %>
<%= render partial: 'admin/event_variants/form', locals: { event_variant: event_variant, index: index } %>
<% end %>
</div>
</div>
and a partial looks like:
<div id="event_variant-<%= index %>" class='panel panel-default'>
<%= fields_for "event[event_variants_attributes][]", event_variant, child_index: index do |fields| %>
<%= fields.hidden_field :id %>
<%= fields.hidden_field :position %>
<%= fields.hidden_field :_destroy %>
<div class='panel-heading'>
<div class='row'>
<div class='col-xs-6 variant-title'>
<%= event_variant.pl_title || 'Nowy element' %>
</div>
<div class='col-xs-6 text-right'>
<label class='btn btn-sm btn-primary'>
<%= event_variant.image&.file.present? ? 'Zmień zdjęcie' : 'Dodaj zdjęcie' %>
<%= fields.file_field :image, style: 'display:none', class: 'add-image' %>
</label>
<div class='btn btn-sm btn-danger remove-variant'>Usuń</div>
</div>
</div>
</div>
<div class='image-container' style="background-image:url('<%= event_variant.image&.file.present? ? event_variant.image.url : image_path('no-image-icon') %>')" >
</div>
<div class='panel-body'>
<ul class="nav nav-tabs" role="tablist">
<li role="presentation" class="active">
Wersja Polska
</li>
<li role="presentation">Wersja Angielska</li>
</ul>
<div class="tab-content">
<div role="tabpanel" class="tab-pane panel panel-default fade in active" id="event_variant-<%= index %>-pl-tab">
<div class='panel-body'>
<div class='checkbox'>
<label>
<%= fields.check_box :pl_active, class: 'panel-activator' %>
Aktywna
</label>
</div>
<div class="form-group">
<%= fields.label :pl_title %>
<%= fields.text_field :pl_title, class: 'form-control', disabled: !event_variant.pl_active %>
</div>
<div class="form-group">
<%= fields.label :pl_description %>
<%= fields.text_field :pl_description, class: 'form-control', disabled: !event_variant.pl_active %>
</div>
</div>
</div>
<div role="tabpanel" class="tab-pane panel panel-default fade" id="event_variant-<%= index %>-en-tab">
<div class='panel-body'>
<div class='checkbox'>
<label>
<%= fields.check_box :en_active, class: 'panel-activator' %>
Aktywna
</label>
</div>
<div class="form-group">
<%= fields.label :en_title %>
<%= fields.text_field :en_title, class: 'form-control', disabled: !event_variant.en_active %>
</div>
<div class="form-group">
<%= fields.label :en_subtitle %>
<%= fields.text_field :en_description, class: 'form-control', disabled: !event_variant.en_active %>
</div>
</div>
</div>
</div>
</div>
<% end %>
</div>
thats attributes are has_many related with main model, so beside fields to edit each of nested model, I can click to render new fields_for partial to create nem nested record - common thing I guess:
<%=link_to 'Dodaj', new_admin_event_variant_path( event_id: #event, index: #event.event_variants.size ), id: "add-event-variant", class: 'btn btn-sm btn-primary', remote: true %>
going to:
def new
#event = Event.find params[:event_id]
#event_variant = #event.event_variants.build( pl_active: false, en_active: false )
#index = params[:index]
end
and rendering js.erb:
$('.event-variants').append("<%= j render( partial: 'form', locals: { event_variant: #event_variant, index: #index } ) %>")
the problem starts when i'm trying to edit main record. When I'm only changing values of fields, adding images, etc. no matter if in main or nested fields its working ok, sending PATCH, updating record and nested ones.
BUT:
when I'm trying to add new nested record, by those fields rendered via js.erb, form is send with POST instead of PATCH to route: /events/:id and of course its generating RoutingError:
Invalid or incomplete POST params
Started POST "/admin/events/14" for 127.0.0.1 at 2019-09-16 11:19:11 +0200
ActionController::RoutingError (No route matches [POST] "/admin/events/14"):
form attributes are not changing. HTML still looks like:
<div class="panel-body">
<form class="event-form" enctype="multipart/form-data" action="/admin/events/14" accept-charset="UTF-8" method="post">
<input name="utf8" type="hidden" value="✓">
<input type="hidden" name="_method" value="patch">
<input type="hidden" name="authenticity_token" value="Z3Uhd6EgZ+N16P5MKbqLDs3F1d94iEokD4O5q63V04q/ofFblB5sRCmEO2m+coHayDrQ/zDNVHSzfSzmDGrxog==">
<input type="hidden" value="2" name="event[event_category_id]">
<div class="row">
<div class="col-xs-12 col-sm-7">
<ul class="nav nav-tabs" role="tablist">
<li role="presentation" class="active">
Wersja Polska
</li>
<li role="presentation">Wersja Angielska</li>
</ul>
<div class="tab-content">
<div role="tabpanel" class="tab-pane panel panel-default fade in active" id="event_14-pl-tab">
<div class="panel-body">
<div class="checkbox">
<label>
<input name="event[pl_active]" type="hidden" value="0">
<input class="panel-activator" type="checkbox" value="1" checked="checked" name="event[pl_active]">
Aktywna
</label>
...
even with _method field set to PATCH
even if I manualy set a method in form_with by method: #event.persisted? ? :patch : :post
Everything works correctly when no new nested record.
And last but not least, I'm not changing anything via js onSubmit nor onClick when submitting.
Any ideas what could went wrong here?
I got this problem when a form field wasn't valid.
name="blah[]" # this isn't valid
See ActionController::BadRequest (Invalid request parameters: expected Array (got Rack::QueryParser::Params) on ajax post
Putting a pry in this file helped me out
/2.7.4/lib/ruby/gems/2.7.0/gems/rack-2.2.3.1/lib/rack/method_override.rb
def method_override_param(req)
binding.pry
req.POST[METHOD_OVERRIDE_PARAM_KEY]
I am new to ruby on rails, I have been recommended to using a sidebar so that on most pages it will show what I want. I currently have an application on its own page called Todo List. It simply let you create a task and displays the tasks. It runs on its own page. Now I want to move that app and let it function in my sidebar. I have implemented my sidebar as follow.
/views/layouts/application (in body)
<%= yield :sidebar %>
/views/myapp1/index
<% content_for(:sidebar) do %>
<% render :partial => "layouts/sidebar" %>
<% end %>
/views/layouts/_sidebar
<% if logged_in? %>
<div id="mySidenav" class="sidenav">
<div class="row", id="container_todo_lists">
<%= render #todo_lists %>
</div>
<div class="links" data-toggle="modal" data-target="#mynewtodo_list">
<%= link_to('New Todo List', 'javascript:;', :id => :random) %>
</div>
×
</div>
<span style="font-size:30px;cursor:pointer" onclick="openNav()">☰ Todo List</span>
<script>
function openNav() {document.getElementById("mySidenav").style.width = "250px";}
function closeNav() {document.getElementById("mySidenav").style.width = "0";}
</script>
<% end %>
<!-- Modal create action -->
<%= form_for(#todo_list, remote: true) do |f| %>
<div class="modal fade" id="mynewtodo_list" 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-label="Close"><span aria-hidden="true">×</span></button>
<h4 class="modal-title" id="myModalLabel">Todo</h4>
</div>
<div class="modal-body">
<div class="field">
<%= f.label :title %><br>
<%= f.text_area :title, class: "form-control todo_list_title" %>
</div>
<div class="field">
<%= f.label :description %><br>
<%= f.text_area :description, class: "form-control todo_list_content" %>
</div>
</div>
<div class="modal-footer">
<%= submit_tag "Create", class: "btn btn-primary" %>
<button type="button" class="btn btn-default" data-dismiss="modal" id="mynewtodo_listclose">Close</button>
</div>
</div>
</div>
</div>
<% end %>
<!-- Modal -->
I get this error
'nil' is not an ActiveModel-compatible object. It must implement :to_partial_path.
I think I know part of the problem is my
#todo_lists
Because I tried to called the sidebar on my todo_list page and it works, but the sidebar messed up my original application so that when I press edit and show it would turn the screen grey. Any suggestion is greatly appreciated. Thanks in advance.
/views/todo_lists/_todo_list.html.erb
<div class="text-center" id="todo_list_<%= todo_list.id %>">
<h3 class="panel-title"><%= todo_list.title %>
<sup style="color: #3BB2D6; position: absolute; top: 5px; right: 15px; text-align:right;">
(<%= time_ago_in_words(todo_list.created_at) %>)
</sup>
</h3>
<p><%= todo_list.description %></p>
<div class="row" role="group">
<div class="links1" data-toggle="modal" data-target="#myupdatetodo_list_<%= todo_list.id %>">
<%= link_to('Edit', 'javascript:;', :id => :random) %>
</div>
<div class="links1" data-toggle="modal" data-target="#myitemtodo_list_<%= todo_list.id %>">
<%= link_to('Show', 'javascript:;', :id => :random) %>
</div>
<div class="links1">
<%= link_to 'Destroy', todo_list, method: :delete, remote: true %>
</div>
</div>
<!-- Modal - update posts -->
<%= form_for(todo_list, :method => :put, remote: true) do |f| %>
<div class="modal fade" id="myupdatetodo_list_<%= todo_list.id %>" 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-label="Close"><span aria-hidden="true">×</span></button>
<h4 class="modal-title" id="myModalLabel">Edit</h4>
</div>
<div class="modal-body">
<div class="field">
<%= f.label :title %><br>
<%= f.text_area :title, class: "form-control" %>
</div>
<div class="field">
<%= f.label :description %><br>
<%= f.text_area :description, class: "form-control" %>
</div>
</div>
<div class="modal-footer">
<button type="button" id="myupdatebutton_<%= todo_list.id %>" class="btn btn-default" data-dismiss="modal">Close</button>
<%= submit_tag "Update", class: "btn btn-primary" %>
</div>
</div>
</div>
</div>
<% end %>
<!-- Modal -->
<!-- Modal - item posts -->
<%= form_for(todo_list, :method => :put, remote: true) do |f| %>
<div class="modal fade" id="myitemtodo_list_<%= todo_list.id %>" 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-label="Close"><span aria-hidden="true">×</span></button>
<h4 class="modal-title" id="myModalLabel">Items</h4>
</div>
<div class="modal-body">
<h3><%= todo_list.title %></h3>
<p><%= todo_list.description %></p>
</div>
<div class="modal-footer">
<button type="button" id="myitembutton_<%= todo_list.id %>" class="btn btn-default" data-dismiss="modal">Close</button>
<%= submit_tag "Add Item", class: "btn btn-primary" %>
</div>
</div>
</div>
</div>
<% end %>
<!-- Modal -->
In your case, that is because the #todo_lists isn't being set, I'm sure if you go back to the previous url that was rendering the view, the sidebar would show.
A way to resolve is to ensure it's set on every page as such:
class ApplicationController
before_action :set_to_do_lists
def set_to_do_lists
#todo_lists ||= TodoList.all #assign this to what's in your todo_lists_path
end
end
With that I guess your app should be fixed
Within my rails form: I am using form-horizontal. I can't seem to figure out how to line my submit button up within my form.
The submit button does line up when accessing the form from a mobile devise:
But the submit button is not aligned when accessing the form from a tablet/computer:
Here is my code for the form:
Search Providers
<%= form_tag providers_index_search_results_path, {class: 'form-horizontal'} do |f| %>
<div class="form-group">
<%= label_tag :title, nil, class: "control-label col-sm-2" %>
<div class="col-sm-5">
<%= text_field_tag :title, nil, class: "form-control col-sm-5" %>
</div>
</div>
<div class="form-group">
<%= label_tag :name, nil, class: "control-label col-sm-2" %>
<div class="col-sm-5">
<%= text_field_tag :name, nil, class: "form-control col-sm-5" %>
</div>
<div class="col-sm-5"></div>
</div>
<%= button_tag('Submit', class: "btn btn-primary") %>
<% end %>
How can I make it so that the submit button lines up?
You have to put your button inside of a div.form-group, and subsequently in the grid.
Here is the example from the bootstrap docs:
<form class="form-horizontal">
<div class="form-group">
<label for="inputEmail3" class="col-sm-2 control-label">Email</label>
<div class="col-sm-10">
<input type="email" class="form-control" id="inputEmail3" placeholder="Email">
</div>
</div>
<div class="form-group">
<label for="inputPassword3" class="col-sm-2 control-label">Password</label>
<div class="col-sm-10">
<input type="password" class="form-control" id="inputPassword3" placeholder="Password">
</div>
</div>
<div class="form-group">
<div class="col-sm-offset-2 col-sm-10">
<div class="checkbox">
<label>
<input type="checkbox"> Remember me
</label>
</div>
</div>
</div>
<div class="form-group">
<div class="col-sm-offset-2 col-sm-10">
<button type="submit" class="btn btn-default">Sign in</button>
</div>
</div>
</form>
Always check the docs first: http://getbootstrap.com/css/#forms-horizontal