# Change Button Text - Ajax

**URL:** <https://www.ruby-forum.com/t/change-button-text-ajax/102291>\
**Category:** Rails\
**Created:** [August 14, 2006, 8:55pm UTC](https://www.ruby-forum.com/t/change-button-text-ajax/102291 "2006-08-14T20:55:15Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![johnlester](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/j/e480ec/32.png) [@johnlester](https://www.ruby-forum.com/u/johnlester)\
**Post date:** [August 14, 2006, 8:55pm UTC](https://www.ruby-forum.com/t/change-button-text-ajax/102291/1 "2006-08-14T20:55:15Z")

</div>

Hi,  
I have the following code  
\<%= button\_to\_function “Hide”, “Element.toggle(‘mytext’);”%\>

which does toggle the invisiblity of the text just fine, But want I want  
via ajax magic, is to also toggle the button text, so it will now  
display “Show” when I have toggled the invisiblity of the Div.

Thanks for any help.

John

---

<div class="post-metadata">

**Author:** ![johnlester](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/j/e480ec/32.png) [@johnlester](https://www.ruby-forum.com/u/johnlester)\
**Post date:** [August 14, 2006, 11:07pm UTC](https://www.ruby-forum.com/t/change-button-text-ajax/102291/2 "2006-08-14T23:07:00Z")

</div>

John L. wrote:

> Hi,  
> I have the following code  
> \<%= button\_to\_function “Hide”, “Element.toggle(‘mytext’);”%\>
> 
> which does toggle the invisiblity of the text just fine, But want I want  
> via ajax magic, is to also toggle the button text, so it will now  
> display “Show” when I have toggled the invisiblity of the Div.
> 
> Thanks for any help.
> 
> John

To toggle text back and forth like that, you need to test whether or not  
the element is visible so the javascript knows what to make the button  
say. Try attaching an RJS block that looks something like:

\<%= button\_to\_function ‘Hide’ do |page|  
page \<\< “if ($(‘mytext’).visible) {”  
page[‘id-of-button’].hide  
page[‘id-of-button’].value = ‘Show’  
page \<\< “} else {”  
page[‘id-of-button’].show  
page[‘id-of-button’].value = ‘Hide’  
page \<\< “}”  
%\>

---

<div class="post-metadata">

**Author:** ![johnlester](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/j/e480ec/32.png) [@johnlester](https://www.ruby-forum.com/u/johnlester)\
**Post date:** [August 15, 2006, 12:36am UTC](https://www.ruby-forum.com/t/change-button-text-ajax/102291/3 "2006-08-15T00:36:52Z")

</div>

John L. wrote:

> Hi,  
> I have the following code  
> \<%= button\_to\_function “Hide”, “Element.toggle(‘mytext’);”%\>
> 
> which does toggle the invisiblity of the text just fine, But want I want  
> via ajax magic, is to also toggle the button text, so it will now  
> display “Show” when I have toggled the invisiblity of the Div.
> 
> Thanks for any help.
> 
> John

See the example above for one way of doing it - this has nothing to do  
with AJAX though; its just simple javascript.