Javascript: Disable button on Drop Down Select

Question

I have a dropdown menu with a couple of values that link to functions. I also have a textbox and submit button. Basically what I want to do is if a certain value in the drop down box is selected it disables or hides the submit button and possibly the textbox is made blank and once another value is selected it turns both back on.

My HTML Code:

<body> 
    <p><label>Drawing tool: <select id="dtool"> 
        <option value="line">Line</option> 
        <option value="rect">Rectangle</option> 
        <option value="pencil">Pencil</option>
        <option value="eraser">Eraser</option> 

    </select></label></p>

//Some canvas code

<form id="frmColor">
        <input type='color' id='color' />
    </form>
        <input type='submit' value='Change Color' id="colorSubmit"/>

Javascript in a linked file called canvas.js:

...
 tools.eraser = function () {
    var tool = this;
    this.started = false;
    var varPenColor = "White";
    context.strokeStyle = varPenColor;
    document.frmColor.colorSubmit.disabled=true;

Basically when I select the eraser from the drop down it all works but the submit button will not disable.

Im new to JS and not sure if I need to add some sort of listener or get element id any ideas?

Have you tried changing "document.frmColor" to "document.getElementById('frmColor')" ? — Pointy
– Pointy, Commented Apr 11, 2011 at 15:07

Gabriele Petrioli · Accepted Answer · 2011-04-11 15:11:19Z

3

You have the submit button outside of the form. (as seen in the example code..)

<form id="frmColor">
        <input type='color' id='color' />
    </form>
        <input type='submit' value='Change Color' id="colorSubmit"/>

should be

<form id="frmColor">
    <input type='color' id='color' />
    <input type='submit' value='Change Color' id="colorSubmit"/>
</form>

answered Apr 11, 2011 at 15:11

Gabriele Petrioli

197k35 gold badges275 silver badges331 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Mark Over a year ago

Thanks for that it didnt solve it all but helped. Along with what Pointy said it worked :)

Collectives™ on Stack Overflow

Javascript: Disable button on Drop Down Select

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related