0

我想创建一个包含可变数量的附加信息对的数据集。这就是我实现它的方式,例如,如果此数据集编辑一个:

  • 使用 sql + php 我打印旧数据对和新的干净数据集(2 个输入)
  • 如果用户需要超过 2 个新输入,他可以单击“更多数据”,然后 javascript 会附加 2 个新输入

这很好用,但是如果用户提交表单,它不会传输新的输入。

我认为代码会更好地解释它:)

这里的js ...

  <script type="text/JavaScript"> 
    input_daten_de_nr=<?php echo count($produkte_daten_de)+2; ?>; 
    function new_input_data_de(){

        var data_input_container = document.getElementById("dynamic_input_daten_de");

        input_daten_de_nr++; 

        var input_1 = document.createElement('input');
        input_1.setAttribute('type', 'text');
        input_1.setAttribute('id',   'daten_de_'+input_daten_de_nr);
        input_1.setAttribute('name',   'daten_de['+input_daten_de_nr+']');
        input_1.setAttribute('value', '');
        data_input_container.appendChild(input_1);

        input_daten_de_nr++; 

        var input_2 = document.createElement('input');
        input_2.setAttribute('type', 'text');
        input_2.setAttribute('id',   'daten_de_'+input_daten_de_nr);
        input_2.setAttribute('name',   'daten_de['+input_daten_de_nr+']');
        input_2.setAttribute('value', '');
        data_input_container.appendChild(input_2);

        var input_br = document.createElement('br');
        data_input_container.appendChild(input_br);

    }
</script> 

...这里的表格...

<form name="form1" method="post" action="index.php" enctype="multipart/form-data">
    ...
    <div id='dynamic_input_daten_de'> 
        <?php
        $number = 1;
        if($produkte_daten_de) foreach($produkte_daten_de AS $daten_de){

            echo "<input type='text' id='daten_de_".$number."' name='daten_de[".$number."]' value='".$daten_de["text"]."'>";
            $number++;

            if(($number % 2)==1) echo "<br>";
        }
        echo "<input type='text' id='daten_de_".$number."' name='daten_de[".$number."]' value=''>";
        $number++;
        echo "<input type='text' id='daten_de_".$number."' name='daten_de[".$number."]' value=''>";
        $number++;
        echo "<br>";
        ?>
    </div> 
    <h3 onClick="new_input_data_de();"> <u style="cursor:pointer;">more data</u></h3>
    ...
</form>

...这里是运行时的代码,单击“更多数据”后...

<div id="dynamic_input_daten_de">
<input id="daten_de_1" type="text" value="" name="daten_de[1]">
<input id="daten_de_2" type="text" value="" name="daten_de[2]">
<br>
<input id="daten_de_3" type="text" name="daten_de[3]" value="">
<input id="daten_de_4" type="text" name="daten_de[4]" value="">
<br>
</div>

..和提交后的 print_r($_POST) ...

Array
(
    ...
    [daten_de] => Array
        (
            [1] => a
            [2] => b
        )

    ...
)

也许有人有办法?


编辑:我改变了我的代码,但这并不能解决问题;(

(感谢@Dima Shevtchuk 提供了这个更好看的代码。)

  <script type="text/JavaScript"> 
    daten_de_nr=<?php echo count($produkte_daten_de)+2; ?>; 
    $( "#new_input_data_de" ).click(function() {
        daten_de_nr++; 
        var e1 = "<input type='text' value='' id='daten_de["+daten_de_nr+"]' name='daten_de["+daten_de_nr+"]'>";
        $("#dynamic_input_daten_de").append(e1);
        daten_de_nr++; 
        var e2 = "<input type='text' value='' id='daten_de["+daten_de_nr+"]' name='daten_de["+daten_de_nr+"]'><br>";
        $("#dynamic_input_daten_de").append(e2);
    });
    $( ".absenden" ).click(function() {
        $("form").submit();
    });
</script> 
4

1 回答 1

0

为什么你不使用jquery?你的代码会更好。并且可以修好你的包。

 var addInput = function() {
     var el = "<input value = '' name = 'name'>";
     $("form").append(el);
 };

 $("h3").on("click", addInput); 

并尝试使用 JS 提交表单

var sendForm = function() {
 $("form").submit();
};

$(".some").("click", sendForm);

附加以形成此按钮

<button class = "some" name="Click">
于 2013-09-20T08:39:28.673 回答