user4419336
user4419336

Reputation:

When click on div multiple times will not refresh: Only refreshes once

When I click on my button I it can refresh div once fine but if I go to click it again will not refresh div.

I have to reload page by clicking on F5

Question: How ever many times I decied to click on my button How can make it to be able to refresh the #rep div?

success: function(response){
    if (response.success == true) {
        //window.location.reload();
        $('#rep').load(window.location.href + ' #rep');
    } 
}  

Full Script

<script type="text/javascript">
$(document).ready(function() {
    $('#vote-up-icon').on('click', function(e) {
        e.preventDefault();
        $.ajax({
            url: "<?php echo base_url('thread/voteup/');?><?php echo $thread_id;?>",
            type: 'post',
            dataType: 'json',
            data: {
                voteup: $(this).parent().find('#vote_up').val()
            },
            success: function(response){
                if (response.success == true) {
                    //window.location.reload();
                    $('#rep').load(window.location.href + ' #rep');
                } 
            }  
        });
    });
});     
</script>

HTML

<div class="col-lg-2 col-md-2 col-sm-2 col-xs-12 text-center">
<div id="rep">

<div class="form-group">
<i class="fa fa-chevron-up fa-2x" id="vote-up-icon" aria-hidden="true" style="cursor: pointer;"></i>
<input type="hidden" name="vote_up" id="vote_up" value="1" />
</div>

<div class="form-group" class="votes">
<?php echo $thread_votes;?>
</div>

<div class="form-group">
<i class="fa fa-chevron-down fa-2x" id="vote-down-icon" aria-hidden="true" style="cursor: pointer;"></i>
<input type="hidden" name="vote_down" id="vote_down" value="0" />
</div>

</div>
</div>

Upvotes: 1

Views: 653

Answers (1)

user4419336
user4419336

Reputation:

Solution

Thanks to A. Wolff and every one else

<script type="text/javascript">
$(document).ready(function() {
    $('#rep').on('click', '#vote-up-icon', function(e) {
        e.preventDefault();
        $.ajax({
            url: "<?php echo base_url('thread/voteup/');?><?php echo $thread_id;?>",
            type: 'post',
            dataType: 'json',
            data: {
                voteup: $(this).parent().find('#vote_up').val()
            },
            success: function(response){
                if (response.success == true) {
                    $('#rep').load(window.location.href + ' #rep');
                } 
            }  
        });
    });
});     
</script>

Upvotes: 1

Related Questions