Ajax with Rails 3 and jQuery - Called from JS

Question

The goal is to render an edit form by calling some sort of $.ajax function in my javascript.

I am using FullCalendar to display some events so I would like to implement something that allows the user to click on an event and render our existing edit form somewhere on the page.

So this is where I'm looking to do it:

// the javascript
eventClick: function(calEvent, jsEvent, view) {
  $.ajax({
    url: '/course_offerings/'+calEvent.id+'/edit',
  });
},

eventClick is essentially a callback after you click an event :)

calEvent.id is a course_offering id So unfortunately I don't have access to the nice :remote => 'true' options for setting up links.

Here's a few snippits of code:

# controller edit function
@course_offering = CourseOffering.find(params[:id])
respond_to do |format|
  format.html
  format.js
end

# edit.js.erb, quickedit is the div where I want the form to render
$('#quickedit').append('hi');

Is this the correct way to go about this? I really want to start as simple as possible with the ajax calls, I've been reading some examples and they get pretty complex.

Also the requirements for a jquery $.ajax call in a Rails environment are pretty much a mystery to me.

Edit 1:

Sooo close

I tried the following:

$.ajax({
    dataType: 'script',
    url: "/course_offerings/1/edit"
});

And in chrome's debugger I got:

http://localhost:3000/course_offerings/1/edit?_=1302199862022 500 (Internal Server Error)

I haven't done any special header setup, so I think that might be the issue

Edit 2

ActionView::Template::Error (Missing partial course_offerings/edit with {:handlers=>[:erb, :rjs, :builder, :rhtml, :rxml], :formats=>[:js, :html], :locale=>[:en, :en]} in view paths "/home/emp/ror/smarssched/app/views", "/home/emp/.rvm/gems/ruby-1.9.2-p136/gems/devise-1.1.5/app/views"):
    1: $("#quick_edit").html(<%= escape_javascript(render :partial => 'edit', :object => @course_offering) %>)

I switched the partial to edit after getting an error with :partial => 'course_offering'

To hopefully render the edit partial.

Edit 3

ActionView::Template::Error (undefined method `formats' for nil:NilClass):
    1: $("#quick_edit").html(<%= escape_javascript(render :action => 'edit', :object => @course_offering) %>)
  app/views/course_offerings/edit.js.erb:1:in `_app_views_course_offerings_edit_js_erb__58426168_85487740_698365018'
  app/controllers/course_offerings_controller.rb:48:in `edit'

# Line 46-51 edit function
 def edit
@course_offering = CourseOffering.find(params[:id])
respond_to do |format|
     format.html
     format.js
    end
 end

If I take the respond_to block out, it throws the same error.

can you give us the error from the actual rails app? ie. what is causing the 500 — brad
– brad, Commented Apr 7, 2011 at 19:23
note my changes below, you're probably not rendering a partial, but an action. partials are files that a prefixed with _ and are only html fragments. — brad
– brad, Commented Apr 7, 2011 at 19:50
yup you were correct, after switching to a render :action the error goes away, but now we have a new one (edited question) — febs
– febs, Commented Apr 7, 2011 at 20:09

brad · Accepted Answer · 2011-04-07 19:49:33Z

1

First off, to comment on your last sentence, there aren't any such requirements for making ajax calls between jquery and Rails. They don't know about each other and they don't care. As long as your url is correct and you're sending the correct data through when appropriate all is fine. You just need to make sure that your request header is set properly. jQuery by default makes an "intelligent guess" so I find it's always useful to specify what you want. See the docs here, but in your case that means adding:

dataType: 'script'

to your ajax call

As for correct ways to do things, that looks about right and is pretty standard. In your edit.js.erb you basically want to render out your view and append it to #quickedit. Something like this should suffice:

$("#quickedit").html(<%= escape_javascript(render :partial => 'course_offering', :object => @course_offering) %>)

Note here that 'course_offering' would have to be a partial defined within the current view folder ie /app/views/course_offerings/_course_offering.html.erb assuming you're in the course_offerings controller.

In your case you're using 'edit' but I'm assuming edit isn't an partial (ie. html fragment) but rather a full action. In this case try render :action => 'edit'

edited Apr 7, 2011 at 19:49

answered Apr 7, 2011 at 17:39

brad

32.4k29 gold badges106 silver badges159 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

febs Over a year ago

I added an edit to the question with some more stuff. Thank you for the response. I think i need to setup the request header you mentioned.

Collectives™ on Stack Overflow

Ajax with Rails 3 and jQuery - Called from JS

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related