Question

我是自学者，我正在构建（尝试构建）一个包含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脚本：

function 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 | $ description1 | $ quantity1
  EOD;

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

Answer 1

您可以使用数组：

<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');
    }
});

请参阅fiddle。

现在，您可以使用数组键访问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);

PHP / jQuery clone - 从表单获取变量并使用php发送电子邮件

1 个答案: