:::

4. 即時新增表單欄位

一、安裝xampp

1.Linux版:http://www.apachefriends.org/zh_tw/xampp-linux.html

(1) 下載並存到家目錄/home/user
(2) 「應用程式→附屬應用程式→終端機」,在終端機中執行以下指令,以管理員身份將xampp-linux-1.7.2.tar.gz解壓縮到/opt
sudo tar xvfz ~/xampp-linux-1.7.2.tar.gz -C /opt
(3) 啟動lampp:「sudo /opt/lampp/lampp start」
(4) 第一次需進行安全設定:sudo /opt/lampp/lampp security(除了第四項「設定MySQL的root密碼」輸入yes以外,其餘的都填no即可)

(5) Linux網頁目錄:「/opt/lampp/htdocs」,可用「sudo chown -R user:user /opt/lampp/htdocs」讓user帳號可以讀取寫入該目錄。

2.Windows版:http://www.apachefriends.org/zh_tw/xampp-windows.html

(1) 下載xampplite-win32-1.7.2.exe,點兩下解壓縮到C:或者D:
(2) 點選xampp-control.exe,並依序啟動Apache和MySQL
(3) 輸入「http://localhost」並選擇「中文→安全」設定MySQL密碼。
(4) Windows網頁目錄:「D:/xampplite/htdocs」

二、即時生出表單

1.HTML部份:<script type="text/javascript" src="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>

2.表單部份:
<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' id='add' value='新增'>
    </td>
</tr>

3.儲存部份:
function save_tel(){
  global $db_name;
  foreach($_POST['name'] as $i=>$name){
    if(empty($name))continue;
    $sql="insert into `telbook` (`name`,`tel`) values('{$name}','{$_POST['tel'][$i]}')";
    mysql_db_query($db_name,$sql) or die($sql);
  }
}


:::

搜尋


書籍目錄

展開 | 闔起

線上使用者

17人線上 (2人在瀏覽線上書籍)

會員: 0

訪客: 17

更多…