Question

我正在建立一个网络服务，员工可以通过该服务输入一周的工作时间。表单显示7天，因此细分为7 <fieldset>个标签。我还需要允许员工每天添加字段（以及字段集），以便输入有关已执行活动的信息。

表单由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。这些字段会添加到表单中设置的正确字段中，因为网页会完美地显示它们。
发送其他日期表单中已存在的字段。该问题仅发生在动态添加的字段

有人知道如何确保可以发送所有动态添加的字段吗？

Answer 1

没有太多信息，我认为最可能的原因是动态添加的字段有名称冲突。

此外，你应该考虑name your fields as arrays。这样您就不需要为每个字段名称附加一个增量编号......

Answer 2

我认为问题在于您从循环中复制了这个问题，因此未定义变量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;

第一行简单地计算输入字段并将它们除以2（因为总是添加两个输入字段）。这应该会产生预期的输入字段名称。

我创建了一个 Fiddle 来展示它是如何运作的。

正如Chris Lam已经指出的那样，使用数组会更好（或至少更清楚），例如就像my answer to your last question一样。这样您就不再需要amount变量了。

动态添加的HTML表单字段无法通过php感知

2 个答案: