Javascript How to automatically change word when click without need to refresh browser.?
- by Fakhrul Zakry
im quite lost here and not really expert about javascript. I want to change the content when user click with "Thanks for vote" automatically without need to refresh the page.
Here is my html:
{% if poll.privacy == "own" and request.user.get_profile.parliment != poll.location %}
You do not have permission to vote this.
{% else %}
{% if has_vote %}
{% if poll.rating_option == '1to5' %}
<div class="rate">
<div id="poll-rate-{{ poll.pk }}"></div>
</div>
{% else %}
Thanks for your vote.
{% endif %}
{% else %}
{% if poll.rating_option == 'yes_no' %}
<a href="javascript:void(0)" class="rate btn btn-xs btn-success mr5 vote-positive" rel="{% url 'vote_vote' poll.pk 1 %}" alt="{{ poll.pk }}">Yes</a>
<a href="javascript:void(0)" class="rate btn btn-xs btn-danger vote-negative" rel="{% url 'vote_vote' poll.pk 0 %}" alt="{{ poll.pk }}">No</a>
{% elif poll.rating_option == 'like_dislike' %}
<a href="javascript:void(0)" class="rate btn btn-xs btn-success mr5 vote-positive" rel="{% url 'vote_vote' poll.pk 1 %}" alt="{{ poll.pk }}">Like</a>
<a href="javascript:void(0)" class="rate btn btn-xs btn-danger vote-negative" rel="{% url 'vote_vote' poll.pk 0 %}" alt="{{ poll.pk }}">Dislike</a>
{% elif poll.rating_option == '1to5' %}
<div class="rate">
<div id="poll-rate-{{ poll.pk }}"></div>
</div>
{% endif %}
{% endif %}
{% endif %}
and here is my javascript:
function bindVoteHandler() {
$('a.vote-positive, a.vote-negative').click(function(event) {
event.preventDefault();
var link = $(this).attr('rel');
var poll_pk = $(this).attr('alt');
var selected_div = $(this).parent('div');
selected_div.html('<img src="{{ STATIC_URL }}img/loading_small.gif" />');
$.ajax(link).done(function( data ) {
var result_div = $('div#vote-result-'+poll_pk);
result_div.html(data);
result_div.removeClass('vote-result-grey-out');
selected_div.html('<small>Thanks for your vote.</small>');
});
});
};
did anyone know what is the problem why i need to refresh my page after Like/Vote/rate to make it become (Thanks For your vote) ?
please someone know help or share link with me.
Below is the image:
before click Like:
after click Like:
then when refreshed the word just displayed, it supposed automatically display when click Like.
Thank you in advance..
