Applying a javascript code for two different php pages

Question

In my project I have this code who takes results from mysql query and put it into comment DIV and a jquery code who takes me more results when I scroll down my page via a another page code

 <body>
<div id="container">
 <div class="comment">
  <div id="comm">
  </div>
 </div>
</div>
<script type="text/javascript">

$(document).ready(function(){ 

var offset = $('.comment:last').offset(); 

$(window).scroll(function(){ 
    if((offset.top-$(window).height() <= $(window).scrollTop()) 
    && load==false && ($('.comment').size()>=5) && 
    ($('.comment').size()!=$('.nb_com').text())){

        var theme = $('.comment').attr('idtheme');
            $.ajax({
            url: 'ajax_scroll.php',
            type: 'get',
            data: 'theme='+theme,

            success: function(data) {

                $('.comment:last').after(data);
                offset = $('.comment:last').offset();

            }
        });
    }


});

});

</script>

I would like to apply this javascript below for my comment DIV but it works only for the DIVS before I scroll down the page

$('#confirmdelete a').click(function(){

 var id_comm=$(this).attr('id');
 if(confirm("Delete?")) {
 $.ajax({
    url: 'commentsdelete.php',
    type: 'post',
    async: false,
    data:{
     'id_comm': id_comm

    },
    success:function(){

    }

    });
}
else
{
  }      

 return false;
});

How I can apply this javascrip code for all the DIVs (before scrolling and after scrolling)

Thanks.

Apply the event listener to an container element, and than go back in the propagation chain or reassign the eventlistener everytime you add an element — Jonas Wilms
– Jonas Wilms, Commented Nov 8, 2016 at 18:05
Thanks Jonas for your help, I'm not a professional in jquery. How can I do That? — simo9900
– simo9900, Commented Nov 8, 2016 at 18:08

Jonas Wilms · Accepted Answer · 2016-11-08 18:53:58Z

1

Solution 1:

Add your click function to the global scope, if the content is changed reassign:

var onclickfunc=function(){
alert("clicked");
}
$('#confirmdelete a').click(onclickfunc);

//later in your ajax
sucess:function(data){
//add the content
//reassign:
  $('#confirmdelete a').click(onclickfunc);
}

Solution 2(even better):

Detect if a parent element was clicked, and than check if it was a confirmdelete element:

$(document).on("click","#confirmdelete a",function(){
//yourcode here
});

See: http://api.jquery.com/on/

edited Nov 8, 2016 at 18:53

answered Nov 8, 2016 at 18:47

Jonas Wilms

139k20 gold badges164 silver badges164 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

simo9900 Over a year ago

Thanks for your help. The second solution is much easier.

Collectives™ on Stack Overflow

Applying a javascript code for two different php pages

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related