How to run a href in background to update database php like button

Question

I want this <a href> to run href in background onclick using ajax jquery. I tried to do it but i don't know jquery nicely.

<a href="https://www.username.com/liked/$profile->profile_id " class="btn btn-outline-dark btn-sm"><i class="far fa-thumbs-up me-1"></i>Like</a>

This is the code that needed it please tell me where the function should be placed and the jquery code to send this href in ajax jquery. And it show be in loop of changing href path betweeen the click of button like example.com/like/1 on first click and example.com/unlike/1 on second click and the loop continue making the multiple press of button possible.

What did work, what did not work? "I want code" is no question. Where is $profile->profile_id coming from? You also need to return false to the onclick immediately, not from the callback. — volkerschulz
– volkerschulz, Commented Oct 14, 2023 at 15:00
thisLike will be a string, not a reference to a form element, so calling serialize() on that isn't going to work. — Rory McCrossan
– Rory McCrossan, Commented Oct 14, 2023 at 15:11
Same applies to attr('href'). You probably meant to put onclick='eachlike(this)' — volkerschulz
– volkerschulz, Commented Oct 14, 2023 at 15:34
$profile->profile is coming from controller and contain the id of the specific profile. — SHAUJANYA -ALL I KNOW TO YOU
– SHAUJANYA -ALL I KNOW TO YOU, Commented Oct 14, 2023 at 15:48

volkerschulz · Accepted Answer · 2023-10-16 16:44:41Z

0

Here's the sample code you've asked for. There are two link elements with different href attributes. When clicked, an ajax request will be fired to whatever is specified as the href and on success the respective span will be filled with a string and be shown for 3 seconds.

<a onclick='return eachlike(this)' href="https://www.jamarkoho.com/liked/1" class="btn btn-outline-dark btn-sm">
    <i class="far fa-thumbs-up me-1"></i>
    Like <span class="here"></span>
</a>

<a onclick='return eachlike(this)' href="https://www.jamarkoho.com/liked/2" class="btn btn-outline-dark btn-sm">
    <i class="far fa-thumbs-up me-1"></i>
    Like <span class="here"></span>
</a>

<script>
    function eachlike(thislike) {
        $.ajax({
            type: 'GET',
            url: $(thislike).attr('href'),
            success: function(response) {
                $(thislike).find('.here').html('Done!').show().delay(3000).fadeOut();
            }
        });
        return false;
    }
</script>

To actually toggle the href (like / unlike), use something like this:

<a onclick='return eachlike(this)' href="https://www.jamarkoho.com/liked/1" data-toggle-href="https://www.jamarkoho.com/unlike/1" class="btn btn-outline-dark btn-sm">
    <i class="far fa-thumbs-up me-1"></i>
    Like <span class="here"></span>
</a>

<a onclick='return eachlike(this)' href="https://www.jamarkoho.com/liked/2" data-toggle-href="https://www.jamarkoho.com/unlike/2" class="btn btn-outline-dark btn-sm">
    <i class="far fa-thumbs-up me-1"></i>
    Like <span class="here"></span>
</a>

<script>
    function eachlike(thislike) {
        $.ajax({
            type: 'GET',
            url: $(thislike).attr('href'),
            success: function(response) {
                $(thislike).find('.here').html('Done!').show().delay(3000).fadeOut();
                toggleHref(thislike);
            }
        });
        return false;
    }
    function toggleHref(thislike) {
        let currentHref = $(thislike).attr('href');
        let newHref = $(thislike).data('toggle-href');
        $(thislike).attr('href', newHref);
        $(thislike).data('toggle-href', currentHref);
    }
</script>

The second function toggles between href and new attribute data-toggle-href.

edited Oct 16, 2023 at 16:44

answered Oct 14, 2023 at 16:39

volkerschulz

2,2121 gold badge8 silver badges28 bronze badges

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

24 Comments

SHAUJANYA -ALL I KNOW TO YOU Over a year ago

this is working fine but how to make the link on href to get change into like and unlinke links in multiple click? Like first click href='ccc/liked/1' and second 'cc/unlike/1' and same loop continues?

volkerschulz Over a year ago

Could you do me a favor and post a new question for this? There are multiple ways and it might be of help to others to outline them not in a comment but in an answer. It's hard to put code here. Put the link to the new question here in the comments.

SHAUJANYA -ALL I KNOW TO YOU Over a year ago

i would surely do that but my profile isn't supported for another another by stackoverflow.

volkerschulz Over a year ago

You should probably edit and improve your question then! stackoverflow.com/help/question-bans

volkerschulz Over a year ago

But I'm going to see if I can extend my answer above later today.

|

Collectives™ on Stack Overflow

How to run a href in background to update database php like button

1 Answer 1

24 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

24 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related