Why can't I change the type of an input element to submit?

Question

I\'m calling this function:

function submit_button(button_id){
    $(\'#\' + button_id).attr(\'type\', \'submit\');
}

to make this button t

Answer 1

Why not just bind to the click event and call the form submit in your click handler?

Answer 2

It worked finally , try finding the following:

   $("#confirm_button").each(function () 
   { this.type = "number"; });

Answer 3

Here's a workaround:

$('<input name="confirm_button" id="confirm_button2" type="submit" value="Confirm" class="login_btn" />').insertAfter('#confirm_button');
$('#confirm_button').remove();

Answer 4

Why jQuery won't allow you to just change the type attribute?

Because it causes problems in Internet Explorer.

More info at: change type of input field with jQuery

"Straight from the jQuery source":

// We can't allow the type property to be changed (since it causes problems in IE)
if ( name == "type" && jQuery.nodeName( elem, "input" ) && elem.parentNode )
    throw "type property can't be changed";

Answer 5

The workaround is to create an element of the correct type, and replace the currently exisitng one.

However, in your example, a <button> element could serve the purpose of submitting the form, render as a button, and not require any javascript to do so, eg:

<button name="confirm_button" id="confirm_button" type="input" value="Confirm" class="login_btn" disabled />

And then to make the button enabled again:

$('confirm_button').removeAttr('disabled');

Answer 6

function submit_button(button_id){
    $('#' + button_id).prop('type', 'submit');
}

Be aware that this changes the type but not the value, so the button will still read "confirm".

A fiddle to prove it : http://jsfiddle.net/qeUxP/