如何將輸入字段添加到表單

Question

我有一個表單，需要向其添加字段/行。 我的代碼添加了輸入字段，但是提交表單后我無法獲取值。

HTML

<form action="#" method="POST">
<div class="col-md-12">
    <fieldset class="fieldset-language" data-count="1">
        <legend>Legg til kostnader</legend>
        <div class="fieldset-content">
            <div class="row">
                <div class="col-md-5 form-group ">
                    <label for="">Cost</label>
                    <select name="verdi[]" class="form-control" >                                   
                        <?php foreach($kostnader as $Cost) { ?>
                            <option value="<?php echo $Cost; ?>"><?php echo $Cost;?></option>
                        <?php } ?>                                  
                    </select>
                </div>
                <div class="col-md-5 form-group ">
                    <label for="">Verdi</label>                                                         
                    <input type="text" class="form-control" id="Totalt" name="kostnad[]" placeholder="Some value">
                </div>

                <div class="col-md-2 form-group ">

                </div>
            </div>

        </div>
        <div class="input_fields_wrap"></div>

        <button class="add_field_button btn btn-primary" data-fields="0" name="leggtil">+ Add</button><br><br>
        <button type="submit" name="submit" class="btn btn-danger btn-lg">Send</button>

    </fieldset>
</div>

如果提交表單，則轉儲內容。

$post = array();

 for($i=0;$i<count($_POST['kostnad']);$i++){

      $post = [
       'kostnad'      => $_POST['kostnad'][$i],
       'verdi'      => $_POST['verdi'][$i]
      ];

 }

jQuery代碼，用於添加和克隆輸入字段：

$(document).ready(function() {

    var max_fields = 10; //maximum input boxes allowed

    $(".add_field_button").click(function(e){ //on add input button click
        e.preventDefault();

        var add_button = $(this);
        var fieldset   = add_button.closest('fieldset');
        var wrapper    = add_button.closest('.sf-viewport');
        var form       = add_button.closest('form');
        var x          = parseInt(fieldset.attr('data-count'));
        var cur_height = 0;
        var fieldset_clone;
        var fieldset_content;

        if(x < max_fields){ //max input box allowed

            //text box increment
            fieldset.attr('data-count',x+1);


            cur_height = fieldset.height();
            form.height(cur_height*2);
            wrapper.height(cur_height*2);

            fieldset_clone = add_button
                            .closest('fieldset')
                            .find('.fieldset-content')
                            .eq(0)
                            .clone();

            fieldset_clone
                .find('[name]')
                .each(function(){
                    $(this).val($(this).prop('defaultValue'));
                });


            fieldset_content = $('<div>')
                .addClass('fieldset-content')
                .append(fieldset_clone.children());


            // add_button.before(fieldset_clone.children());
            add_button.before(fieldset_content);

            // add remove button
            add_remove_btn(fieldset_content);

        }
    });


    function add_remove_btn(item){
        item.prepend(
            '<a class="btn pull-right om-remove btn-danger btn-xs" href="#">'+
            '  <div class="small">Remove</div>'+
            '</a>'
        );

    }

    //user click on remove text
    $(document).on("click",".om-remove", function(e){

        e.preventDefault();

        var x = parseInt($(this)
            .closest('fieldset')
            .attr('data-count')
        );

        $(this)
            .closest('fieldset')
            .attr('data-count',x-1);

        $(this)
            .closest('.fieldset-content')           
            .slideUp(function(){
                $(this).remove()
            })

    });
});

如果提交了按鈕，請運行以下var dump：var_dump（$ _ POST）;

問題是我無法僅在第一個條目上獲取添加的字段上的數據，有沒有辦法獲取添加字段的數據？

Answer 1

如果在發布時查看導航調試器，則所有變量都在那里，因為您使用方括號[]對其進行了命名。 如此處所說，通過php中的POST 輸入多個具有相同名稱的輸入 ，您的POST值被定義為每個變量名稱的數組。 因此，您的代碼正在運行，但是您可能更希望使用多維數組來保存數據：

$post = array();

for($i = 0; $i < count($_POST['kostnad']); $i++) {

     $post[$_POST['verdi'][$i]] = [
      'kostnad'    => $_POST['kostnad'][$i],
      'verdi'      => $_POST['verdi'][$i]
     ];
}

echo "<pre>";
print_r($post);
echo "</pre>";

在此示例中，每個值都保存在$ post子數組中，並由“ verdi”索引。

希望能幫助到你。