Ajax form only work one time

Question

My script is looking like this. Yes, it is from a plugin. No, I'm not comfortable with ajax.

How can I get this form to refresh and be able to take input once more after first submit?

<script>
jQuery(document).ready(function() { 
    var options = { 
        target: '#ps_output',      // target element(s) to be updated with server response 
        beforeSubmit:  showRequest,     // pre-submit callback 
        success:       showResponse,    // post-submit callback 
        url:           '<?php echo $link; ?>'         // since 2.8 ajaxurl is always defined in the admin header and points to admin-ajax.php     
}; 

    // bind form using 'ajaxForm' 
    jQuery('#thumbnail_upload').ajaxForm(options); 
});

function showRequest(formData, jqForm, options) {
    //do extra stuff before submit like disable the submit button
    jQuery('#ps_output').html('Sending...');
    jQuery('#submit-ajax').attr("disabled", "disabled");
}

function showResponse(responseText, statusText, xhr, $form)  {
    //do extra stuff after submit
    jQuery('#submit-ajax').attr("enabled", "enabled");
}
</script>

Thanks alot.

EDIT:

The callback function ends in die(). I read that was simply for being able to retrieve the output from the function. Does that end AJAX too?

Since wp plugin is in question, please send link to it, and - i would say that solution is in php files related to form processing. — sinisake, Jun 19 '13 at 12:39

score 1 · Accepted Answer · answered Jun 19 '13 at 12:46

1

To enable, you can set the disabled property to false.

jQuery('#submit-ajax').prop('disabled', false);

I would also change your code that disables it to;

jQuery('#submit-ajax').prop('disabled', true);

From the jQuery docs:

The .prop() method should be used to set disabled and checked instead of the .attr() method.

answered Jun 19 '13 at 12:46

MrCode

63,975
10
90
112

This works very well! Is it possible to clear the form without refreshing? – Martol1ni Jun 19 '13 at 13:05
If the server side is doing `die()`, it won't matter because you aren't doing anything with the response anyway, provided the server is not quitting before it completes its processing – MrCode Jun 19 '13 at 13:06
You can reset the form by using: `$('#thumbnail_upload').trigger('reset');`. See here for more methods of resetting: http://stackoverflow.com/questions/6653556/jquery-javascript-function-to-clear-all-the-fields-of-a-form – MrCode Jun 19 '13 at 13:11

score 0 · Answer 2 · answered Jun 19 '13 at 12:38

0

Use

jQuery('#submit-ajax').removeAttr("disabled");//to remove disabled attribue

instead of

jQuery('#submit-ajax').attr("enabled", "enabled");

answered Jun 19 '13 at 12:38

bugwheels94

30,681
3
39
60

Ajax form only work one time

2 Answers2

Linked