0

我是自学者，我目前正在构建（尝试构建）一个简单的表单，该表单具有一行包含 3 个字段，并且根据客户想要的项目数量动态添加具有相同字段的另一行。它将有 20 个项目的限制。我正在为要动态添加的字段使用这个 html 布局：

<div id="input1" style="margin-bottom:4px;" class="clonedInput">
        Part #: <input name="part'+i+'" type="text" id="part1" size="10" maxlength="15" />
        Description: <input name="description'+i+'" type="text" id="description1" size="30" maxlength="50" />
        Qty: <input name="quantity'+i+'" type="text" id="quantity1" size="5" maxlength="5" />
    </div>
    <p>&nbsp;</p>
    <div>
        <input type="button" id="btnAdd" onclick="dupForm('input', '.clonedInput', 'btnAdd', 'btnDel');" value="add item" />
        <input type="button" id="btnDel" onclick="rmForm('input', '.clonedInput', 'btnAdd', 'btnDel');" value="remove item" />
    </div>

这个java脚本：

函数 trimNums(stringToTrim) { return stringToTrim.replace(/\d+$/,""); }

    function dupForm(divId, divClass, btnAdd, btnRm)
    {
    //alert(divId+'   '+divClass);
        var num     = $(divClass).length;
        var newNum  = new Number(num + 1);
        var i;

        var newElem = $('#' + divId + num).clone().attr('id', divId + newNum).fadeIn('slow');

        for (i=0; i < newElem.children().length; i++)
        {
            var attrId = trimNums(newElem.children(':eq('+i+')').attr('id'));
            var attrName = trimNums(newElem.children(':eq('+i+')').attr('name'));

            newElem.children(':eq('+i+')').attr('id', attrId + newNum).val('');
        }
        $('#' + divId + num).after(newElem);
        $('#' + btnRm).attr('disabled','');

        if (newNum == 20)
            $('#' + btnAdd).attr('disabled','disabled');
    }

    function rmForm(divId, divClass, btnAdd, btnRm)
    {
        var num = $(divClass).length;

        $('#' + divId + num).remove();
        $('#' + btnAdd).attr('disabled','');

        if (num-1 == 1)
            $('#' + btnRm).attr('disabled','disabled');
    }
    </script>

我的问题是：如何将变量导入 PHP，以便将此表单发送到特定的电子邮件。

请注意：我在表单上有更多字段并在 php 中收集信息我使用以下 php 脚本：

$emailField = $_POST['email'];
$company_nameField = $_POST['company_name'];
$dateField = $_POST['date'];
$phoneField = $_POST['phone'];

$part1Field = $_POST['part1'];
$part2Field = $_POST['part2'];

$description1Field = $_POST['description1'];
$description2Field = $_POST['description2'];

并将其发布在我正在使用它来测试的电子邮件上：

$body = <<<EOD


电子邮件：$email
公司名称：$company_name
日期：$date
电话：$phone
$part1 | $描述1 | $quantity1
EOD；

我知道通过收集动态值的变量，需要有不同的代码，我被困在那里。如果有人可以指导我找到正确的解决方案，我将非常感激。

4

1 回答 1

2

您可以使用数组：

<div id="inputContainer">
    <div class="clonedInput">
        Part #: <input name="part[]" type="text" class="part" size="10" maxlength="15" />
        <button type="button" class="remove">Remove</button>
        <button type="button" class="clone">Clone</button>
    </div>
</div>
<div id="toolbar">
        <button type="button" class="add">Add new</button>
</div>

使用以下代码，您可以删除和克隆单个输入：

var limit = 20;
$('#inputContainer').on('click', '.clonedInput>.remove', function(e) {
    $(this).parent().fadeOut().remove();
    if ($(this).parent().parent().length < limit) {
        $('#toolbar>.add').removeAttr('disabled');
    }
});

$('#toolbar').on('click', '.add', function(e) {
    var newElem = $('<div class="clonedInput">\
        Part #: <input name="part[]" type="text" class="part" size="10" maxlength="15" />\
        <button type="button" class="remove">Remove</button>\
        <button type="button" class="clone">Clone</button>\
    </div>');


    $('#inputContainer').append(newElem);
    if($('#inputContainer').length == limit) {
        $('#toolbar>.add').attr('disabled', 'disabled');
    }
});

$('#inputContainer').on('click', '.clonedInput>.clone', function(e) {
    var newElem = $(this).parent().clone().fadeIn('slow');

    $(this).parent().after(newElem);
    if ($(this).parent().parent().length == limit) {
        $('#toolbar>.add').attr('disabled', 'disabled');
    }
});

见小提琴。

您现在可以使用数组键访问 PHP 中的各个输入字段：

echo $_POST['part'][0]; // first 'part' field

// print all fields
$mailData = '';
for($i = 0; $i < count($_POST['part']); $i++) {
    $mailData .= '#' . $_POST['part'][$i] . ' | ';
    $mailData .= $_POST['description'][$i] . ' | ';
    $mailData .= $_POST['quantity'][$i] . PHP_EOL;//or replace PHP_EOL for "<br>\n" it will work just fine

}

$body = <<<EOD
Email: $email
Company Name: $company_name
Date: $date
Phone: $phone
$mailData
EOD;


your_mail_function($body);
于 2013-01-21T20:46:16.897 回答