Javascript/AJAX Debugging

Rails
1

Hello !

I’m trying to implement something similar to the “multiple updates”
section
of the Web2.0 chapter of the Agile book.
I implemented my version, and nothing is happening. No javascript
errors,
my logs look fine, page is rendered fine… just no Effect.Highlight.
Here
is the code:

views/causes/cause_home/index.rhtml

<%= form_remote_tag(:complete => “eval(request.responseText)”,
:url => {:action => ‘update’, :id => @cause.id}) %>

super
super
super
<%= end_form_tag %>

views/causes/cause_home/update.rhtml

<% 3.times do |i| %>
new Effect.Highlight(‘div<%= i %>’);
<% end %>

controllers/causes/cause_home_controller.rb

def update
@cause = Cause.find(@params[:id])
if !@cause.update_attributes(@params[:cause])
flash[:notice] = “Data was not updated”
end
render(:template => “causes/cause_home/update”)
end

  1. My layout has all the proper javascripts being included.
  2. I did a “new Effect.Highlight” on a test
    within the
    index.rhtmlpage, and it worked fine.

    So, I’m at a loss as to how and debug further. Is there some other
    things I
    can check ?

    Thanks in advance !

    Dylan

2

Dylan S. wrote:

views/causes/cause_home/update.rhtml

<% 3.times do |i| %>
new Effect.Highlight(‘div<%= i %>’);
Try inserting a ‘-’ before here ^

–
We develop, watch us RoR, in numbers too big to ignore.

3

Dylan S. wrote:

new Effect.Highlight(‘div<%= i %>’);

Try using a ‘-%>’ closing tag for the erb.

–
We develop, watch us RoR, in numbers too big to ignore.

4

Mark Reginald J. wrote:

Dylan S. wrote:

new Effect.Highlight(‘div<%= i %>’);

Try using a ‘-%>’ closing tag for the erb.

–
We develop, watch us RoR, in numbers too big to ignore.

Huh? that would remove the entire line??

I think you should check out RJS templates, it is exactly what you need.

Jules

5

Not sure what you are trying to do beyond the example, but here is a way
to trigger a second update using the remote_function() method. View:

<% second_update = remote_function( :update => ‘div_2’, :url => {
:action => :action_2 } ) %>
<%= form_remote_tag(
:url => { :action => :action_1 },
:complete => “new Effect.Highlight(‘div_1’); #{second_update};”,
:update => “div_1”
)%>

… fields + submit …

<% end_form_tag -%>

Both actions render partials with :layout => false

6

You do not have a div with id=“div0”
I am assuming that this is causing a javascript error and the rest of
the code is not being evaluated;
Try
<% 3.times do |i| %> new Effect.Highlight(‘div<%= i+1 %>’);

bogdan

7

Jules J. wrote:

Mark Reginald J. wrote:

Dylan S. wrote:

new Effect.Highlight(‘div<%= i %>’);

Try using a ‘-%>’ closing tag for the erb.

Huh? that would remove the entire line??

No, I was just trying to supress a newline before the
closing quote. But that’s not the OP’s problem because
I keep forgetting that the newline supressing tag is only
needed when it appears at the end of a line.

–
We develop, watch us RoR, in numbers too big to ignore.

8

Thanks guys… I just gave those suggestions a try, but still no luck:

  1. I noticed that in my code, I was using :action => update instead of
    :action => :update. I made this change, no luck.
  2. I noticed that the :update keyword may cause a name conflict
    somewhere,
    so changed everything to :editdiv instead. no luck.
  3. I tried both Bogdan’s suggestion (which I thought must have been
    it),
    and Mark’s, but still no luck.

Still open to any suggestions :slight_smile: This seems impossible to debug !

9

Try these:

:action => ‘update’ instead of :action => :update, I don’t know if it is
fixed now, but :update didn’t work in older versions

try RJS templates, they are really better for this, much simpler, and
they “just work”.

10

Ahh… very good idea Douglas… didn’t even think about that. Here is
what
is alerted:

============

blah

new Effect.Highlight(‘div1’);
new Effect.Highlight(‘div2’);
new Effect.Highlight(‘div3’);

yargh
============

Is this a correct response ? I’m not too familar with
request.responseText…
but it looks like I need to be :slight_smile:
Dylan

11

Jules, unfortunately, it didn’t work. I’m scared of using edge rails…
but
I may have to try it out I guess.
Henry, thanks for that piece… I didn’t know about remote_function() :slight_smile:

Did the response from the alert() look correct ? It just shoves in the
raw
javascript calls like that ?

12

2006/1/14, Dylan S. [email protected]:

Hello !

views/causes/cause_home/index.rhtml

<%= form_remote_tag(:complete => “eval(request.responseText)”,
:url => {:action =>
‘update’, :id => @cause.id}) %>

As a “how to debug” thing, one thing to do would be to test that
request.responseText has the value you think it does. Try using this
instead:

:complete => “alert(request.responseText)”

Douglas

13

Dylan S. wrote:

Ahh… very good idea Douglas… didn’t even think about that. Here is
what is alerted:

============

Yes, that nails it. You have to turn off the layout for your AJAX
methods.
I do that by putting at the top of my controllers:

AJAX_METHODS = [ :meth1, :meth2, … ]
layout ‘my_layout’, :except => AJAX_METHODS

–
We develop, watch us RoR, in numbers too big to ignore.

14

Bogdan, Mark, and the rest of you… THANK YOU !

That nailed it on the head. When I first saw what was being rendered
via
the alert, I was suspicious… but didn’t quite get what was happening.
Mark, excellent controller code.

Thank you all !

Dylan

15

It is not correct. All you need is

new Effect.Highlight(‘div1’);
new Effect.Highlight(‘div2’);
new Effect.Highlight(‘div3’);
since you are supposed to evaluate javascript code.

So render with :layout=>false
In your controller use

render(:template => “causes/cause_home/update”, :layout=>false)