Display form's message by remote method using ujs on Rails - ruby-on-rails

Question

I followed the episode http://railscasts.com/episodes/136-jquery-ajax-revised
and create my cusotm example.
I put the create form in the index, and create a book by remote method
But I have no idea how to put error message in the page.
please give me some example , thanks~
index
<%= render 'form' %>
<p>
<table id='books_tbl' class="table">
<th>id</th>
<th>title</th>
<th>ISBN</th>
<th>sn</th>
<th>price</th>
<th>Functions</th>
<div class="books" id="books">
<%= render #existed_books %>
</div>
</table>
the controller
# POST /books
# POST /books.json
def create
#book = Book.new(params[:book])
respond_to do |format|
if #book.save
format.html { redirect_to #book, notice: 'Book was successfully created.' }
format.json { render json: #book, status: :created, location: #book }
format.js
else
format.html { render action: "new" }
format.json { render json: #book.errors, status: :unprocessable_entity }
format.js
end
create.je.erb
<% unless #book.save %>
<% else %>
$('#books_tbl tr:last').after('<%= j render(#book) %>');
<% end %>

Answer 1

First, change your books_controller so that it will always render create.js.erb whether the book is persisted or not.
def create
#book = Book.new(params[:book])
respond_to do |format|
if #book.save
format.html { redirect_to #book, notice: 'Book was successfully created.' }
format.json { render json: #book, status: :created, location: #book }
else
format.html { render action: "new" }
format.json { render json: #book.errors, status: :unprocessable_entity }
end
format.js
end
end
Then, in you create.js.erb, you will want to check whether your book is persited? or not:
<% if #book.persisted? %>
# ...
<% else %>
# display the error message
<% end %>
Let's say we are going to display the error message in a <p> with the .errors class:
$('<p>').text('<%= #book.errors.full_messages.to_sentence.capitalize %>')
.prepend('form');
The thing is that you will have to remove the errors paragraph every time you render create.js.erb so that former errors won't stick around:
$('p.errors').remove();
All in all, it gives:
$('p.errors').remove();
<% if #book.persisted? %>
# ...
<% else %>
$('<p>').text('<%= #book.errors.full_messages.to_sentence.capitalize %>')
.prepend('form')
<% end %>