{ height: 1%; } - Ruby on Rails and User Interface Design

CSS, UI Design, Ruby on Rails and cheese ... lots of cheese

AjaxScaffold 2.2.0 released with graceful JS degredation

Posted by Richard White Sat, 04 Mar 2006 22:56:11 GMT

AjaxScaffold has been deprecated in favor of ActiveScaffold

Just put out a new build to RubyForge, here’s what’s changed:

  • Generated scaffolds now gracefully degrade in the absence of Javascript. See the notes further below on some extra setup information associated with this change.
  • Refactored some of the CSS class names. Mainly all the stuff that used to be called list and list-wrapper etc are now called ajaxscaffold-list. Makes much more semantic sense and should be easier to work with in the scope of the rest of your application.
  • Refactored some of the Javascript code. Minor tinkering like removing all the callbacks for onComplete since they weren’t being used at all.

Yes, I know I said I wasn’t going to do it and could care less about graceful degredation, but it wasn’t my idea… really! You can thank Sean Mountcastle for sending me the code that compelled me to finish what he had started. There is only one real gotcha to the generated scaffold that I will explain below. Also all those other howto articles I promised some of you, don’t worry they’ll be written sooner than later, promise.

Configuring Javascript degredation when using a scaffold as a component

One of the stated goals of this project was to make it easy to create your application by dropping in ajax scaffolds into pages using render :component. If you are dropping in the scaffold as a component on a page that is not /controllername/index you need to modify one method on each scaffold’s controller to make sure everyone gets routed to the right page if Javascript is not available.

If you are using the scaffold in isolation (ie it has its own page which is /controllername/index) then the following code in the controller makes sure that any actions that take the user away from the page (edit, create) return them to the correct page when they finish/hit submit.

  def return_to_main
    redirect_to :action => 'index'
  end

If however you have embedded the scaffold into another page (like an admin console with multiple scaffolds) then you need to modify said method to point to whichever page that may be. For example I modified customer_controller.rb on the demo site to point to the demo page instead of /CustomerController/index

  def return_to_main
    redirect_to :controller => 'AjaxScaffoldDemo', :action => 'index'
  end

Thats it! Now the 0.37% of your users that don’t have javascript will still be able to enjoy those admin consoles you were able to create in 5 minutes with the ajax scaffold generator. </tootingownhorn>

Comments

  1. dizave said 21 minutes later:

    Hey, nice work on the scaffold. Do you have an example on using it with render :component? I assume upgrading to 2.2 breaks my 2.1 pages because of the new stylesheet, and I assume this wouldn’t happen w/ component, so I’d like to get down with that right away.

    Anyway, thanks for the good work!

    -d

  2. Richard White said 33 minutes later:

    dizave: Yeah I felt back about changing the CSS classNames, but they were pretty generic and bad before. If you look in the generated index.rhtml for a given scaffold you will see the code for how to use it as a component b/c it’s used as one by default :)

  3. Dwight said about 2 hours later:

    I’m having some trouble getting the AJAX calls from the scaffold to work. It looks great, and I love the demo. Everything generates fine and browsing to the page loads correctly. Clicking New, Edit or Remove contacts the web server for the page but the page is never updated. The WEBrick shows a connect request for /building/new (in this case) and the log shows a request and an entry saying _form.rhtml was rendered.

    I’ve tried the process on 2 servers (a Windows XP box and an FC4 box, bothing running the WEBrick server, though) and with 2 different browsers on each (Firefox 1.5 and IE6) with the same odd result.

    I know this must be a simple problem, but I’m fairly new to Rails and can’t seem to diagnose what’s causing it. Has anyone had a similar problem or know of any insight that might shed light on my situation? Any help is much appreciated…

  4. Richard White said about 3 hours later:

    Dwight: If you are using FF are you getting any errors in your Javascript console? If so feel free to email those along to me and I’ll see what I can come up with.

  5. ian said 1 day later:

    where am i going wrong here:

    if i run: ./script/generate ajax_scaffold Student 'admin/students' and navigate to admin/students i see my nice little page, but all of the links come out as ”/admin/admin/students/action”…

    also, is it possible to zip up the demo so that i can get a clearer idea of how to include multiple scaffolds on one page?

  6. Richard White said 1 day later:

    ian: Sounds like that might be a bug, I’ll look into this afternoon. As putting multiple scaffolds on the same page just create a new view and copy onto the contents of the index.rhtml’s of all the scaffolds you want on that view. Many have asked about this and I am going to include it in the next part of the howto.

  7. Richard White said 2 days later:

    ian: That is indeed a bug, I’m working on the fix for that in the meantime you can go into the offending forms and delete the ‘admin/’ in the front of the URL on the form_remote_tag.

  8. Richard White said 3 days later:

    ian: I’ve patched that bug and released the fix in 2.2.1. Thanks for the heads up.

Trackbacks

Use the following link to trackback from your own site:
http://www.height1percent.com/articles/trackback/20

(leave url/email »)

   Comment Markup Help Preview comment