Как я могу выполнять свою позицию на странице при обновлении (AJAX)

Я знаю, что это возможно только с AJAX, но я никогда не работал с AJAX … На моем сайте вы можете сохранить список карт, которые у вас есть в игре Magic, это вполне полный список. Вы должны нажать кнопку, чтобы добавить карту, каждая карта имеет эту кнопку, и когда вы ее добавите, она добавит карту в ваш список, а затем обновится и снова будет в верхней части страницы. Как я могу сделать так, чтобы он сохранил свою позицию?

Внутри красных квадратов вы можете нажать добавить или удалить: http://prntscr.com/5uq6ak

• Флажок внутри флажка в раскрывающемся списке
• Не удалось выполнить запрос AJAX POST на ту же страницу (с примером)
• Передача данных- * в bootstrap Modal
• Как получить точное имя и версию браузера?
• перезагрузите страницу с помощью ajax, чтобы создать живой чат

Functions.php (я буду показывать только 2 функции, удалять и добавлять карты)

//Add card to collection function addCardToCollection($conn, $userID, $cardID){ //Checks if the cards is already added for this user $queryGetCard = 'SELECT user_id, card_id FROM collection WHERE user_id = '.$userID.' AND card_id = '.$cardID; $checkCollection = $conn->query($queryGetCard); if($checkCollection->fetch_assoc() > 0){return 'Deze kaart hebt u al.';} //Adds card to the database $queryAddCard = 'INSERT INTO collection (user_id, card_id) VALUES ('.$userID.','.$cardID.')'; if($conn->query($queryAddCard)){return 'Kaart toegevoegd.';} else{return 'Kaart niet toegevoegd.';} } //Remove card from collection function removeCardFromCollection($conn, $userID, $cardID){ //Checks if the cards is in the collection $queryGetCard = 'SELECT user_id, card_id FROM collection WHERE user_id = '.$userID.' AND card_id = '.$cardID; $checkCollection = $conn->query($queryGetCard); if($checkCollection->fetch_assoc() == 0){return 'Deze kaart hebt u nog niet.';} //Remove card from the database $queryAddCard = 'DELETE FROM collection WHERE user_id = '.$userID.' AND card_id = '.$cardID; if($conn->query($queryAddCard)){return 'Kaart verwijderd uit uw collectie.';} else{return 'Kaart niet verwijderd uit uw collectie.';} } 

Set.php (кнопки для добавления и удаления)

 if(login_check($mysqli) == true) { $cardsHTML.='<br><b>Deze kaart heb ik... <a href="' . $baseURL . 'set.php?id=' . $_GET['id'] . '&cardID=' . $value['id'] . '&collection=add"> <div class="glyphicon glyphicon-ok green"></div> </a> | <a href="' . $baseURL . 'set.php?id=' . $_GET['id'] . '&cardID=' . $value['id'] . '&collection=remove"> <div class="glyphicon glyphicon-remove red"></div> </a> </b>'; } 

 $(document).ready(function(){ var storePosition = { /// initializing the storeposition topCoordinate : null } storePosition.topCoordinate = $(this).offset().top; /// storing the position if(storePosition.topCoordinate !== 0){ // if we are at the top no point doing anything $("html, body").animate({"scrollTop": storePosition.topCoordinate}, 500); } });