Lucassith
Lucassith

Reputation: 49

ajax increases number of responses with each click

I've got simple ajax request (it just sends form) and it is called when I click the button. The problem is when I click login and it's failed, php does echo "FAIL" and when I click it again then php "echoes" it two times, then three times etc. It happens until I refresh the pages then "the counter" resets. It is inside $(document).ready() and it uses POST. My code:

EDIT#1 "CODE EDIT"

$('#register').click(function (event)
{
    if (true)
    {
        var frm = $('#registerForm');
        alert('debug1'); //DOESN'T REPEAT
        frm.submit(function (ev) // THIS FUNCTION REPEATS, DONT KNOW WHY.
        {
        alert('debug2'); //DOES REPEAT
            $.ajax(
            {
                type: frm.attr('method'),
                url: frm.attr('action'),
                data: frm.serialize(),
                success: function (text)
                {
                    $("#reg_dialog").dialog({
                    hide:{effect:"drop",duration: 1000}}).dialog('close');
                    $("#info").html(text).fadeIn(400).delay(2500).fadeOut(500,function(){
                        if(text!=="User Created"){
                        location.reload(); // THIS ONE RESETS "THE COUNTER" AS I SAID BEFORE, BUT I DONT WANT TO RELOAD WHOLE PAGE
                        }})
                }
            });
            ev.preventDefault();
            return false;
        });
    }

EDIT #2 (code explanation)

How I want this to work.

  1. User fills the form (this works)
  2. User clicks "Register" button, php does the database code (if everything is filled right the user is created)
  3. If there is an error like username taken php does echo "Username already taken"
  4. Now here is the problem. If user wants to use other username and he clicks "Register" and user-filled data is ok, the php does echo "User Created" and then "Username already taken". This is because ajax sends the form two times. If user have filled it wrong again and then right he gets "User Created" and 2x "Username already taken" and it goes like that over and over again until he refreshes the page.

Upvotes: 0

Views: 706

Answers (3)

NegroShaman
NegroShaman

Reputation: 1

A better solution for this would be

.one()

$(".foo").one('click',function() {
    //your code
});

Upvotes: 0

Dave Salomon
Dave Salomon

Reputation: 3297

You're binding to the Submit event multiple times. Before

frm.submit() 

use:

frm.unbind("submit");

Upvotes: 2

cleaver
cleaver

Reputation: 370

If your click handler is firing multiple times, it is binding to the click event more than once. You don't show how the code is being included on the page. To fix it, you need to engineer it so the click handler only binds once.

If you're having trouble having it bind only once, you could try using .unbind() to unbind any existing events before you bind the click handler again.

$('#register').unbind('click');
// this does the unbind
$('#register').click(function (event)
{
    // the rest of your code etc... 

Upvotes: 0

Related Questions