Disabling button with [removed] FF vs IE

Question

I have a row of buttons, which all create a pdf file which I want to open in a new tab. This way the button page stays on top, and the pdf's open to get printed. To prevent clicking a button twice I disable the button, like this (I use python):

<input type='submit' value='Factureren' name='submitbutton' id='%s'
onclick="javascript:document.getElementById('%s').disabled=true; 
document.getElementById('%s').className='button_disabled';"> % ((but_id,) *3)

In FF3 this works fine, i.e. the form is submitted, the script executed and then the button disables. In IE the button just disables, but the form script isn't executed.

Is there a solution to this IE problem?

Answer 1

<input type="submit" value="Factureren" name="submitbutton' id="%s"
onclick="this.disabled = true; this.className = 'button_disabled'; true;">
% ((but_id,) *3)

You can use this instead of document.getElementById('%s'). Also, you need to return true for the onclick event to pass.

You can also disable the button in the onsubmit handler for the form. This is probably more fool-proof.

Also, it'd be nice if you didn't use class specificly for a disabled button. CSS selectors are designed to select disabled buttons for you.

Answer 2

Look at this part:

onclick="javascript:document.getElementById('%s').disabled=true; 
document.getElementById('%s').className='button_disabled';"

The "javascript:" is unnecessary and wrong.

onclick="document.getElementById('%s').disabled=true; 
document.getElementById('%s').className='button_disabled';"

"javascript:" is the URL 'protocol' used in links, not in onclick actions.

Additionally, try to tell the form to submit. I think this would be correct:

onclick="document.getElementById('%s').disabled=true; 
document.getElementById('%s').className='button_disabled';
this.form.submit();"