Hide add button after clicking it.

I have a repeat region list that shows a lot of "items" as images. Each item has an "add" button.

When the user presses "add", this ID is written to another table together with the ID of the currently logged in user.

At the same time, I want this "item", which has just been added - to "disappear" from the list, immediately after clicking the add button. The user then gets the feeling that it has been added and that you cannot accidentally add it again. An item can only be added once per user.

Everything works as I intended, but not to get rid of the current item immediately after clicking add button. It works if you refresh the page, then the item that has just been added disappears. But I do not want this. Because then, you end up at the top of the list, and not in the same place as the current "item" was. This is not user friendly - because the user has to scroll down again.

Do you have any suggestions on how to achieve this?

You can probably just add an onclick event to the button like:

onclick="this.style.display='none'"

or

onclick="this.parentNode.parentNode.style.display='none'"

Thanks for reply.
I thought I wrote the query correctly. But something is wrong here. The idea is that if an article is selected by logged in user - then the "add" button for that article, will disappear. But for some reason my query repeats the article as many times as any user has added it. However, the "add" button on one of them disappears. Of course, I only want to show the same article once, not several. I have tried to change the join statement on "bucMylist", but without success.

Here is my query:
<?php
$WADAbuckets = new WA_MySQLi_RS("WADAbuckets",$bucketListHub,0);
$WADAbuckets->setQuery("SELECT bucBuckets.buc_id, bucBuckets.buc_name, bucBuckets.buc_description, bucBuckets.buc_minAge, bucBuckets.buc_maxAge, bucCategories_translation.cattra_name AS bucCategories_translation_cattra_name, bucBudget.bud_name AS bucBudget_bud_name, bucCountry_translation.coutra_name AS bucCountry_translation_coutra_name, bucCity.cit_name AS bucCity_cit_name, bucDifficulty.dif_ID AS bucDifficulty_dif_ID, bucDifficulty.dif_name AS bucDifficulty_dif_name, bucBucketCollections.*, bucCollections.col_name, bucPercitipatingDegree.per_name, bucImages.ima_link, bucMylist.* FROM bucBuckets LEFT OUTER JOIN bucCategories_translation ON bucBuckets.buc_cattraID = bucCategories_translation.cattra_id LEFT OUTER JOIN bucBudget ON bucBuckets.buc_budID = bucBudget.bud_id LEFT OUTER JOIN bucCountry_translation ON bucBuckets.buc_couCode = bucCountry_translation.coutra_couCode LEFT OUTER JOIN bucCity ON bucBuckets.buc_citID = bucCity.cit_id LEFT OUTER JOIN bucDifficulty ON bucBuckets.buc_difID = bucDifficulty.dif_ID LEFT OUTER JOIN bucBucketCollections ON bucBuckets.buc_id = bucBucketCollections.collectionBucketBucket_ID LEFT OUTER JOIN bucCollections ON bucBucketCollections.collectionBucketCollection_ID = bucCollections.col_id LEFT OUTER JOIN bucPercitipatingDegree ON bucBuckets.buc_perID = bucPercitipatingDegree.per_ID LEFT OUTER JOIN bucImages ON bucBuckets.buc_id = bucImages.ima_bucID LEFT OUTER JOIN bucMylist ON bucBuckets.buc_id = bucMylist.myl_bucID ORDER BY bucBuckets.buc_name ASC");
$WADAbuckets->execute();
?>

Use a DISTINCT or GROUP BY statement to limit the results in your SQL

This post has been deleted.

I have reduce the query. Can you give me some more tips on how to get rid of the duplicates?
Thanks in advance

Add: GROUP BY buc_id

This post has been deleted.

I have been studying and experimenting about this all weekend. But I can not make it work. I have tried GROUP BY, CONCAT, and DISTINCT - but I can not get the whole query. Can anyone help me sort this out?

What I want: I only want to view each article once, even if it has been selected by multiple users.
Here is my query:
<?php
$WADAbuckets = new WA_MySQLi_RS("WADAbuckets",$bucketListHub,0);
$WADAbuckets->setQuery("SELECT bucBuckets.buc_id, bucBuckets.buc_name, bucBuckets.buc_description, bucBuckets.buc_minAge, bucBuckets.buc_maxAge, bucCategories_translation.cattra_name AS bucCategories_translation_cattra_name, bucBudget.bud_name AS bucBudget_bud_name, bucCountry_translation.coutra_name AS bucCountry_translation_coutra_name, bucCity.cit_name AS bucCity_cit_name, bucDifficulty.dif_ID AS bucDifficulty_dif_ID, bucDifficulty.dif_name AS bucDifficulty_dif_name, bucBucketCollections.*, bucCollections.col_name, bucPercitipatingDegree.per_name, bucImages.ima_link, bucMylist.* FROM bucBuckets LEFT OUTER JOIN bucCategories_translation ON bucBuckets.buc_cattraID = bucCategories_translation.cattra_id LEFT OUTER JOIN bucBudget ON bucBuckets.buc_budID = bucBudget.bud_id LEFT OUTER JOIN bucCountry_translation ON bucBuckets.buc_couCode = bucCountry_translation.coutra_couCode LEFT OUTER JOIN bucCity ON bucBuckets.buc_citID = bucCity.cit_id LEFT OUTER JOIN bucDifficulty ON bucBuckets.buc_difID = bucDifficulty.dif_ID LEFT OUTER JOIN bucBucketCollections ON bucBuckets.buc_id = bucBucketCollections.collectionBucketBucket_ID LEFT OUTER JOIN bucCollections ON bucBucketCollections.collectionBucketCollection_ID = bucCollections.col_id LEFT OUTER JOIN bucPercitipatingDegree ON bucBuckets.buc_perID = bucPercitipatingDegree.per_ID LEFT OUTER JOIN bucImages ON bucBuckets.buc_id = bucImages.ima_bucID LEFT OUTER JOIN bucMylist ON bucBuckets.buc_id = bucMylist.myl_bucID ORDER BY bucBuckets.buc_name ASC");
$WADAbuckets->execute();
?>
------
Then a message to WebAssist: There seems to be a bug in QueryBuilder when using DISTINCT. I get an error message:
Error Inspecting SQL
• table alias not found: DISTINCT bucMylist
These values will be automatically removed the next time you use the visual editor or advanced tab to edit your SQL.

I get this error after writing this:
SELECT GROUP_CONCAT (DISTINCT bucMylist.myl_bucID) AS myl_bucID, bucBuckets.buc_id, bucBuckets.buc_name
FROM bucMylist INNER JOIN bucBuckets ON bucMylist.myl_bucID = bucBuckets.buc_id
GROUP BY bucMylist.myl_bucID

When a user adds an article, what table is inserted into? Do you need to include that table in your recordset? The easiest solution would be to remove that table JOIN from the recordset.