Copy link to clipboard
Copied
Hi there...
I have been reading a lot of posts about enabling/disabling check box and so far I have not found what I need to do. It is a very simple action and I just can't figure out what to do:
I have a check box and a text box.
Initially, the text box is hidden (style"visibility"hiddent").
UNTIL When the check box is checked, text box should appear to be filled in.
Otherwise, text box stays hidden.
I used the style attribute because "Disabling" the text box didn't work. One can still type in something even if the check box was not filled in.
I was wondering if this could happen on the client side?
Please advise.
Thanks,
Karla
Copy link to clipboard
Copied
This might help for a textarea
http://www.w3schools.com/TAGS/att_textarea_readonly.asp
For an input
http://www.w3schools.com/TAGS/att_input_readonly.asp
readonly is the attribute you are looking for I believe.
Byron Mann
mannb@hostmysite.com
byronosity@gmail.com
Software Architect
hosting.com | hostmysite.com
http://www.hostmysite.com/?utm_source=bb
Copy link to clipboard
Copied
Hi Byron,
Thanks for the suggestion, but it is not what I am looking for.
Read-only still let's one enter data even if the checkbox is empty.
I'm using CF MX and I have a checkbox using cfinput. When this box is checked, I want the visibility of the related text box to be "Visible" and ready for input by a user. Otherwise, it stays hidden.
Any other suggestions?
Thanks,
Karla
Copy link to clipboard
Copied
You can use jQuery to show/hide the textbox or even plain js:
<input type="checkbox" onclick="if( document.getElementById('t123').style.visibility=='hidden' ){ document.getElementById('t123').style.visibility='visible'; } else {document.getElementById('t123').style.visibility='hidden'}"> <input type="text" name="t123" id="t123" style="visibility:hidden;"/>
Using jQuery it's the behavior is separated more clearly from your
markup and it's something like this:
$(function(){ $("#id_of_your_checkbox").click(function(){ $("#t123").toggle(); }); })
Mack
Copy link to clipboard
Copied
In what way did disabling the text box not work?
Copy link to clipboard
Copied
I apologize for not replying sooner. "disabling the text box not work" means that users can click on the input box and type information even if the box is supposedly disabled.
Thanks.
Copy link to clipboard
Copied
Disabling the text box is better than hiding it. If you thought you disabled it and didn't, you didn't do it properly. Google "javascript disable textbox" for code samples that work.
Copy link to clipboard
Copied
users can click on the input box and type information even if the box is supposedly disabled.
That is a contradiction. An input box is said to be disabled if users cannot type information in it.
Copy link to clipboard
Copied
<form>
<input type="text" id="txt_id" name="txt" style="visibility:hidden">
<br>
<input type="checkbox" name="chkbx" name="chkbx_id" onclick="hide_n_show()">
</form>
<script type="text/javascript">
function hide_n_show() {
if(document.getElementById('txt_id').style.visibility == "hidden") {
document.getElementById('txt_id').style.visibility = "visible";
}
else {
document.getElementById('txt_id').style.visibility = "hidden";
}
}
</script>