Change text on submit button after submission

问题:

Is it possible to change the text on the submit button after submission? Example the button has the word Submit and after the user submits the form, the button will now say Done. If so, how is it done?

Thanks!

回答1:

If you're using AJAX to process the form, you could simply have the button text change in the success callback of the $.ajax jQuery method like so:

$.ajax({
    ...
    success: function(data){
        ...
        // If using an <input/> as the submit button
        $('BUTTON_SELECTOR').prop('value', 'Done');

        // If using a <button/> as the submit button
        $('BUTTON_SELECTOR').text('Done');
        ...
    }
    ...
});

I hope this helps!

回答2:

Yes, it is possible & you can have it done with this:

<form name="MyForm">
<input type=button name="b1" value="Submit" onclick="javascript:document.MyForm.b1.value='Done'">
</form>

FIDDLE EXAMPLE HERE

回答3:

$('#id_of_button').click(function( event ) {
    $('#id_of_button').prop('value', 'Text you want to change to');
});

Edit: Actually, a better solution would probably be to bind it to the submit handler of the form.

回答4:

We can do by using the below code. It will make the submit button as 'Uploading please wait...' with the spinner icon.

<button name='button' type='submit' class='btn btn-primary right' data-disable-with="<i class='fa fa-spinner fa-spin'></i>Uploading please wait...">Save</button>