4. 即時新增表單欄位
4-1 telbook.php
<?php
$root_pass="12345"; //資料庫root密碼
$db_name="test"; //資料庫名稱
/*----------------------------------*/
$link=mysql_connect("localhost","root",$root_pass); //資料庫連線
mysql_query("SET NAMES 'utf8'"); //設定語系
mysql_select_db('test');
$op=(empty($_REQUEST['op']))?"":$_REQUEST['op'];
if($op=="save"){ //進行動作判斷
save_tel(); //儲存電話
header("location:{$_SERVER['PHP_SELF']}"); //存完，轉向
}else{
$form=input_form(); //呼叫「輸入界面」函數
$show_tel=show_tel(); //呼叫「顯示電話簿」函數
$main=$form.$show_tel; //將兩者結合起來成為一個變數
}
?>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<title>我的電話簿</title>
<script type="text/javascript" src="js/jquery-1.3.2.min.js"></script>
<script>
$(document).ready(function(){
var i=1;
$('#add').click(function(){
$('#input').clone().attr('id','input'+i).insertBefore('#add_tr');
i++;
});
});
</script>
</head>
<body>
<?php
echo $main;
?>
</body>
</html>
<?php
//輸入界面函數
function input_form(){
$form="
<form action='{$_SERVER['PHP_SELF']}' method='post'>
<table>
<tr>
<th>姓名</th>
<th>電話</th>
</tr>
<tr id='input'>
<td><input type='text' name='name[]' value='' size=10></td>
<td><input type='text' name='tel[]' value=''></td>
</tr>
<tr id='add_tr'>
<td>
<input type='hidden' name='op' value='save'>
<input type='submit' value='儲存'>
<input type='button' value='新增' id='add'>
</td>
</tr>
</table>
</form>
";
return $form;
}
//顯示電話簿函數
function show_tel(){
global $db_name;
$show_tel="<h3>電話簿列表</h3>";
$sql="select `sn`,`name`,`tel` from `telbook`";
$result=mysql_query($sql) or die($sql);
while(list($sn,$name,$tel)=mysql_fetch_row($result)){
$show_tel.="<div>{$name}：{$tel}</div>";
}
return $show_tel;
}
//儲存電話簿函數
function save_tel(){
global $db_name;
foreach($_POST['name'] as $i=>$name){
$sql="insert into `telbook` (`name`,`tel`) values('{$name}','{$_POST['tel'][$i]}')";
mysql_query($sql) or die($sql);
}
}
?>
