当'添加'时,如何将传递的变量存储到数据库中单击按钮?

时间:2018-05-29 14:53:32

标签: php html mysql database

我最近刚刚开始编码,所以任何帮助都会受到赞赏。我正在练习在线读书俱乐部,并使用谷歌图书获取每本书的ISBN代码。

<?php 
$ISBN = $_GET['isbn'];
?>

这些图书通过上一页传递的ISBN代码显示其信息。

<script>
//script to find the book details for the ISBN passed
function findBook(postedISBN)
{ 
var findISBN = postedISBN;



//if ISBN not passed, display error
if(findISBN == null)
{
    alert("No ISBN!");
}
//else if ISBN passed correctly, find its details using the Google Books API and display them
else
{   
    //JQuery call to Google Books API passing in the ISBN
    $.get("https://www.googleapis.com/books/v1/volumes?q=isbn:" + findISBN,function(response)
    {
        for(i=0;i<response.items.length;i++)
        {
            //get values needed and store in variables - this is just a small selection of all available - you should modify this to get the details you want to display on the page
            var title=response.items[i].volumeInfo.title;  
            var subtitle=response.items[i].volumeInfo.subtitle;  
            var publishedDate=response.items[i].volumeInfo.publishedDate;  
            var description=response.items[i].volumeInfo.description;
            var averageRating=response.items[i].volumeInfo.averageRating;
            var imageLinks= response.items[i].volumeInfo.imageLinks;
            var infoLink = response.items[i].volumeInfo.infoLink

            //set values of HTML fields to the values found in API
            document.getElementById("isbn").innerHTML = findISBN;
            document.getElementById("title").innerHTML = title;
            document.getElementById("subtitle").innerHTML = subtitle;
            document.getElementById("publishedDate").innerHTML = publishedDate;
            document.getElementById("description").innerHTML = description;
            document.getElementById("averageRating").innerHTML= averageRating;
            document.getElementById("infoLink").innerHTML= infoLink;




        }
    }); 
}//else 
}//findBook

</script>

我现在希望允许用户将ISBN代码中的书籍存储到MySQL数据库中,当他们点击“添加到&#39;我想要阅读&#39;按钮。

数据库表名为bookswantstoread; bookswantstoreadID,userID,ISBN。 bookdetails.php页面的代码

  <!-- call the findBook function when the page loads -->
    <script> window.onload=findBook(<?php echo $ISBN;?>); </script>


<!--HTML elements in which book values go -->

    <div style="font-family: arial" class="container">  

<p id="label1"><b>ISBN: </b></p>
<p id="isbn"></p>
<p id="label2"><b>Title: </b></p>
<p id="title"></p>
<p id="label3"><b>Subtitle: </b></p>
<p id="subtitle"></p>
<p id="label4"><b>Published Date: </b></p>
<p id="publishedDate"></p>
<p id="label5"><b>Description: </b></p>
<p id="description"></p>
<p id="label6"><b>Average Rating</b></p>
<p id="averageRating"></p>


<a class="btn btn-primary btn-xl text-uppercase js-scroll-trigger" href="wanttoread.php">Add to 'Want to Read'</a>



</body>

</html>

我的问题基本上是当用户点击按钮“添加到想要阅读”时,如何将传递的变量(ISBN)存储到数据库表(bookswantstoread)中。

1 个答案:

答案 0 :(得分:0)

请在您的代码中进行此修改。 (我添加了一个类并更新了href)

<a class="btn btn-primary btn-xl text-uppercase js-scroll-trigger ajax-link" href="wanttoread.php?id=<?php echo $ISBN;?>">Add to 'Want to Read'</a>



</body>

</html>

然后在wanttoread.php中,编写插入查询。假设你有jquery,添加这个脚本。

$( '.ajax-link' ).on( 'click', function( e) {
  e.preventDefault();
  $.ajax({url: $(this).href, success: function(result){
            $(this).html("Added to List!");
        }});
});