Question

I have put together an ajax powered chat/social network with jquery, PHP – but am having problems with the javascript.

I have a js file in the main page which loads the php in a div container, the js file is underneath the div. But only one function for posting a msg seems to work but the others do not.

I have tried including the js file with the dynamically loaded php at the end of the ajax load the functions work fine but am getting mutiple entries of the same message/comment.

I am pretty sure its not the PHP as it seems to work fine with no ajax involvment. Is there a way to solve this?

this is the function that works fine:

$("#newmsgsend").click(function(){

    var username = $("#loggedin").html();
    var userid = $("#loggedin").attr("uid");
    var message = $("#newmsgcontent").val();

    if(message == "" || message == "Enter Message..."){
        return false;
    }

    var datastring = 'username=' + username + '&message=' + message + '&uid=' + userid;

    //alert(datastring);

    $.ajax({
        type: "POST",
        url: "uploadmsgimage.php",
        data: datastring,

        success: function(data){
            document.newmessage.newmsgcontent.value="";

            //need to clear browse value too
            $('.msgimage').hide('slow');
            $('#addmsgimage').show('slow');
            $(".usermsg").html(data);
            $("#control").replaceWith('<input type="file" name="file"/>');
            $(".msgimage").remove();
        }
    });
});

And this is one of them that does not work:

//like btn
$(".like").click(function(){

    var postid = $(this).attr("pid");

    var datastring = 'likeid=' + postid;

    $.ajax({
        type: "POST",
        url: "addlike.php",
        data: datastring,
        success: function(data){
            $(".usermsg").html(data); 
        }
    });
});

Answer 1

From your post, I’m guessing that each message has a “Like” button, but you have 1 main submit button. When messages load dynamically, you have to assign the .like to each one when they come in, otherwise it will only be assigned to the existing messages.

The problem, from what I gather (and this is a guess) would probably be fixed using live so jQuery will automatically assign the click function to all messages including dynamically loaded messages; so instead of:

$(".like").click(function(){

Try this:

$(".like").live('click', function(){

If that doesn’t solve the problem, then I’m probably not understanding what it is.