I'm new to Java Script.
I'm displaying comments people have made. Below each persons' comment
I want to add 2 buttons "Reply" and "Amend". Clicking "Reply" would
display an empty text field below the comment with a spell check &
submit button. Clicking "Amend" would display the same buttons & text
field but pre-populated with the original comment.
Using Java Script how do I show / hide the text field in my list of
comments but have it as a form so that it can be sumitted?
How do I tell it to populate the text field or should I have a second
text field that is pre-populated and show it instead of the first text
field?
7  29109 
FP wrote: I'm new to Java Script.
I'm displaying comments people have made. Below each persons' comment
I want to add 2 buttons "Reply" and "Amend". Clicking "Reply" would
display an empty text field below the comment with a spell check &
submit button. Clicking "Amend" would display the same buttons & text
field but pre-populated with the original comment.
Using Java Script how do I show / hide the text field in my list of
comments but have it as a form so that it can be sumitted?
Hi,
The easiest way to show/hide some part of the page (form or something else)
is using CSS.
Put the part you want to show/hide in a div, and change the
display-property.
<span
onClick="document.getElementById('myId').style.dis play=none">hide</span>
<span
onClick="document.getElementById('myId').style.dis play=block">show</span>
<div id="myId" style="display:block">
<input type="text" name="bla">
</div>
How do I tell it to populate the text field or should I have a second
text field that is pre-populated and show it instead of the first text
field?
I have no idea what you are asking here, sorry.
Regards,
Erwin Moller
Erwin Moller wrote: The easiest way to show/hide some part of the page (form or something else)
is using CSS.
Put the part you want to show/hide in a div, and change the
display-property.
<span
onClick="document.getElementById('myId').style.dis play=none">hide</span>
<span
onClick="document.getElementById('myId').style.dis play=block">show</span>
<div id="myId" style="display:block">
<input type="text" name="bla">
</div>
I tried your code and couldn't get it to work. I'm not familiar with
style sheets, nor Java. If possible I would like to do this without
CSS (less things to go wrong). Below is the exact code I tried, please
point out any errors, and keep in mind I'm new to this.
I tried merging your code with other posts I read, all without luck.
The "Span Hide" doesn't act as a button, the "Java Hide" acts like a
button but doesn't do anything.
<HTML>
<SCRIPT LANGUAGE="JavaScript">
function Show(){
document.getElementById( "myId" ).style.display = "block"; }
function Hide(){
document.getElementById( "myId" ).style.display = "none"; }
</script>
<BODY>
<span onClick="document.getElementById('myId').style.dis play=none">Span
Hide</span>
<span
onClick="document.getElementById('myId').style.dis play=block">Span
Show</span>
<input type="button" onclick="Show();" value="Java Show">
<input type="button" onclick="Hide();" value="Java Hide">
<div id="myId" style="display:block">>
<P>Test</P>
</div>
</BODY>
</HTML>
FP said the following on 6/28/2006 11:44 AM: Erwin Moller wrote: The easiest way to show/hide some part of the page (form or something else)
is using CSS.
Put the part you want to show/hide in a div, and change the
display-property.
<span
onClick="document.getElementById('myId').style.dis play=none">hide</span>
<span
onClick="document.getElementById('myId').style.dis play=block">show</span>
<div id="myId" style="display:block">
<input type="text" name="bla">
</div>
I tried your code and couldn't get it to work. I'm not familiar with
style sheets, nor Java. If possible I would like to do this without
CSS (less things to go wrong).
You can do it without CSS but CSS makes it a lot simpler. And, Java !=
Javascript.
Below is the exact code I tried, please
point out any errors, and keep in mind I'm new to this.
I tried merging your code with other posts I read, all without luck.
The "Span Hide" doesn't act as a button,
Because it's not a button.
the "Java Hide" acts like a button but doesn't do anything.
It does for me, it hides the div tag. It doesn't actually "hide" it, it
removes it from the flow of the page.
<HTML>
<SCRIPT LANGUAGE="JavaScript">
function Show(){
document.getElementById( "myId" ).style.display = "block"; }
function Hide(){
document.getElementById( "myId" ).style.display = "none"; }
</script>
<BODY>
<span onClick="document.getElementById('myId').style.dis play=none">Span
Hide</span>
='none' otherwise it tries to evaluate none as a variable and is
undefined (the error message tells you that)
<span
onClick="document.getElementById('myId').style.dis play=block">Span
Show</span>
ditto.
You hide an element one of two ways. You change it's visibility property
or you change it's display property. Which one you use depends on the
effect you want.
<script type="text/javascript">
function changeDisplay(elem,displayMode){
document.getElementById(elem).style.display = displayMode;
}
function changeVisibility(elem,visibilityMode){
document.getElementById(elem).style.visibility = visibilityMode;
}
</script>
HTML:
<div id="div1" style="display: visible">Div 1</div>
<div id="div2" style="visibility: visible">Div 2</div>
<button onclick="changeDisplay('div1','block')">
Make Div1 Visible</button>
<button onclick="changeDisplay('div1','none')">
Make Div1 Hidden</button>
<button onclick="changeVisibility('div2','hidden')">
Make Div2 Hidden</button>
<button onclick="changeVisibility('div2','visible')">
Make Div2 Visible</button>
Have fun.
--
Randy
comp.lang.javascript FAQ - http://jibbering.com/faq & newsgroup weekly
Temporarily at: http://members.aol.com/_ht_a/hikksnotathome/cljfaq/
Javascript Best Practices - http://www.JavascriptToolbox.com/bestpractices/
Randy Webb wrote: FP said the following on 6/28/2006 11:44 AM: Erwin Moller wrote: The easiest way to show/hide some part of the page (form or something
else) is using CSS.
Put the part you want to show/hide in a div, and change the
display-property.
<span
onClick="document.getElementById('myId').style.dis play=none">hide</span>
<span
onClick="document.getElementById('myId').style.dis play=block">show</span>
<div id="myId" style="display:block">
<input type="text" name="bla">
</div>
I tried your code and couldn't get it to work. I'm not familiar with
style sheets, nor Java. If possible I would like to do this without
CSS (less things to go wrong).
You can do it without CSS but CSS makes it a lot simpler. And, Java !=
Javascript.
Below is the exact code I tried, please
point out any errors, and keep in mind I'm new to this.
I tried merging your code with other posts I read, all without luck.
The "Span Hide" doesn't act as a button,
Because it's not a button.
the "Java Hide" acts like a button but doesn't do anything.
It does for me, it hides the div tag. It doesn't actually "hide" it, it
removes it from the flow of the page.
<HTML>
<SCRIPT LANGUAGE="JavaScript">
function Show(){
document.getElementById( "myId" ).style.display = "block"; }
function Hide(){
document.getElementById( "myId" ).style.display = "none"; }
</script>
<BODY>
<span onClick="document.getElementById('myId').style.dis play=none">Span
Hide</span>
='none' otherwise it tries to evaluate none as a variable and is
undefined (the error message tells you that)
<span
onClick="document.getElementById('myId').style.dis play=block">Span
Show</span>
ditto.
You hide an element one of two ways. You change it's visibility property
or you change it's display property. Which one you use depends on the
effect you want.
<script type="text/javascript">
function changeDisplay(elem,displayMode){
document.getElementById(elem).style.display = displayMode;
}
function changeVisibility(elem,visibilityMode){
document.getElementById(elem).style.visibility = visibilityMode;
}
</script>
HTML:
<div id="div1" style="display: visible">Div 1</div>
<div id="div2" style="visibility: visible">Div 2</div>
<button onclick="changeDisplay('div1','block')">
Make Div1 Visible</button>
<button onclick="changeDisplay('div1','none')">
Make Div1 Hidden</button>
<button onclick="changeVisibility('div2','hidden')">
Make Div2 Hidden</button>
<button onclick="changeVisibility('div2','visible')">
Make Div2 Visible</button>
Have fun.
Oops, sorry for none / 'none' confusion.
My bad.
Thanks for correcting Randy.
Regards,
Erwin Moller
Randy Webb wrote: <script type="text/javascript">
function changeDisplay(elem,displayMode){
document.getElementById(elem).style.display = displayMode;
}
function changeVisibility(elem,visibilityMode){
document.getElementById(elem).style.visibility = visibilityMode;
}
</script>
HTML:
<div id="div1" style="display: visible">Div 1</div>
<div id="div2" style="visibility: visible">Div 2</div>
<button onclick="changeDisplay('div1','block')">
Make Div1 Visible</button>
<button onclick="changeDisplay('div1','none')">
Make Div1 Hidden</button>
<button onclick="changeVisibility('div2','hidden')">
Make Div2 Hidden</button>
<button onclick="changeVisibility('div2','visible')">
Make Div2 Visible</button>
Thanks, this worked beautifully for me. I see the difference of just
hidding the text vs removing it completely from the page. A working
example is exactly what I needed.
='none' otherwise it tries to evaluate none as a variable and is
undefined (the error message tells you that)
This is going to sound like a silly question; when I loaded the page in
Safari I wasn't getting any errors. I'm hosting the page with the
built in Apache on OS X 10.3.9, do I turn on error reporting in Apache,
in Safari, or do I add some HTML code to do that? the "Java Hide" acts like a button but doesn't do anything.
It does for me, it hides the div tag. It doesn't actually "hide" it, it
removes it from the flow of the page.
I finally figured out why my initial code, copied from somewhere,
wasn't working. Instead of;
"getElementById" I had "getEmementById".
I think I'm going to be able to sleep better tonight.
FP said the following on 6/28/2006 8:13 PM: Randy Webb wrote:
<snip> ='none' otherwise it tries to evaluate none as a variable and is
undefined (the error message tells you that)
This is going to sound like a silly question; when I loaded the page in
Safari I wasn't getting any errors. I'm hosting the page with the
built in Apache on OS X 10.3.9, do I turn on error reporting in Apache,
in Safari, or do I add some HTML code to do that?
You have to turn it on in Safari, although I do not know how to do that. the "Java Hide" acts like a button but doesn't do anything.
It does for me, it hides the div tag. It doesn't actually "hide" it, it
removes it from the flow of the page.
I finally figured out why my initial code, copied from somewhere,
wasn't working. Instead of;
"getElementById" I had "getEmementById".
I think I'm going to be able to sleep better tonight.
The problem with the original code you posted was none instead of 'none'
and no other errors. If your original had getEmementById then you fixed
it before you posted it.
--
Randy
comp.lang.javascript FAQ - http://jibbering.com/faq & newsgroup weekly
Temporarily at: http://members.aol.com/_ht_a/hikksnotathome/cljfaq/
Javascript Best Practices - http://www.JavascriptToolbox.com/bestpractices/
Randy Webb wrote: You have to turn it on in Safari, although I do not know how to do that.
Just thought I would share incase anyone else needs an answer to this.
Quit Safari, from the terminal window enter the command
defaults write com.apple.Safari IncludeDebugMenu 1
this adds a debug menu with some neat features as the right most menu
in Safari
The problem with the original code you posted was none instead of 'none'
and no other errors. If your original had getEmementById then you fixed
it before you posted it.
I could have sworn it had the error last night, but after staring at
the computer screen so much I'm starting to wonder if I wasn't seeing
things. This thread has been closed and replies have been disabled. Please start a new discussion. Similar topics
by: Steve Speirs |
last post by:
Hi
I'm trying to show/hide a simple piece of text and a text field on a
form based on what choice is made from a drop down box.
<select name="dropdown" size="1">
<option selected...
|
by: Miguel Dias Moura |
last post by:
Hello,
I have 2 tables in a web page.
I want to show first table and hide second when the URL parameter
result=ok.
And of course the oposite when result=notok.
How to do this?
|
by: Paul Lautman |
last post by:
Hi y'all,
I found the toggle function (shown below) and applied it to a form of mine.
It works fine in IE, but in Firefox it appears to fail on the eval lines.
I've searched around but I can't...
|
by: Dan |
last post by:
Hi,
I know how to show and hide text, but I want to make it so that the
page shifts up when I hide my text. Right now with the simple code, it
only leaves a blank space.
Thanks,
Daniel
|
by: JLC |
last post by:
Hi,
I am creating a page in asp.net that has a checkbox and a textbox. When the checkbox is checked I want the textbox to become active and show text. If the checkbox is unchecked, I would like...
|
by: saijin |
last post by:
I've been trying to implement simple lines of XML into my flash file created with ActionScript 3.0, but things seem not to be working.
All I want to do is to load an external XML file (data.xml),...
|
by: stewdizzle |
last post by:
I have a from with three radio buttons (same group) and three text boxes. The radio buttons give the user a choice of uploading one, two, or three images. Currently, I have the text boxes load as...
|
by: jholland13 |
last post by:
Hi,
I manage a Access 07 dbase as part of my job. I am not very good at programming, no formal training. Most things it does by code I found snippets and modified them.
Something I want to do is...
|
by: Shinee Nag |
last post by:
What I am trying to do is add first text field right after a dropdown menu only if the user selects a first option, when a user selects second option then second text field is opened
I am new to...
|
by: taylorcarr |
last post by:
A Canon printer is a smart device known for being advanced, efficient, and reliable. It is designed for home, office, and hybrid workspace use and can also be used for a variety of purposes. However,...
|
by: Charles Arthur |
last post by:
How do i turn on java script on a villaon, callus and itel keypad mobile phone
|
by: aa123db |
last post by:
Variable and constants
Use var or let for variables and const fror constants.
Var foo ='bar';
Let foo ='bar';const baz ='bar';
Functions
function $name$ ($parameters$) {
}
...
|
by: ryjfgjl |
last post by:
If we have dozens or hundreds of excel to import into the database, if we use the excel import function provided by database editors such as navicat, it will be extremely tedious and time-consuming...
|
by: ryjfgjl |
last post by:
In our work, we often receive Excel tables with data in the same format. If we want to analyze these data, it can be difficult to analyze them because the data is spread across multiple Excel files...
|
by: emmanuelkatto |
last post by:
Hi All, I am Emmanuel katto from Uganda. I want to ask what challenges you've faced while migrating a website to cloud.
Please let me know.
Thanks!
Emmanuel
|
by: nemocccc |
last post by:
hello, everyone, I want to develop a software for my android phone for daily needs, any suggestions?
|
by: marktang |
last post by:
ONU (Optical Network Unit) is one of the key components for providing high-speed Internet services. Its primary function is to act as an endpoint device located at the user's premises. However,...
|
by: Hystou |
last post by:
Most computers default to English, but sometimes we require a different language, especially when relocating. Forgot to request a specific language before your computer shipped? No problem! You can...
| |
