/    Sign up×
Community /Pin to ProfileBookmark

Problems Disabling an Input Button

Copy linkTweet thisAlerts:
Jan 02.2004

I’m having problems disabling an input button via JavaScript on my html form.

I’m using the following tag to create an html button with a specified image to display on my html form:

<input name=”postButton” type=”image” src=”./Post.jpg” onClick=”savePost()” disabled>

I have another text field on this html page that I want to enable the postButton when it loses focus via a call to a javascript function:

function enablePost(){
document.form.postButton.disabled=false;
}

But everytime the text field loses focus I get an IE error stating that the postButton object does not exist or is null.

But what I found is that if I change the input tag that defines my button to:

<input name=”postButton” type=”button” onClick=”savePost()” disabled>

The functionality works correctly, but then I lose my image source that I wanted.

Anyone know how to resolve this issue???

to post a comment
JavaScript

8 Comments(s) ↴

Copy linkTweet thisAlerts:
@oleragJan 02.2004 — how about changing ...
[code=php]
function enablePost(){
document.form.postButton.disabled=false;
}
[/code]
to...
[code=php]
function enablePost(){
document.forms[0].postButton.disabled=false;
}
[/code]
if a button is what u want...
Copy linkTweet thisAlerts:
@JavaTheHutauthorJan 02.2004 — I still get the same problem. It appears as though if you use an input tag and define the type as "image", than IE doesn't recognize it as an object of that document for whatever reasons.

I've tried using the <button> tag with the following:

<button name="postButton" type="button" disabled><img src="./Post.jpg"></button>

I was able to get it to disable and enable correcty using this tag, but now I have a problem with the grey button border surrounding my image.

?
Copy linkTweet thisAlerts:
@oleragJan 02.2004 — If what you are looking for is an image that may or may

not be disabled, I believe you would have to load the

image you want (one that appears enabled and another

with a disabled appearance). For activation, use the

anchor tag; an image is not a <form> object.

I do not believe HTML currently possesses a means by

which a button can be substituted as an icon to give you

the enabling/disabling affect your after.
Copy linkTweet thisAlerts:
@JonaJan 02.2004 — [font=arial]Just make one function to enable/disable the form from being submitted--they can still select a text input and press enter if you disable your submit button.[/font]

[font=monospace]

function enableForm(returnVal)

{

document.forms[0].onsubmit=function() {return returnVal};

}

[/font]

[font=arial]In this way, you can call the function with a boolean (true or false) value:[/font]

[font=monospace]

enableForm(true); // enable form

enableForm(false); // disable form

[/font]

[b][J]ona[/b]
Copy linkTweet thisAlerts:
@oleragJan 02.2004 — I think what he's trying to do is overlay an image over a

button in a manner similar to assigning an icon to the

button (like in Swing) to get the enabling/disabling affects

of the button component.

I don't believe this is possible in HTML but maybe some

CSS folks know how to do this.

If I'm wrong then please disregard.
Copy linkTweet thisAlerts:
@JonaJan 02.2004 — [font=arial]Then why not change the SRC of the image to a grayscale version when the button is disabled, and set style="border: none;"?[/font]

[b][J]ona[/b]
Copy linkTweet thisAlerts:
@oleragJan 02.2004 — Works for me. So aren't you talking about loading one of two

separate images (colored represents enabled; greyscale

is disabled) or is this coloring/greyscale affect accomplished

with the same image??

And, I still don't know if he wants to use an anchor or a

form object (I think, the later) for the activation process,

whatever it may be.
Copy linkTweet thisAlerts:
@JavaTheHutauthorJan 05.2004 — Thanks for the advice. Let me try implementing the grey scale today and see what happens.
×

Success!

Help @JavaTheHut spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 — BETA 6.17,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @nearjob,
tipped: article
amount: 1000 SATS,

tipper: @meenaratha,
tipped: article
amount: 1000 SATS,

tipper: @meenaratha,
tipped: article
amount: 1000 SATS,
)...