Javascript/AJAX Debugging


#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. removed_email_address@domain.invalid:

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)