2014-07-13 66 views
-1

我正在構建一個Web服務,通​​過該服務,員工可以輸入給定周的工作時間。該表格呈現7天,並因此被細分爲7 <fieldset>標籤。我還需要允許員工每天添加字段(以及fieldset),以便輸入有關所執行活動的信息。動態添加的HTML表單域未通過php感知

表單是由php循環構建的,運行一個包含7天的數組。爲了進行識別,每天都有自己的值從0到6變化。這也適用於用戶可以動態添加字段的按鈕:它如何知道應在哪個字段中添加字段。

現在,這一切都會變得完美。除了當我按下提交按鈕時,只有第一天動態添加的字段出現在我處理網頁上的$_POST數組中。

我使用添加字段代碼:

var index = 0; 
var amount = 0;  

function addField(p) { 
    //declare new textfield for company key 
    var keyField = document.createElement("input"); 
    keyField.type = 'text'; 
    keyField.placeholder = 'Klant'; 
    keyField.style.width = '50%'; 
    keyField.style.height = '16px'; 
    keyField.style.marginBottom = '5px'; 

    //declare textfield for hours value 
    var valueField = document.createElement("input"); 
    valueField.type = 'text'; 

    valueField.placeholder = 'Uren'; 
    valueField.style.width = '30%'; 
    valueField.style.height = '16px'; 

    if(index == p) { 
     amount = amount + 1; 
     keyField.name = 'activityDay' + p + "-" + amount + "-" + 1; 
     keyField.alt = 'activityDay' + p + "-" + amount + "-" + 1; 
     valueField.name = 'activityDay' + p + "-" + amount + "-" + 2; 
     valueField.alt = 'activityDay' + p + "-" + amount + "-" + 2; 
    } else { 
     index = p; 
     amount = 1; 
     keyField.name = 'activityDay' + p + "-" + amount + "-" + 1; 
     keyField.alt = 'activityDay' + p + "-" + amount + "-" + 1; 
     valueField.name = 'activityDay' + p + "-" + amount + "-" + 2; 
     valueField.alt = 'activityDay' + p + "-" + amount + "-" + 2;     } 

    document.getElementById('urenForm'+p).appendChild(keyField); 
    document.getElementById('urenForm'+p).appendChild(valueField); 

} 

這應該輸出字段的名稱,如:

[activityDay0-1-1], [activityDay0-1-2], [activityDay0-2-1], [activityDay0-2-2]. 

結構:activityday<daynumber>-<activity in this day>-<keyfield = 1, valuefield = 2>

需要注意的是:

  • 變量p是數字從0到6
  • 在表單中設置的每個字段都被命名爲urenForm。這些字段會被添加到表單中的正確字段中,因爲網頁會完全阻止它們。
  • 從其他日子的表單中已經存在的字段被髮送。問題只出現在動態添加的字段上

有沒有人有一個想法,我可以確保所有動態添加的字段可以發送?

+1

你能否提供生成的HTML呢? –

+0

這裏有太多的未知數。建議您在jsfiddle.net中創建一個用於複製用戶界面並將日誌提交數據提交給控制檯的演示。你怎麼知道沒有收到數據? – charlietfl

+0

你在哪裏設置'index'? – Barmar

回答

2

沒有太多的信息,我認爲最可能的原因是動態添加的字段有名稱衝突。

除此之外,你應該考慮name your fields as arrays。所以你不需要追加一個遞增的數字到每個字段名...

0

我認爲問題是你從循環中複製了這個變量,所以變量index沒有定義(或者是由循環等)。

你可以試着更換你的這部分代碼:通過這一個

if(index == p) { 
    amount = amount + 1; 
    keyField.name = 'activityDay' + p + "-" + amount + "-" + 1; 
    keyField.alt = 'activityDay' + p + "-" + amount + "-" + 1; 
    valueField.name = 'activityDay' + p + "-" + amount + "-" + 2; 
    valueField.alt = 'activityDay' + p + "-" + amount + "-" + 2; 
} else { 
    index = p; 
    amount = 1; 
    keyField.name = 'activityDay' + p + "-" + amount + "-" + 1; 
    keyField.alt = 'activityDay' + p + "-" + amount + "-" + 1; 
    valueField.name = 'activityDay' + p + "-" + amount + "-" + 2; 
    valueField.alt = 'activityDay' + p + "-" + amount + "-" + 2; 
} 

var amount = (document.getElementById('urenForm' + p).getElementsByTagName('input').length/2) + 1; 
keyField.name = 'activityDay' + p + "-" + amount + "-" + 1; 
keyField.alt = 'activityDay' + p + "-" + amount + "-" + 1; 
valueField.name = 'activityDay' + p + "-" + amount + "-" + 2; 
valueField.alt = 'activityDay' + p + "-" + amount + "-" + 2; 

第一行簡單計數輸入字段和兩個(因爲總有兩個將其劃分輸入字段被添加)。這應該導致預期的輸入字段名稱。

我創建了一個Fiddle以顯示它是如何工作的。正如Chris Lam已經指出的那樣,使用數組會更好(或者至少更清楚),例如使用數組。如my answer to your last question。這樣你就不再需要amount變量了。