Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Disable button onclick but enable another button

I have two different buttons on my page. I want them both to be enabled when the page loads, but when a user clicks one I would like to disable the other button. But if they click the other button, I would like that button to disabled as well while enabling the other disabled button. I have been able to disable the button onclick, but I'm having trouble getting the other button to re-enable . Here are the two buttons that I have on the page. They are not in a form, just on the page.

<button onclick="down7913.disabled=false" type="submit" class="positive" name="up7913"><img src="check.png" alt=""/></button>

<button onclick="this.disabled=true" type="submit" class="negative" name="down7913"><img src="cross.png" alt=""/></button>
like image 374
austinh Avatar asked Jun 20 '12 03:06

austinh


People also ask

How do I disable one button when I click the other button?

attr("disabled", false); } else { $('#formButton'). attr("disabled", true); } $("#form2"). toggle(); }); This will disable the opposite button upon clicking, and re-enable it upon clicking again.

How do I disable and enable a button?

To disable a button using only JavaScript you need to set its disabled property to false . For example: element. disabled = true . And to enable a button we would do the opposite by setting the disabled JavaScript property to false .

How do you make a button disabled by default?

By default a button's state is enabled in HTML so by setting disabled = true, we have disabled the button for the user. 3. Then we add an event handler (addEventListener) to the input field with the event property change which monitors the interaction with elements.


1 Answers

Check this code, it's in your flavour and working:

Code Snippet -

<button
    onclick="this.disabled=true;document.getElementById('down7913').disabled=false;"
    type="submit"
    class="positive"
    name="up7913"
    id="up7913"
  >
    First
  </button>

  <button
    onclick="this.disabled=true;document.getElementById('up7913').disabled=false;"
    type="submit"
    class="negative"
    name="down7913"
    id="down7913"
  >
    Second
  </button>
like image 93
swapnesh Avatar answered Oct 12 '22 09:10

swapnesh