Before i begin I believe this is not a dublicate at first.

Here's my problem:

I have a chatroom php script that i use ajaxForm jQuery plugin in order to send new messages without reloading the whole page.

The fact is that posting takes about 1-2 secs with times: e.g

Blocking:6ms

Sending:1ms

Waiting:1.15 sec

Recieving 1ms

$('#myform').ajaxForm(function() {
    //clear form after this
    $('#myform').clearForm();
});

The form is cleared after te recieving time,meaning it takes about 1.20sec to clear each message i send... and it seems like the chat lags for a bit.

I am trying to figure out a way to clear the form after the Sending part,without callback or something.

Before i begin I believe this is not a dublicate at first.

Here's my problem:

I have a chatroom php script that i use ajaxForm jQuery plugin in order to send new messages without reloading the whole page.

The fact is that posting takes about 1-2 secs with times: e.g

Blocking:6ms

Sending:1ms

Waiting:1.15 sec

Recieving 1ms

$('#myform').ajaxForm(function() {
    //clear form after this
    $('#myform').clearForm();
});

The form is cleared after te recieving time,meaning it takes about 1.20sec to clear each message i send... and it seems like the chat lags for a bit.

I am trying to figure out a way to clear the form after the Sending part,without callback or something.

• javascript
• php
• jquery
• chat

• Is #mydiv a div that contains a form? – BenM Commented Jan 12, 2014 at 20:02
• actually is the name of the form sorry, my mistake – user3127632 Commented Jan 12, 2014 at 20:03
• OK, so the form has an ID of #mydiv? – BenM Commented Jan 12, 2014 at 20:03
• yes (changed to myform) – user3127632 Commented Jan 12, 2014 at 20:06

4 Answers 4

If ajaxForm is working fine, you can do:

$('#myform').ajaxForm({
    beforeSubmit:  function() {
       $('#myform').clearForm();    //Call the reset before the ajax call starts
    },
    success: function(data){
       //Your normal callback here
    }
});

(If $('#myform').clearForm() didn't work use $('#myform')[0].reset();)

Hope this helps. Cheers

$('#mydiv').ajaxForm(function() {
   //...
    $("#mydiv")[0].reset();
});

I've never used ajaxForm, but just using the browser's reset() function on the <form> element should suffice (I'm assuming that ajaxForm returns a jQuery instance):

$('#myform').ajaxForm(function() {
    this.reset();
});

If the above throws a has no method reset() error, try this:

$('#myform').ajaxForm(function() {
    $('#myform')[0].reset();
});

If you have problems with ajaxForm. You could avoid ajaxForm with the following:

$(".ajaxform").submit(function(event){
   var $form = $(this);
   event.preventDefault();
   $form.get(0).reset();   //Call the js reset method before ajax starts
    $.ajax({
        url: $form.attr("action"),
        type: $form.attr("method"),
        data: $form.serialize(),
        success: function(data){
           //your code when response arrived here
        }
    });
});

Hope this helps. Cheers