How to automatically validate coupon and adjust price? - javascript

I'm trying to add a coupon to my checkout page, using an AJAX request that validates the coupon and updates the price accordingly. However, on loading the checkout view I get the error message:
First argument in form cannot contain nil or be empty
referring to the line <%= form_for #actioncode, method: :post ... in the form where the coupon is entered. I've tried to follow the steps here. How should I adjust my code?
The set up: #actioncode refers to a model where the admin stores actioncodes. Coupon_code is not included in any model but refers to the value that a user enters in the form. Coupon_code should be checked against the Actioncode model (specifically the 'actioncode' column) if the value exists (validation) and if so update the price based on the value in the Actioncode model in the colum 'discount'.
The checkout view contains the following form:
<%= form_for #actioncode, method: :post, url: {action: "check_actioncode"}, remote: true do |f| %>
<%= f.text_field :coupon_code, :placeholder => "Enter your coupon" %>
<%= f.submit "Submit Coupon Code" %>
<% end %>
Routes:
post 'check_actioncode' => 'actioncodes#check_actioncode'
In the actioncodes controller I have:
def check_actioncode
#actioncode = Actioncode.find(params[:coupon_code])
respond_to do |format|
if !#actioncode.nil?
format.js {}
else
flash.now[:success] = "Action code not found or expired"
end
end
end
The organizations controller renders the checkout view:
def checkout
#organization = Organization.new(organizationnew_params)
if #organization.save
#organization.members.each do |single_member|
single_member.send_activation_email
end
#actioncode = Actioncode.new
#amount = 100.00
#currency = "EUR"
#description = #organization.id
#transaction_description = "My description"
#transaction_type = "S"
#hash = hash(#description, #amount, #currency, #transaction_type)
render 'checkout' # This renders the checkout view.
else
render 'new_premium'
end
end
Update: If I add #actioncode = Actioncode.new to the controller that loads the view, I get another error message undefined method 'coupon_code' referring to the 2nd line of the form. coupon_code is indeed a variable nowhere defined but it should simply be a temporary value that the user has entered and that is checked against the actioncode in the model for validation. How should I do this?

Change your form to:
<%= form_for #actioncode, method: :post, url: {action: "check_actioncode", :controller => 'actioncodes'}, remote: true do |f| %>
<%= f.text_field :actioncode, :placeholder => "Enter your coupon" %>
Change your controller to:
def check_actioncode
#actioncode = Actioncode.where(:actioncode => params[:actioncode][:actioncode]).first
respond_to do |format|
unless #actioncode.blank?
format.js {}
else
flash.now[:success] = "Action code not found or expired"
end
end
end

Related

Rails Ajax Jquery

I'm working on an dynamic edit of an article using rails. On each articles can be added paragraphs. I wanted to use Ajax with Jquery following the 136-jquery-ajax-revised tutorial from railscast. I created the template for the form and the new.js.erb response but I keep geting same error:
ParagraphsController#new is missing a template for this request format and variant. request.formats: ["text/html"] request.variant: []
This is the link that request the new form from view/article/show
<%= link_to 'New Paragraph', new_article_paragraph_path(#article), remote: true, class: 'uk-button uk-button-primary' %>
view/paragraph/_form
<div class="article-form-container">
<%= form_with scope: :paragraph, url: article_paragraphs, remote: true do |f| %>
<%= f.text_field :title, class: 'uk-input', placeholder: 'Title of paragraph (optional, can be a subtitle of the article)' %>
<%= f.text_area :text, class: 'uk-textarea', placeholder: 'Content of paragraph' %>
<%= f.hidden_field :position, :value => 3 %>
<div class="submit-button">
<%= f.submit class: 'uk-button uk-button-primary' %>
</div>
<% end %>
</div>
routes
resources :articles, only: %i[show update destroy create]
resources :articles do
resources :paragraphs, only: %i[new create update destroy]
end
view/paragraphs/new.js.erb
$('div#article-control-panel').hide("fast", function () {
$('div#article-control-panel').after('<%= j render 'form' %>')
})
controllers/paragraphs_controller
class ParagraphsController < ApplicationController
def new
#paragraph = Paragraph.new
end
def create
#paragraph = Paragraph.new(paragraph_params)
#article = Article.find(params[:article_id])
if #article.user == current_user
#paragraph.article = #article
#paragraph.save
end
respond_to do |format|
format.html { redirect_to #article }
format.js
end
end
def paragraph_params
params.require(:paragraph).permit(:title, :text, :position)
end
end
Can't figure out what the problem is. The error happens in the article page, after I press the link button.
Edit
Strange thing is that if i try to change the url of orm in something like article_path it will work...
Your controller is missing a respond_to. Your new function should look like this:
def new
#paragraph = Paragraph.new
respond_to { |format| format.js }
end
This respond_to allows rails to call the relevant .js.erb file, in this instance your new.js.erb file.
Just keep in mind that when you want to perform an ajax call, you require these few elements:
A respond_to { |format| format.js } in your controller action
Your js.erb file needs to be the same name as your controller action (foo.js.erb)
A partial to render through your js.erb file, typically named the same as your js file. (_foo.js.erb)
If it is a link, you need remote: true. If it is a form and you're using rails 5, you could use form_with or simply include remote: true too.

Rails | show url parameters on show page after create

I added the URL parameters to the new.html.erb page by a link_to
<%= link_to 'Message', new_personal_message_path(receiver_id: 1010) %>
which correctly to displayed in the URL as
example.com/personal_messages/new?receiver_id=1010
and i was able to than reference it in my controller by simple #receiver = User.find_by(id: params[:receiver_id])
On the new.html.erb i have this form to create a new conversation:
<%= form_for #personal_message do |f| %>
<%= hidden_field_tag 'receiver_id', #receiver.id %>
<%= f.text_area :body, class: "personal_message_textarea", placeholder: "Chat with us...", :autofocus => true %>
<%= hidden_field_tag :conversation_id, params[:id] || session[:conversation_id] %>
<%= f.submit " ", placeholder: "Chat with us!", class: "personal_message_submit" %>
<% end %>
And it'll automatically redirect the user to the show page which the url displays as
example.com/conversations/1
But I also want it to also show the newly created user_id (I have a method in my controllers that automatically creates a user account on create) in the URL parameters like so:
example.com/conversatinos/1?user_id=23&receiver_id=1010
the new method in personal_messages controller
def new
redirect_to conversation_path(#conversation) and return if #conversation
#personal_message = PersonalMessage.new
#site = Site.find_by(id: cookies[:siteid]) #used to pull site description
end
create method in personal_messages controller
def create
#conversation ||= Conversation.create(author_id: cookies[:user_id],
receiver_id: #receiver.id)
#personal_message = current_user.personal_messages.build(personal_message_params)
#personal_message.conversation_id = #conversation.id
#personal_message.save!
flash[:success] = "ok!"
redirect_to conversation_path(#conversation)
end
fixed: personal_messages controllers
def create
#conversation ||= Conversation.create(author_id: cookies[:user_id],
receiver_id: #receiver.id)
#personal_message = current_user.personal_messages.build(personal_message_params)
#personal_message.conversation_id = #conversation.id
#personal_message.save!
flash[:success] = "ok!"
#redirect_to conversation_path(#conversation)
redirect_to conversation_path(#conversation, user_id: current_user.id, receiver_id: #receiver)
end

Rails refresh 'show' partial when :update action executes

I have OrdersController show action (with order_info partial), which displays current status of the order ("paid", "canceled", etc.).
meanwhile, I have callback action order_callback, which executes update action and changes status of the order in the database when it receives the callback from a payment processor.
What I want to achieve is to update show action in real-time to capture changes in order status (e.g. order paid successfully).
I tried to use unobtrusive javascript, but did not succeed.
update.js.erb
$("#order").html("<%= escape_javascript(render 'order_info') %>")
show.html.erb
<div id="order">
<%= render 'order_info' %>
</div>
orders_controller.rb
def update
if #order.update_attributes(order_params)
flash[:success] = "Order updated."
redirect_to #order
else
render 'edit'
end
end
api/orders_controller.rb
def order_callback
signature = request.headers['X-Signature']
request_uri = URI(env['REQUEST_URI']).request_uri rescue env['REQUEST_URI']
if $processor.callback_valid?(signature, request_uri)
#order = Order.find(params["id"])
#order.update_attributes(status: params["status"])
render status: :ok,
json: { success: true,
info: "Successfully updated order." }
else
render status: :unprocessable_entity,
json: { success: false }
end
end
I am using rails 4.2.2 with turbolinks enabled.
I was able to resolve it with javascript polling. The critical line was to explicitly say which .js partial to render in respond_to block
show.js.erb
$("#order").html("<%= j render 'orders/order_info', locals: {order: #order} %>");
OrderPoller.poll();
orders_controller.rb
def show
#order = Order.find(params[:id])
respond_to do |format|
format.js { render "orders/show.js.erb" }
format.html
end
end
orders.coffee
#OrderPoller =
poll: ->
setInterval #request, 5000
request: ->
$.get($('#order').data('url'))
jQuery ->
if $('#order').length > 0
OrderPoller.poll()
show.html.erb
<%= content_tag :div, id: "order", data: { url: order_path(#order) } do %>
<%= render 'order_info' %>
<% end %>

Ruby on Rails file uploading using a form with remote: true

I am trying to upload files using a Rails form where the remote is set to true. I'm using Rails 4.1.1. Let's say that my model is a Message, and it is using JavaScript so that the user could easily send multiple messages without reloading the page. The form is set like this:
<%= form_for #message, url: {action: "create"}, html: {:class => "message-form", multipart: true}, remote: true do |f| %>
The user can upload images with the Message, if they wish to do so. MessageImage acts as a nested attribute in the form, and is declared like this (http://railscasts.com/episodes/196-nested-model-form-revised way):
<%= f.fields_for :message_images do |builder| %>
<%= render 'message_image_fields', f: builder %>
<%= link_to_add_fields "Add an image", f, :message_images %>
<% end %>
On my controller the action is roughly like this:
if #message.save
flash.now[:success] = "Message sent"
else
flash.now[:alert] = "Error sending the message"
end
respond_to do |format|
format.html { render 'new' }
format.js { render 'new' }
end
Now, this works perfectly as long as the user doesn't send any images, but if they do, it uses format.html instead of format.js. Removing the format.html gives ActionController::UnknownFormat-exception.
Now, this obviously has to do with the fact that you can't submit files with remote set to true. I tried searching a bit, and found this gem https://github.com/JangoSteve/remotipart , which seems to be exactly what I'm looking for. I installed it following the instructions, but for some reason it still doesn't work and gives ActionController::UnknownFormat-exception if I remove the format.html. However, I couldn't find any example of it involving nested attributes. Are there any alternatives for this gem or any other way to fix this, or should I just set that it renders HTML if the user submits files?
JQuery
I don't know how to get the nested model aspect of this, but we've done file uploading with JQuery / asynchronicity before here (register for account, log into profile):
We used the jquery-file-upload gem - basically allowing you to pass the files through Ajax to your controller backend. To give you a clear idea of how we did this:
--
Code
#app/assets/javascripts/application.js
$('#avatar').fileupload({
url: '/profile/' + $(this).attr('data_id'),
dataType: 'json',
type: 'post',
add: function (e, data) {
$(this).avatar_loading('avatar_loading');
data.submit();
},
success: function (data, status) {;
$("#avatar_img").fadeOut('fast', function() {
$(this).attr("src", data.avatar_url).fadeIn('fast', function(){
$(this).avatar_loading('avatar_loading');
});
});
}
});
#app/views/users/index.html.erb
<%= form_for :upload, :html => {:multipart => true, :id => "avatar"}, :method => :put, url: profile_path(current_user.id), "data_id" => current_user.id do |f| %>
<div class="btn btn-success fileinput-button avatar" id="avatar_container">
<%= f.file_field :avatar, :title => "Upload New" %>
<%= image_tag(#user.profile.avatar.url, :width=> '100%', :id => "avatar_img", :alt => name?(#user)) %>
</div>
<% end %>
#app/controllers/profile_controller.rb
Class ProfileController < ApplicationController
def update
def update
#profile = User.find(current_user.id)
#profile.profile.update(upload_params)
respond_to do |format|
format.html { render :nothing => true }
format.js { render :partial => 'profiles/update.js' }
format.json {
render :json => #profile.profile.as_json(:only => [:id, :avatar], :methods => [:avatar_url])
}
end
def upload_params
params.require(:upload).permit(:avatar, :public, :description)
end
end
end
--
Implementation
For your implementation, I would recommend firstly creating the message, and then getting the user to append some images to it in another action
After you've got that working, you could get it to work as one form

Rendering Error Messages in Rails Form with Javascript

I've got a form that should render error messages but I'm not sure how to render the error messages since my form is being displayed with Javascript after clicking a button. I'm using Devise for the registration which is working just not displaying the error messages. I'm using Rails 4.
This is the code that hides the register button after it's clicked and shows the form:
<script type="text/javascript">
$(function() {
$('#prelaunchbutton').click(function() {
$('#prelaunchregistrationbutton').fadeToggle('slow');
$('.prelaunchhide').fadeToggle('slow');
return false;
});
});
</script>
Here is the Devise registration form (Shortened for brevity):
<div class="prelaunch_preregisterbutton" id="prelaunchregistrationbutton">
<%= link_to image_tag("pre-register.png", :border=>0), '#', id:'prelaunchbutton' %>
</div>
<div class="span10 offset1 prelaunchhide">
<%= form_for(resource, :as => resource_name, :url => registration_path(resource_name), :class => "form-inline") do |f| %>
...
<% end %>
</div>
Here is the Devise registration controller:
class RegistrationsController < Devise::RegistrationsController
before_filter :authenticate_user!
respond_to :html, :json
def new
end
def create
#user = User.new(user_params)
#user.build_store(store_params)
if #user.save
UserMailer.preregister_confirmation(#user).deliver
sign_in #user
redirect_to prelaunch_gear_path, :flash => {:success => "Welcome"}
else
render root_path
end
end
...
protected
def after_update_path_for(resource)
user_path(resource)
end
private
def user_params
params.require(:user).permit(:firstname, :lastname, :email, :password)
end
def store_params
params.require(:store).permit(:storename)
end
end
You might look into using toastr for displaying javascript notifications.
Here's an SO question I answered before that may help set it up: Rails 4 - Toaster notifications rather than flash notifications -- you would just need to make your flash notification be flash.now[:toastr] and then be sure to call the initializer for that in the JS returned by the AJAX request.

Categories

Resources