jquery dialog post being duplicated

The first time i make a post, the post submits fine. I then close the dialog window and click link to reopen and when i submit data again, it duplicates it and adds it twice. This behaviour just seems to keep adding a duplidcte each time. for example, post1 then post1+post1 then post1+post1+post1. I have to keep refreshing the browser to make a post. Hope you get the idea. If someone could check my code, i would be grateful. Many thanks

// Feedback form

function feedbacknew() {

    $("#fb_form").dialog({
        autoOpen: false,
        resizable: true,
        modal: true,
        title: 'Submit a feedback request',
        width: 480,
        beforeclose: function (event, ui) {
            $("#fb_message").html("");


        },
        close: function (event, ui) {
            $("#fb_message").html("");
            $("#feedback").get(0).reset();
            $("#fb_form").dialog('close');

        }

    });

    $('#fb_submit').live('click', function () {

        var name = $('#fb_uname').val();
        var client = $('#fb_client').val();
        var department = $('#fb_department').val();
        var email = $('#fb_email').val();
        var position = $('#fb_position').val();
        var feedback = $('#fb_feedbacknew').val();
        var data = 'fb_uname=' + name +开发者_运维百科
                   '&fb_client=' + client +
                   '&fb_department=' + department +
                   '&fb_email=' + email +
                   '&fb_position=' + position +
                   '&fb_feedbacknew=' + feedback;
        $.ajax({
            type: "POST",
            url: "feedback.php",
            data: data,
            success: function (data) {

                $("#feedback").get(0).reset();
                $('#fb_message').html(data);


                $("#flex1").flexReload();

            },
            error:function (xhr, ajaxOptions, thrownError){
                    alert(xhr.status);
                    alert(thrownError);
                }    
        });
        return false;

    });

    $("#fb_form").dialog('open');

}

I would add an alert into your click function to see how many times it is being called. If it is being called the correct amount of times, then you aren't clearing one of your elements correctly and each successive call is appending the data rather then setting it. You will be able to narrow down the problem at least this way

Change the .live() methods.

If you are using a new version of jquery you may use .on(). if not use directly .click() as follow:

$('#fb_submit').click(function () { ....

make sure to destroy the pop up after you close the popup . Because when a div is popped up, it's taken out of the html and appended to the end of body. after an ajax call, a new div is generated to fill in the original div's place. using destroy can place the div back to it's original place and no new div is generated to fill in the original div's place.

destroy() Removes the dialog functionality completely. This will return the element back to its pre-init state. This method does not accept any arguments. Code examples: Invoke the destroy method:

1 $( ".selector" ).dialog( "destroy" );