473,756 Members | 6,482 Online
Bytes | Software Development & Data Engineering Community
+ Post

Home Posts Topics Members FAQ

Changing disabled colors in an input text form

Hello,
I need to enable/disable input text forms...
But...
I need to have the same style (color...) in both modes..
Could you help me ?
Thanx a lot

A small sample...

<HTML><HEAD><TI TLE></TITLE></HEAD>
<SCRIPT TYPE="text/javascript">
</SCRIPT>
<BODY >
NAME : <input type="text" ID="I1" name="I1" size="21"
style="text-align:center;co lor:#00FF00;">
<BR><BR>

<A HREF="javascrip t:" onClick="javasc ript:I1.disable d=true">Disable </A>
<BR>
<BR>
<A HREF="javascrip t:" onClick="javasc ript:I1.disable d=false"> Enable </A>
</BODY>
</HTML>
Jul 23 '05 #1
4 2752
"multimatum 2" <mu*********@vo ila.fr> wrote in message news:<10******* ********@iris.u k.clara.net>...
Hello,
I need to enable/disable input text forms...
But...
I need to have the same style (color...) in both modes..
Could you help me ?
Thanx a lot

A small sample...
NAME : <input type="text" ID="I1" name="I1" size="21"
Well, I try to avoid duplicating id and name field names.
style="text-align:center;co lor:#00FF00;">
<BR><BR>

<A HREF="javascrip t:" onClick="javasc ript:I1.disable d=true">Disable </A>

User's expect an anchor tag to take them to another page. I like to
use a button for this.

There are two sytle attributes for hidding things: display and
visibility. When a tag is hidden with display, no screen space is
taken. When a tag is hidden with visiblity, the text disappears, but
screen space is taken.

How to hide the name too? Put what you want to hide in a division or
span tag.

I'll enclose an example:

<HTML>
<HEAD>
<TITLE>Visibili ty test</TITLE>
</HEAD>
<SCRIPT TYPE="text/javascript">
function toggleVisibilit y(theId,theDisp lay)
{
// Check if the getElementById method is available
if (document.getEl ementById)
{
document.getEle mentById(theId) .style.visibili ty = theDisplay;
}
else if (document.all)
{
alert("Running an older version of IE.");
document.all[theId].style.visibili ty = theDisplay;
}
else
{ alert("Cannot change visibility of field"); }

}
</SCRIPT>
<BODY>
<form>
NAME :
<input type="text"
ID="I1"
name="I1name"
size="21"
style="text-align:center;co lor:#00FF00;">
<BR><BR>
<input TYPE=BUTTON
NAME="cmdDisabl e"
VALUE="Disable"
onClick="toggle Visibility('I1' ,'hidden');">

<BR>
<BR>
<input TYPE=BUTTON
NAME="cmdEnable "
VALUE="Enable"
onClick="toggle Visibility('I1' ,'visible');">
</form>
</BODY>
</HTML>
Jul 23 '05 #2
On 5 Oct 2004 09:03:56 -0700, Robert <rc*******@my-deja.com> wrote:
"multimatum 2" <mu*********@vo ila.fr> wrote in message
news:<10******* ********@iris.u k.clara.net>...
[snip]
NAME : <input type="text" ID="I1" name="I1" size="21"


Well, I try to avoid duplicating id and name field names.


Why? There's no need to, just make sure that if a name and id do match,
that they're on the same element or are in different forms. This makes
sure that

formObj.element s['name']

returns an element consistently.

[snip]
How to hide the name too? Put what you want to hide in a division or
span tag.
A label is more semantically correct.

<label for="id">Name:
<input id="id" ...></label>

[snip]
function toggleVisibilit y(theId,theDisp lay)
{
// Check if the getElementById method is available
if (document.getEl ementById)
{
document.getEle mentById(theId) .style.visibili ty = theDisplay;
}
else if (document.all)
{
alert("Running an older version of IE.");
document.all[theId].style.visibili ty = theDisplay;
}
else
{ alert("Cannot change visibility of field"); }

}


Of course, you could pass a reference:

<form ...>
<input id="myInput" ...>
<input type="button"
onclick="toggle Visibility(this .form.elements['myInput'], ...);">

or

onclick="toggle Visibility('myI nput', this.form, ...);">

function toggleVisibilit y(n, f, v) {
var e = f.elements[n];
// ...
}

You should also remember to test for the presence of the style object
before using it.

[snip]

Mike

--
Michael Winter
Replace ".invalid" with ".uk" to reply by e-mail.
Jul 23 '05 #3
"Michael Winter" <M.******@bluey onder.co.invali d> wrote in message news:<opsfenp5y 0x13kvk@atlanti s>...
NAME : <input type="text" ID="I1" name="I1" size="21"


Well, I try to avoid duplicating id and name field names.


Why? There's no need to, just make sure that if a name and id do match,
that they're on the same element or are in different forms. This makes
sure that

formObj.element s['name']

returns an element consistently.

[snip]


The usage of name and id attributes is a little confusing to me. I've
simplified my task by avoiding duplicate names.

Will this statement still work in IE with duplicate name and id
attribute names?

document.all[theId].style.visibili ty

There seems to be some overlap with the use if id and name. You seem
to code up the name tag in forms and the id tag everywhere else.

Does IE put both the id and name in the all collection? Any problems
to worry about if it does?
I was trying to avoid potential problems suggested in an earlier post
that Mike Winter made:

Here's the code I use for gEBI and d.all support (part of a larger
collection of code):

....

It tries to ensure that only one element is returned by the all
collection, and that that element was retrieved by its id, only.

<http://groups.google.c om/groups?hl=en&lr =&selm=opsevovy vzx13kvk%40atla ntis>
Robert
Jul 23 '05 #4
On 5 Oct 2004 18:28:27 -0700, Robert <rc*******@my-deja.com> wrote:

[snip]
The usage of name and id attributes is a little confusing to me. I've
simplified my task by avoiding duplicate names.
That's fair enough. I just thought I'd mention that it's not necessary.

As far as look-up goes, named DOM collections like forms and elements try
to find an element with a matching id, first. If one cannot be found, then
elements are checked for a matching name.

<input id="first">
<input name="first">
<input name="second">

formObj.element s['first'] // first INPUT
formObj.element s['second'] // third INPUT

The only way to access the second INPUT is either by adding a unique id,
or indexing by ordinal number.
Will this statement still work in IE with duplicate name and id
attribute names?

document.all[theId].style.visibili ty
Do you mean with

<input id="myInput" name="myInput">

Yes, it will.
There seems to be some overlap with the use if id and name. You seem to
code up the name tag in forms and the id tag everywhere else.
No, they're entirely separate. The name attribute is used in some non-form
control-related elements due to backwards compatibility. For example, the
name attribute serves no purpose on the FORM element itself, but NN4 won't
find that form if you reference it using an id. The same is true with IMG
elements.

With form controls, the name attribute is used during submission to pair
with the control's value. Only name can be used for this purpose, which is
why it's associated with controls so much. Whilst the name values can be
used to reference a form control for scripting purposes, it's just as easy
to use an id.

With non-form control-related elements, the decision to use a name or id
mainly comes down to what browser support you want. If you don't care for
NN4 and browsers of its generation, use id values to identify and
reference them. These elements could also then be used as target for
fragment identifiers (#myId) in links. If you do want NN4 support so you
can access elements from script, add an id and a name attribute with the
same value.

Did that help at all?
Does IE put both the id and name in the all collection? Any problems to
worry about if it does?
It does, but it becomes less consistent.

<input name="first">
<input id="first">

document.all['first']

returns a collection containing both INPUT elements. Rather than basing
the order on whether the element was matched by id or name, it's done by
document order.

var inputs = document.all['first']

inputs[0] // INPUT name="first"
inputs[1] // INPUT id="first"

This is why the code you've referenced below, and that in the FAQ (the
long code version), checks that IE is returning only by id, and that it
only returns one element.
I was trying to avoid potential problems suggested in an earlier post
that Mike Winter made:

Here's the code I use for gEBI and d.all support (part of a larger
collection of code):

...

It tries to ensure that only one element is returned by the all
collection, and that that element was retrieved by its id, only.

<http://groups.google.c om/groups?hl=en&lr =&selm=opsevovy vzx13kvk%40atla ntis>


I'd like to mention that there's an error in that code as pointed out by
Richard. See my response later in the thread for code that replaces the
document.all section.

Mike

--
Michael Winter
Replace ".invalid" with ".uk" to reply by e-mail.
Jul 23 '05 #5

This thread has been closed and replies have been disabled. Please start a new discussion.

Similar topics

7
2533
by: Michel | last post by:
Hi folks, I wonder if what I have in mind is possible, maybe even not all that complicated: I have an image, which is a yellow circle. I want this yellow circle to change color by having 3 sliders (RGB) on a website and a button to process it. Is this at all possible and could someone point me in the right direction or
6
4080
by: TheKeith | last post by:
I am doing a form for my site and would like to enable and disable a radio button set depending on whether one of the choices on an outer radio button set is checked. How can I refer to all the inputs of the inner radio button set (they all share a common name) with javascript. I tried document.getElementsByNames('thename') but it doesn't work. I know this is because this method returns an array which you must then refer to by a specific...
1
32273
by: Chris Ullman | last post by:
Simply put - if I have a disabled textbox how could I change the font-color from gray? e.g. <input type="text" disabled></input> Color no longer seems to work. Can it be done and if so how? Thanks, Chris Ullman
1
3433
by: MickG | last post by:
I am trying to change the value of the variable "hard" according to which radio button is pressed and I am having no joy. Could anyone help me with this, the problematic section is marked with ***********************, I've included all the code incase that isn't where the problem is. Any help would be hugely appreciated. Mick
8
3370
by: horos | last post by:
hey all, Ok, a related question to my previous one on data dumpers for postscript. In the process of putting a form together, I'm using a lot of placeholder variables that I really don't care about in the submitted action. I'd therefore like to get rid of them by doing something like:
3
5158
by: Kelly Domalik | last post by:
I would like to override the "disabled" property of a hidden field. When disabled is set to "true", it would call a function to disable 2 other text fields on the form. When disabled is set to "false", it would enable those 2 text fields. You should also be able to get the value of it as if it were a property: alert(my_hidden_field.disabled); Is there any way to do this? Many thanks to anyone that can help.
1
25832
by: Martin | last post by:
Is disabled to be set in the style of a tag just like visible? I am trying to set the whole content of a td tag to disabled like this, style='disabled:true' and it does not seem to work. Is this possible of is disabled not to be set in style?
13
3029
by: amykimber | last post by:
Hi all, I know I'm doign something really daft, but I can't get this to work... I have a form with a bunch of inputs called ship_owner - why the ? Because I'm submitting this page though php and the put the data into an array in the post.... anywhat. I have a link <a href="javascript:change_class()" >Block mode</a> to
4
1810
by: Sam Carleton | last post by:
How do I change the CSS colors via JavaScript DOM? Let me explain... I am working on a Windows application (in C#) that displays some HTML. In one place the HTML is a status window. What happens is the static HTML page is embedded into the application. The static page displayed and then the C# code gets a hold of the HTML DOM from the web browser and updates what pieces need to be updated. What I need to do now is change the colors...
0
9462
marktang
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, people are often confused as to whether an ONU can Work As a Router. In this blog post, we’ll explore What is ONU, What Is Router, ONU & Router’s main usage, and What is the difference between ONU and Router. Let’s take a closer look ! Part I. Meaning of...
0
9287
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 effortlessly switch the default language on Windows 10 without reinstalling. I'll walk you through it. First, let's disable language synchronization. With a Microsoft account, language settings sync across devices. To prevent any complications,...
0
10046
Oralloy
by: Oralloy | last post by:
Hello folks, I am unable to find appropriate documentation on the type promotion of bit-fields when using the generalised comparison operator "<=>". The problem is that using the GNU compilers, it seems that the internal comparison operator "<=>" tries to promote arguments from unsigned to signed. This is as boiled down as I can make it. Here is my compilation command: g++-12 -std=c++20 -Wnarrowing bit_field.cpp Here is the code in...
0
8723
agi2029
by: agi2029 | last post by:
Let's talk about the concept of autonomous AI software engineers and no-code agents. These AIs are designed to manage the entire lifecycle of a software development project—planning, coding, testing, and deployment—without human intervention. Imagine an AI that can take a project description, break it down, write the code, debug it, and then launch it, all on its own.... Now, this would greatly impact the work of software developers. The idea...
1
7259
isladogs
by: isladogs | last post by:
The next Access Europe User Group meeting will be on Wednesday 1 May 2024 starting at 18:00 UK time (6PM UTC+1) and finishing by 19:30 (7.30PM). In this session, we are pleased to welcome a new presenter, Adolph Dupré who will be discussing some powerful techniques for using class modules. He will explain when you may want to use classes instead of User Defined Types (UDT). For example, to manage the data in unbound forms. Adolph will...
0
5155
by: TSSRALBI | last post by:
Hello I'm a network technician in training and I need your help. I am currently learning how to create and manage the different types of VPNs and I have a question about LAN-to-LAN VPNs. The last exercise I practiced was to create a LAN-to-LAN VPN between two Pfsense firewalls, by using IPSEC protocols. I succeeded, with both firewalls in the same network. But I'm wondering if it's possible to do the same thing, with 2 Pfsense firewalls...
0
5318
by: adsilva | last post by:
A Windows Forms form does not have the event Unload, like VB6. What one acts like?
1
3817
by: 6302768590 | last post by:
Hai team i want code for transfer the data from one system to another through IP address by using C# our system has to for every 5mins then we have to update the data what the data is updated we have to send another system
3
2677
bsmnconsultancy
by: bsmnconsultancy | last post by:
In today's digital era, a well-designed website is crucial for businesses looking to succeed. Whether you're a small business owner or a large corporation in Toronto, having a strong online presence can significantly impact your brand's success. BSMN Consultancy, a leader in Website Development in Toronto offers valuable insights into creating effective websites that not only look great but also perform exceptionally well. In this comprehensive...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.