Solved

Facebook + Javascript + Hide - Show field Toggle = Headache

Posted on 2010-09-04
9
591 Views
Last Modified: 2012-06-27
Hello all,

i would like to show or hide a text field on a form in html in a facebook app when I click a checkbox.  I know the code to set whether a checkbox is true/false is as follows and I was hoping there would be something similarly simple to hide or show a textbox:

    document.getElementById('CheckAnswerA').setChecked(false);

Any help you can offer would be greatly appreciated. Many thanks, Colin.

0
Comment
Question by:Canders_12
  • 3
  • 3
  • 3
9 Comments
 
LVL 82

Accepted Solution

by:
leakim971 earned 500 total points
ID: 33603124
From here : http://developers.facebook.com/docs/fbjs#dom_objects

I see we may use setStyle :


document.getElementById("texboxID").setStyle("display", "none");

Open in new window

0
 
LVL 2

Expert Comment

by:filosof
ID: 33603285
You need something like in the attached code snippet.

Additional notes:
In some cases maybe it makes sense to disable/enable the textarea as well - to suppress any input from sending to server etc..
...
<div>
<input type="checkbox"
 onclick="document.getElementById('mytext').style.display=(this.checked)?'':'none'">
</div>
...
<div>
<textarea id="mytext" style="display: none;"></textarea>
</div>
...

Open in new window

0
 

Author Comment

by:Canders_12
ID: 33603921
excellent :)

is it easy just to do the reverse and show the textfield?

many thanks, Colin.
0
Master Your Team's Linux and Cloud Stack!

The average business loses $13.5M per year to ineffective training (per 1,000 employees). Keep ahead of the competition and combine in-person quality with online cost and flexibility by training with Linux Academy.

 
LVL 82

Expert Comment

by:leakim971
ID: 33603937
to show use block instead none

0
 
LVL 2

Expert Comment

by:filosof
ID: 33606778
leakim971
No, using "block" is not correct for all cases - better to use empty string ("") !

why:
1. "" will also show the text field
2. sometimes you need another value instead of "block" - that is specified by CSS classes of element etc.. - "bock" will override this feature, "" - not

Canders_12
my example does both: hides and shows


....style.display = (this.checked) ? '' : 'none';
or
....style.display = (this.checked) ? 'none' : '';

Open in new window

0
 

Author Closing Comment

by:Canders_12
ID: 33607213
Beautiful :)
0
 
LVL 82

Expert Comment

by:leakim971
ID: 33607707
Thanks for the points!
0
 

Author Comment

by:Canders_12
ID: 33612979
filosof,

sorry, you definitely deserve points here :(

is it against rules to pop up the same question to ensure you also get some points? sorry, i was rushing and didnt read everyones post.  Sorry dude.
0
 
LVL 2

Expert Comment

by:filosof
ID: 33614719
I do not know how to adjust - just ask some moderator etc.  - no matter
0

Featured Post

DevOps Toolchain Recommendations

Read this Gartner Research Note and discover how your IT organization can automate and optimize DevOps processes using a toolchain architecture.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

"In order to have an organized way for empathy mapping, we rely on a psychological model and trying to model it in a simple way, so we will split the board to three section for each persona and a scenario and try to see what those personas would Do,…
FAQ pages provide a simple way for you to supply and for customers to find answers to the most common questions about your company. Here are six reasons why your company website should have a FAQ page
Explain concepts important to validation of email addresses with regular expressions. Applies to most languages/tools that uses regular expressions. Consider email address RFCs: Look at HTML5 form input element (with type=email) regex pattern: T…
The viewer will learn how to dynamically set the form action using jQuery.

774 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question