# Hiding and showing html with ajax

**URL:** <https://www.ruby-forum.com/t/hiding-and-showing-html-with-ajax/158138>\
**Category:** Rails\
**Created:** [January 19, 2009, 5:56pm UTC](https://www.ruby-forum.com/t/hiding-and-showing-html-with-ajax/158138 "2009-01-19T17:56:44Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![david](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/d/aeb1de/32.png) [@david](https://www.ruby-forum.com/u/david)\
**Post date:** [January 19, 2009, 5:56pm UTC](https://www.ruby-forum.com/t/hiding-and-showing-html-with-ajax/158138/1 "2009-01-19T17:56:44Z")

</div>

I could use some advice on this situation. I know this looks like a  
lot of code, but It is a straightforward implementation question, I am  
not stuck or anything. I have what I need working but it involved two  
ajax server requests and Im not sure it is the best way. I have a  
list of appointments, each with dates and an edit link. This edit  
link is a link\_to\_remote function that makes a call to the server and  
renders a partial that replaces the div that contains the appointment  
information with editable fields:

\<%= appointment.end\_time.strftime("%l:%M%p").sub(/^0/,'') %\> \<%= link\_to\_remote "Edit", :url =\> {:action =\> "edit\_appt", :id =\> appointment.id, :day =\> day} %\>

I want to make this a ajax request, b/c this is all in an ajaxed popup  
and I would like to speed them up by not loading all the editable  
field html for every appointment for each popup. Is this a safe  
assumption and solution?

The edit\_appt action looks like this:

page.replace\_html “appt\_#{params[:day]}\_#{params[:id]}”, :partial =\>  
‘edit\_appt’, :object =\> @appt\_to\_edit, :locals =\> {:day =\> params  
[:day]}

Now if anyone is still with me(and I REALLY appreciate if you are!)  
then my question is about placing a cancel link/button in this  
edit\_appt partial that will load the original appointment. The way it  
is set up now is that it makes another ajax request, passes the id  
again, performs a search and then renders another partial:

def reload\_appt  
@appointment = Appointment.find(params[:id])  
respond\_to do |format|  
format.js do  
render :update do |page|  
page.replace\_html “appt\_#{params[:day]}\_#{params  
[:id]}”, :partial =\> ‘individual\_appt’, :object =\> @appointment,  
:locals =\> {:day =\> params[:day]}  
end  
end  
end  
end

My question is if this is the best way of doing it? Im wondering if  
there is some way to use hide/show html or something, b/c the second  
database query seems redundant, seeing as how the appointment html  
existed in the first place. Thanks for any advice.

---

<div class="post-metadata">

**Author:** ![david](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/d/aeb1de/32.png) [@david](https://www.ruby-forum.com/u/david)\
**Post date:** [January 19, 2009, 10:14pm UTC](https://www.ruby-forum.com/t/hiding-and-showing-html-with-ajax/158138/2 "2009-01-19T22:14:00Z")

</div>

Hi David,

David wrote:

> My question is if this is the best way of doing it?

Depends on your definition of ‘best’. It works and it’s easy to follow  
the  
code. Good enough for me.

> Im wondering if there is some way to use hide/show html or something,

Sure, but you’d have to rework your view so you’d have a separate set of

s for the originals which you could hide/show, and a second set into which you'd render the edit partials.

> b/c the second database query seems redundant, seeing as how the  
> appointment html existed in the first place. Thanks for any advice.

DRY is not an absolute. Neither is readability. Both are components of  
maintainability. Go for balance. IMHO, if there’s a tie, readability  
wins.  
YMMV.

HTH,  
Bill

---

<div class="post-metadata">

**Author:** ![david](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/d/aeb1de/32.png) [@david](https://www.ruby-forum.com/u/david)\
**Post date:** [January 20, 2009, 4:48am UTC](https://www.ruby-forum.com/t/hiding-and-showing-html-with-ajax/158138/3 "2009-01-20T04:48:16Z")

</div>

Okay, thanks for the input.
