I'm using ruby (2.0.0), rails (3.2.17), cloudinary (1.0.70), and jquery-rails (3.1.0). I'm getting this error only when the image upload tag is nested multiple levels deep. If it's only one level deep, I'm able to upload properly. The file upload that is generated is (cloudname, signature, and api key replaced with "xxxx" for StackOverflow):
<input
type="file"
name="file"
data-url="https://api.cloudinary.com/v1_1/xxxxxxxxx/auto/upload"
data-form-data="{"timestamp":1399504570,"callback":"http://localhost:8080/cloudinary_cors.html","signature":"xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx","api_key":"xxxxxxxxxxxxxxx"}"
data-cloudinary-field="page[figures_attributes][1399504574259][images_attributes][0][asset]"
class="cloudinary-fileupload
">
Which, from what I have read seems to be correct, however I am still getting {"error":{"message":"Invalid cloud_name undefined"}} when I try a direct upload.
EDIT:
The URL that it hits when attempting to upload is https://api.cloudinary.com/v1_1/undefined/upload. This makes me wonder why the URL from the data-url attribute in the input is not being used and how this URL is generated.
I'm generating the file upload tag like this:
= f.cl_image_upload :asset
My application.js looks like this:
// WARNING: THE FIRST BLANK LINE MARKS THE END OF WHAT'S TO BE PROCESSED, ANY BLANK LINE SHOULD
// GO AFTER THE REQUIRES BELOW.
//
//= require jquery
//= require jquery_ujs
//= require ckeditor/init
//= require cloudinary
//= require_tree ../../../vendor/assets/javascripts/.
//= require_tree .
Please let me know if you need any other information. Thanks!
The problem was that I wasn't including the cloudinary_js_config script anywhere. So I just added it to the top of the form like so:
= form_for #page, :html => { :multipart => true } do |f|
= cloudinary_js_config
Related
In a Rails 4.1 app, I have a collection select that is loaded from a hash. I would like to use the select2 boostrap styling, but it doesn't seem to be working.
I have included the select2-rails gem, and updated application.js and application.css as per the instructions.
gem 'select2-rails'
//= require select2
*= require select2
*= require select2-bootstrap
The collection_select is loaded from a constant on the model. I don't think this is especially relevant to the issue, but added it here in case it helps someone.
FLASHCARD_TYPE = {"verb" => "Verb Conjugation",
"name" => "Word",
"number" => "Number",
"quiz" => "Quiz"}
Rails view
<div class="form-group">
<%= f.label :card_type, :class => "col-sm-2 control-label" %>
<div class="col-sm-2">
<%= f.collection_select(:card_type, Flashcard::FLASHCARD_TYPE, :first, :last) %>
</div>
</div>
app/assets/javascripts/application.js
$(document).ready(function(){
$("#flashcard_card_type").select2();
});
The rendered html shows the select2 javascript, and the select shows as:
<div class="form-group">
<label class="col-sm-2 control-label" for="flashcard_card_type">Card type</label>
<div class="col-sm-2">
<select id="flashcard_card_type" name="flashcard[card_type]">
<option value="verb">Verb Conjugation</option>
<option value="name">Word</option>
<option value="number">Number</option>
<option value="quiz">Quiz</option></select>
</div>
</div>
How can this to work properly?
In fact I would also like the option to have a site-wide default for all selects via class, then the ability to override styling by individual id.
I thought this would work as site-wide for all selects, but it also does nothing.
$(document).ready(function(){
$("select").select2();
});
EDIT
As recommended by #San I checked the Javascript console, and got
Uncaught TypeError: undefined is not a function
This the code it failed on
$(document).ready(function(){
$("#flashcard_card_type").select2();
});
EDIT 2
Full application.js file
//= require jquery
//= require jquery_ujs
//= require bootstrap-sprockets
//= require bootstrap-markdown
//= require select2
//= require_tree .
$(document).ready(function(){
$("#flashcard_card_type").select2();
});
EDIT 3
jQuery is finding the element OK
$(document).ready(function(){
debugger;
console.log($("#flashcard_card_type"))
$("#flashcard_card_type").select2();
});
log
[select#flashcard_card_type, context: document, selector: "#flashcard_card_type", jquery: "1.11.1", constructor: function, toArray: function…]
0: select#flashcard_card_type
context: document
length: 1
selector: "#flashcard_card_type"
__proto__: Object[0]
EDIT - What I have tried
removed turbolinks
added the javascript to the page
deleted cache, restarted rails
What I have found
jQuery can find the tag
The select2 library is loaded via the network tab in the js debugger
Any ideas?
Just wondering. Did you run bundle install after adding the gem to the Gemfile?
If you did, the last thing to check is to make sure select2 JavaScript file is loading before your block to use it. Verify that by doing view source on the page and make sure select2.js is listed before application.js file (assuming you are in dev mode).
When I try to upload a file directly to Cloudinary nothing happens. The file name in the selected file field is deleted and no file is added to my Cloudinary accounts' Media Library.
This is my index.html.erb file
<%= cloudinary_js_config %>
<%= form_tag(cardset_cards_path(#cardset, #card), :method => :post) do %>
<%= cl_image_upload_tag(:image_id) %>
<%= submit_tag 'Submit' %>
<% end %>
My application.js file
// WARNING: THE FIRST BLANK LINE MARKS THE END OF WHAT'S TO BE PROCESSED, ANY BLANK LINE SHOULD
// GO AFTER THE REQUIRES BELOW.
//
//= require jquery
//= require jquery_ujs
//= require_tree .
//= require cloudinary
I do have the downloaded cloudinary.yml file with api_key and api_secret...
I'm using Rails 4, I haven't set my config.assets.enabled = false, so I belive I am using Asset Pipeline by default.
I believe I'm following the example in Cloudinary, but my Cloudinary Account Media Library doesn't show any file uploaded. I've tried adding :html => {:multipart => true}, but the same things happens nothing. I've tried different things in the controller to get the returned id, but since nothing is happening, I think I'd just be happy to get a file into my Cloudinary Media Library.
-hoping to rise from the dirt to the Clouds
This question is unlikely to help any future visitors; it is only relevant to a small geographic area, a specific moment in time, or an extraordinarily narrow situation that is not generally applicable to the worldwide audience of the internet. For help making this question more broadly applicable, visit the help center.
Closed 9 years ago.
Ok, I'm baffled. I am trying to set up a rails/backbons SPA. I am following along with this railscast: http://railscasts.com/episodes/323-backbone-on-rails-part-1?autoplay=true
I get this error from the browser when trying to access the root page:
ExecJS::RuntimeError in Main#index
Showing /Users/Eamon/raffle/raffler/app/views/layouts/application.html.erb where line #6 raised:
SyntaxError: unexpected }
(in /Users/Eamon/raffle/raffler/app/assets/javascripts/backbone/models/entry.js.coffee)
Extracted source (around line #6):
3: <head>
4: <title>Raffler</title>
5: <%= stylesheet_link_tag "application", :media => "all" %>
6: <%= javascript_include_tag "application" %>
7: <%= csrf_meta_tags %>
8: </head>
9: <body>
Here is my code - I only got a few minutes into the video.
raffler.js.coffee
#= require_self
#= require_tree ./templates
#= require_tree ./models
#= require_tree ./views
#= require_tree ./routers
window.Raffler =
Models: {}
Collections: {}
Routers: {}
Views: {}
init: ->
new Raffle.Routers.Entries()
Backbone.history.start()
$(document).ready ->
Raffler.init()
entries_router.js.coffee
class Raffler.Routers.EntriesRouter extends Backbone.Router
initialize: (options) ->
#entries = new Raffler.Collections.EntriesCollection()
#entries.reset options.entries
routes:
"new" : "newEntry"
'' : 'index'
":id/edit" : "edit"
":id" : "show"
newEntry: ->
#view = new Raffler.Views.Entries.NewView(collection: #entries)
$("#entries").html(#view.render().el)
index: ->
alert "home page"
show: (id) ->
entry = #entries.get(id)
#view = new Raffler.Views.Entries.ShowView(model: entry)
$("#entries").html(#view.render().el)
edit: (id) ->
entry = #entries.get(id)
#view = new Raffler.Views.Entries.EditView(model: entry)
$("#entries").html(#view.render().el)
I know most of the above code is irrelevant at this point in the cast...it was all created by the scaffold generator - I figured I didn't have to delete anything.
entry.js.coffee
class Raffler.Models.Entry extends Backbone.Model
paramRoot: 'entry'
defaults:
class Raffler.Collections.EntriesCollection extends Backbone.Collection
model: Raffler.Models.Entry
url: '/entries'
The above file is where I think the error is occurring. I just can't seem to find a syntax error anywhere. I noticed in the code that goes with the railscast on the cast page, that entry.js.coffee just has
class Raffler.Models.Entry extends Backbone.Model
I tried deleting everything but that line for the entry.js.coffee file - when I go to the root page...it just says "Loading...," which is just a reflection of the code used as a placeholder for before the app initializes.
Maybe a fresh pair of eyes...
UPDATE
I found someone with a similar issue here:
rails: backbone-on-rails gem-
After seeing this and a few other related posts...I tried deleting the //=require_tree . line from application.js. A few other posts say it needs to be at the bottom...but mine already was, so that isn't the problem either. Incase it is relevant, here is my application.js file:
// This is a manifest file that'll be compiled into application.js, which will include all the files
// listed below.
//
// Any JavaScript/Coffee file within this directory, lib/assets/javascripts, vendor/assets/javascripts,
// or vendor/assets/javascripts of plugins, if any, can be referenced here using a relative path.
//
// It's not advisable to add code directly here, but if you do, it'll appear at the bottom of the
// the compiled file.
//
// WARNING: THE FIRST BLANK LINE MARKS THE END OF WHAT'S TO BE PROCESSED, ANY BLANK LINE SHOULD
// GO AFTER THE REQUIRES BELOW.
//
//= require jquery
//= require jquery_ujs
//= require underscore
//= require backbone
//= require backbone_rails_sync
//= require backbone_datalink
//= require backbone/raffler
//= require_tree .
Checking your entry.js.coffee code in "Try Coffeescript" on coffeescript.org, I get the same error.
Adding {} to defaults: cleared the error and now renders correctly.
entry.js.coffee
class Raffler.Models.Entry extends Backbone.Model
paramRoot: 'entry'
defaults: {}
class Raffler.Collections.EntriesCollection extends Backbone.Collection
model: Raffler.Models.Entry
url: '/entries'
I am able to generate the charts using lazy highcharts but i want those charts to exported as images , here is my code which I am using to generate the charts
#fields= ReportHistory.all_history
#h = LazyHighCharts::HighChart.new('graph') do |f|
f.chart(:renderTo => 'container', :zoomType => 'x',:spacingRight=> 20)
f.title(:text => 'Reports')
f.xAxis(:title=>{:text => 'Days'}, :categories =>#fields.map{|x|x.Date}.last(limit=15))
f.yAxis(:title=>{:text=> 'Jobs_count', :type =>'integer' ,:max => 5000000})
f.series(:name =>'jobs_count', :data=> #fields.map{|x| x.jobs_count.to_i }.last(limit=15))
f.export(:type=> 'image/jpeg')
end
and in my view I to show the chart I have this
<%= high_chart("my_id", #h) %>
I want to have the effect like here where I can download the chart image using the export button.
First, you need to ensure that the export module is available and loaded by your view:
<%= javascript_include_tag "vendor/highcharts/highcharts.js" %>
<%= javascript_include_tag "vendor/highcharts/modules/exporting.js" %>
Second... there's nothing to do. As soon as the exporting modul is loaded, it will add the menu to export your graph.
Notes:
You may need to adapt the paths depending on your setup.
The exporting.js is part of the package you download from Highcharts.
You can add/update the following in your application.js
//= require highcharts/highcharts
//= require highcharts/highcharts-more
//= require highcharts/modules/no-data-to-display
//= require highcharts/modules/exporting
If you want also updated vendor assets of highcharts, you can run:
rake highcharts:update
What did I do wrong in this tutorial: https://github.com/grosser/simple_auto_complete
Here are my scripts by the way:
First I put this in my users_controller.rb
autocomplete_for :user, :username, :limit => 15, :order => 'created_at DESC'
In my routes.rb
namespace :profile do
resources :users, :only => [:index] do
collection do
post "search"
get "autocomplete_for_user_name"
end
end
In my application.js
//= require jquery
//= require jquery_ujs
//= require_tree .
//= require jquery.autocomplete.js
//= require jquery.js
jQuery(function($){//on document ready
//autocomplete
$('input.autocomplete').each(function(){
var input = $(this);
input.autocomplete(input.attr('data-autocomplete-url'),{
matchContains:1,//also match inside of strings when caching
// mustMatch:1,//allow only values from the list
// selectFirst:1,//select the first item on tab/enter
removeInitialValue:0//when first applying $.autocomplete
});
});
});
In my views (app/views/profile/messages/compose.html.haml)
%div#page-info
%span#title
Compose
%span#desc
Compose a new Message
= form_for :message, :url => send_message_profile_messages_path do |message|
%label{:for => "friend"} To:
%br
=message.text_field :auto_user_name , :class => 'autocomplete', 'data-autocomplete-url'=> autocomplete_for_user_name_profile_users_path
%script{:type => "text/javascript"}jQuery(function($){//on document ready $('input.autocomplete').each(function(){var $input = $(this);$input.autocomplete($input.attr('data-autocomplete-url'));});});
//= collection_select(:message, :friend_id, #friends, :id, :username)
%br
%label{:for => "message"} Body:
%br
= message.text_area :message
%br
= message.file_field :attachment
%br
= submit_tag "Send", :confirm => "Are you sure?"
I am trying to autocomplete the users using their username (s)
Note: I had also installed the gem and I think there's no problem about that.
What am i doing wrong?
In view
remove the comment //on document ready from script, as it is all in single line I think it is commenting the whole line including js code.
or use alternate formatting
:javascript
//on document ready
jQuery(function($){
$('input.autocomplete').each(function(){
var $input = $(this);
$input.autocomplete($input.attr('data-autocomplete-url'));
});
});
add //= require_self to application file for adding its own js code.
//= require jquery
//= require jquery_ujs
//= require_tree .
//= require jquery.autocomplete.js
//= require jquery.js
jQuery(function($){//on document ready
//autocomplete
$('input.autocomplete').each(function(){
var input = $(this);
input.autocomplete(input.attr('data-autocomplete-url'),{
matchContains:1,//also match inside of strings when caching
// mustMatch:1,//allow only values from the list
// selectFirst:1,//select the first item on tab/enter
removeInitialValue:0//when first applying $.autocomplete
});
});
});
Also try not to have white spaces between require.
rails warning in application.js says
// WARNING: THE FIRST BLANK LINE MARKS THE END OF WHAT'S TO BE PROCESSED, ANY BLANK LINE SHOULD
// GO AFTER THE REQUIRES BELOW.
I have been using this autocomplete it works great for me
https://github.com/crowdint/rails3-jquery-autocomplete