jQuery Ajax Form Submit Repeating Problem/Questions

jQuery Ajax Form Submit Repeating Problem/Questions

First, a general question, as I think my understanding of this is incorrect.

I have a page that shows a lot of different information . . . kind of a forum.

I'm using jQuery/Ajax/PHP to update sections of the page. In one section users can respond to a comment. There might be ten comments and multiple responses under each comment so with each comment there is a small form to enter information. When a user enters their response that section "refreshes" using Ajax and an Ajax file (i.e. a different file for the same information than the one that is used when the page first loads).

When building this I noticed that my jQuery code in an external .js file would not work in the loaded Ajax file, i.e. I had to duplicate the jQuery code in the loaded file. That's the first question. That doesn't seem right to me. Why would I need to repeat it? And if I don't why is not working in the loaded Ajax file?

Secondly, this has caused problems with the form (I think this is why) - - - it repeats entries - - - sometimes - - - and sometimes exponentially, the longer I stay on the page without a page refresh the more entries it will make . . .

Here's the code to submit my form:


  1. var $tweetSubmitBtn = $('#member-profile .tweet_form .submit_tweet_response');

    $tweetSubmitBtn.click(function(event) {
        if(this == event.target)
        {
            var tweet_id = $(this).siblings('.tweet_id').attr('value');
            var ss = $(this).siblings('.ss').attr('value');
            var npnp = $(this).siblings('.npnp').attr('value');
            var what_tweets = $(this).siblings('.what_tweets').attr('value');
            var tweet_response = $(this).siblings('.tweet_textarea').attr('value');
            var submit_tweet_response = $(this).siblings('.submit_tweet_response').attr('value');
            var user_id2 = $(this).siblings('.user_id2').attr('value');
            var comments_id = $(this).siblings('.comments_id').attr('value');
            var url_destination;
            var success_id;
           
           
            var data_string = 'tweet_id=' + tweet_id + '&ss=' + ss + '&npnp=' + npnp +
            '&what_tweets=' + what_tweets + '&tweet_response=' + tweet_response +
            '&submit_tweet_response=' +  'submit_tweet_response' + '&user_id2=' +  user_id2 + '&comments_id=' +  comments_id;
           
            if(what_tweets == 'ticker_mine')
                {
                    url_destination =     'profile-posts-ticker-1.php';
                    success_id = '#ticker_mine';
                   
                }
            else
                {
                    url_destination =     'profile-posts-ticker-2.php';
                    success_id = '#ticker_all';
                }
       
            $.ajax({
                type: "POST",
                url: 'ajax_process/'+url_destination,
                data: data_string,
                dataType: "html",
                success: function(data) {
                    $(success_id).html(data);
                   
                }
               
             });
             return false;
        }
    });

















































As I say, it updates fine, it submits fine, it submits the correct response to the appropriate comment fine, it's just that with this code repeated I assume it's causing the multiple submits so that I get sometimes 8 responses to a comment with the exact same response . . . I can see the Ajax file "refreshing" in the background for each submit.

Anyway, I spent hours on this yesterday . . . any help would be appreciated.