2015-05-12 121 views
-1

我已經創建了一個使用JavaScript的表格,現在我想編輯每一行當我點擊編輯按鈕在行末 這裏是我的代碼來創建一個動態表如何使用Javascript點擊編輯按鈕編輯表格內容

function addRow() { 
    var firstname = document.getElementById("firstname"); 
    var lastname = document.getElementById("lastname"); 
    var rowCount = table.rows.length; 
    var row = table.insertRow(rowCount); 

    row.insertCell(0).innerHTML = firstname.value; 
    row.insertCell(1).innerHTML = lastname.value; 
    row.insertCell(2).innerHTML = '<input type="button" value = "Delete" onClick="Javacsript:deleteRow(this)">' + '<input type="button" value = "Edit" onClick="Javacsript:editRow(this)">'; 

一旦編輯按鈕的表格單元用戶點擊一次每個小區被編輯但是應該改變該值應成爲可編輯的。

+0

您尚未複製整個功能內容。 –

+0

你可以讓jsFiddle完成你的任務嗎? – Amy

+0

我們可以看到html嗎? – Goose

回答

0

你最好使用jQuery。這將需要幾個步驟:

  1. 製作行編輯與buttonclick:

    $("yourcell").contentEditable = true; 
    
  2. 創建上改變鉤:

    $("yourcell").change(function(){ 
        //do a server update 
    }); 
    
  3. 發表新服務器上使用jQuery POST數據:

    $.post("insertyourdata.php", function(data) { 
        //let user know the save has been done 
    }); 
    

如果要編輯整行,可以爲row142等每行創建一個類,然後通過該類選擇單元格。

+0

它有連續4個單元格,比如名稱,年齡,地址和街道,如果用戶想要編輯整行,我在末尾給他提供了一個編輯選項點擊編輯按鈕,所有這4個單元格變得可編輯,一旦用戶編輯並點擊頁面的任何部分,所有的單元格變爲禁用或鎖定狀態,並保存新值,這就是我正在努力實現的目標 – user3724559

相關問題