[英]To display data in the fields in the modal retrieved from the mysql database
[英]Extract data from Database and display in Modal
我有一個正在創建的小型家譜網站。 我在mysql數據庫中擁有每個人的信息,我想在一個人單擊任何人時彈出的模態中顯示該信息。
不,我已為模式部分啟動並運行了所有HTML和CSS。 我也知道一些基本的PHP可以編寫一個相當簡單的腳本來從我所做的數據庫中提取信息(粘貼在下面)。 但是我現在有兩個問題:
樹上的每個人都寫成:
<a href="#" class="md-trigger" data-modal="modal-3">Tywin Lannister</a>
和我的SQL語句看起來像:
select * from family_table where name = Tywin Lannister;
我想知道如何將硬編碼替換為僅使1個php腳本適用於僅顯示其信息的所有名稱。
我的名字的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);
?>
有兩個選項供您選擇: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);
}
});
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.