javascript - 从数据库中提取数据并在模态中显示

Question

我正在创建一个小型家谱网站。我在 mysql 数据库中有每个人的信息，我想在一个人点击任何人时弹出的模式中显示该信息。

不，我已经启动并运行了模态部分的所有 HTML 和 CSS。我还知道一些基本的 php 来编写一个相当简单的脚本来从我所做的数据库中提取信息(粘贴在下面)。但是我现在有两个问题:

1. 如何编写 sql 语句，以便 php 只提取该特定人员的信息。我不知道为数据库中的每个人编写一个 php 脚本。

树上的每个人都写为:

<a href="#" class="md-trigger" data-modal="modal-3">Tywin Lannister</a>

我的 sql 语句如下所示:

select * from family_table where name = Tywin Lannister;

我想知道如何替代对名称进行硬编码，以使 1 个 php 脚本适用于所有仅显示其信息的名称。

1. 我有一个基本的 php 脚本，可以提取一个人的所有信息并以相当简单的方式显示它。如何在样式和字体等完全相同的模态中显示该信息，而不被重定向到一个新的纯白色页面，并以简单的方式显示信息。我已经浏览了这里给出的答案，但它们涉及 javascript 和 Ajax，我对它们的了解为零

上面已经给出了我的名称 html。我的模式 HTML 如下:

<div class="md-modal md-effect-1" id="modal-3">
    <div class="md-content">
        <h3>Person Information</h3>
        <div>
            <ul>
                <li><strong>Name:</strong>Tywin Lannister.</li>
                <li><strong>DOB:</strong> 28th July 1994.</li>
                <li><strong>BirthPlace:</strong> Chicago.</li>
                <li><strong>Occupation:</strong> Student.</li>
                <li><strong>About:</strong> The Persons information will go here. Probably dynamic and deruved from a database.</li>
                <li><strong>Contact:</strong> Contact information with FB, twitter and email address.</li>
            </ul>
            <button class="md-close">Close me!</button>
        </div>
    </div>
</div>

我的php脚本如下:

<?php
$dbhost = 'localhost';
$dbuser = 'root';
$dbpass = 'password';
$conn = mysql_connect($dbhost, $dbuser, $dbpass);
if(! $conn )
{
  die('Could not connect: ' . mysql_error());
}
$sql = 'SELECT * from family_table';

mysql_select_db('family');
$retval = mysql_query( $sql, $conn );
if(! $retval )
{
  die('Could not get data: ' . mysql_error());
}
while($row = mysql_fetch_array($retval, MYSQL_ASSOC))
{
    echo "Name :{$row['Name']}  <br> ".
         "Nickname : {$row['Nickname']} <br> ".
         "Age : {$row['Age']} <br> ".
         "DOB : {$row['DOB']} <br> ".
         "About : {$row['About']} <br> ".
         "Contact : {$row['Contact Information']} <br> ".
         "--------------------------------<br>";
} 
echo "Fetched data successfully\n";
mysql_close($conn);
?>

Answer 1

有两种选择供您选择:1. 加载页面时，您需要加载人员的所有模式窗口，并根据您的决定给他们一个“我”。这是最简单的方法。2.这是更难但更好的方法，您可以使用ajax来加载人员信息。您可以通过创建一个 php 文件来接收人员 ID 或其他内容，然后回显其信息。这是一个例子:

.ajax({
    url : "URL to post the data to",
    type: "POST",
    data : person_id,
    success: function(data)
    {
        //$('#id of a div inside the modal').html(data);
     }
});