RoR creating a dynamic “evernote”-ish page

Question

so i'm creating a simple RoR app with an evernote look and feel.

notebook.rb

class Notebook < ActiveRecord::Base
  belongs_to :user
  has_many :notes
end

note.rb

class Note < ActiveRecord::Base
  belongs_to :user
  belongs_to :notebook
end

And i went ahead and created a static controller with an index view, this will be where I display the dashboard

static_controller.rb

class StaticController < ApplicationController
  def index
    if user_signed_in?
      @user = current_User
      @notebooks = @user.notebooks
      @notes = @user.notes
    end
  end
end

How should I display the list of notebooks? and whenever the user clicks a specific notebook, that notebook's notes gets displayed in the second column...

I'm thinking of creating iframes for this, but it would be better if these were all divs and we can just use jquery to update them dynamically... but I still haven't figured out how to do it.

Sorry to sound very newbie-ish.

Here's a snapshot of what I basically want to accomplish

http://i.stack.imgur.com/8gs0l.png

Thank you for your time!

Answer 1

hashify notes to group it by notebook_id

@notes_hash = @user.notes.group_by(&:notebook_id)

then on you notebook list, when the notebook link is clicked, catch the notebook_id and just look into your @notes_hash

notes = @notes_hash[notebook.id] || [ ]

you can use jQuery to dynamically update your second column.

<script type="text/javascript">
  var notes = <%= notes.collect{|a| a.note_content }.to_json %>;

  /* 
   * do stuff here with your array of notes content
   *
   */

</script>

make sure you require 'json' gem to use .to_json method.