javascript、php 和 mysql 的动态表单字段：奇怪的错误

Question

我的动态表单字段脚本出现了一个非常奇怪的错误。解释起来不是那么容易，但我会尽力的。

我有一个 HTML 表单，其中包含要添加的 java 脚本

1 select 字段
2 个文本字段 &
9 个复选框

通过单击 link 动态地实现。

每个动态表单集在我的 mysql 数据库中创建一个自己的条目。

一个 select 字段和两个文本字段正确地将数据插入到我的数据库中。

但是有9个复选框，有一个错误。

例如：如果我创建两个表单集并且我将选中每个第一个复选框，则数据库条目是正确的

但是

如果我创建两个表单集并且我将检查第一个表单集复选框 1 和第二个表单集复选框 2，我的数据库条目将第一个和第二个复选框条目写入第一个(!!!) 数据库条目。第二个数据库条目中没有第二个复选框的条目。

也许我的截图会更容易理解。

这是我的脚本。我真的希望有人能帮助我。我一直在寻找解决方案，但是...

<?php
include('dbconnection.php');
?>

<!DOCTYPE HTML>
<head>
<script type="text/javascript" src="theme/scripts/jquery.js"></script>
<script type="text/javascript" src="theme/scripts/jqueryui.js"></script>


<script type="text/javascript">
var counter = 0;
$(function(){
 $('p#add_field').click(function(){
 counter += 1;
 $('#container').append(
   '<strong>Artikel ' + counter + '</strong><br />'

 + '<select name="artikel[]' + '">'
 + '<option value="test1">' + 'test1' + '</option>'
 + '<option value="test2">' + 'test2' + '</option>'
 + '</select><br /><br />'

 + '<b>Beschreibung oder Anzahl:</b><br>'
 + '<input name="beschreibung[]' + '" type="text" class="login-username" /><br />'

 + '<b>Preis in €:</b><br>'
 + '<input id="preis_' + counter + '" name="preis[]' + '" type="text" class="login-username" /><br />'

 + '<span style="float: left; width: 70px; text-align: center;">'
 + 'Aus-/Einbau<br>'
 + '<div class="roundedTwo">'   
 + '<input type="checkbox" value="Aus und Einbauarbeiten<br>" id="1a_' + counter + '" name="ausein[]' + '" />'
 + '<label for="1a_' + counter + '"></label>'
 + '</div>'
 + '</span>'


 + '<div style="float: left; width: 20px;">&nbsp;</div>'

 + '<span style="float: left; width: 70px; text-align: center;">'
 + 'Instandsetzung<br>'
 + '<div class="roundedTwo">'
 + '<input type="checkbox" value="Teil instand gesetzt<br>" id="2b_' + counter + '" name="instand[]' + '" />'
 + '<label for="2b_' + counter + '"></label>'
 + '</div>'
 + '</span>'


 + '<div style="float: left; width: 20px;">&nbsp;</div>'

 + '<span style="float: left; width: 70px; text-align: center;">'
 + 'Teillack<br>'
 + '<div class="roundedTwo">'   
 + '<input type="checkbox" value="Teillackierung<br>" id="3c_' + counter + '" name="rep[]' + '" />'
 + '<label for="3c_' + counter + '"></label>'
 + '</div>'
 + '</span>'


 + '<div style="float: left; width: 20px;">&nbsp;</div>'

 + '<span style="float: left; width: 70px; text-align: center;">'
 + 'Farbangleich<br>'
 + '<div class="roundedTwo">'   
 + '<input type="checkbox" value="Farbtonangleichung<br>" id="4d_' + counter + '" name="farb[]' + '" />'
 + '<label for="4d_' + counter + '"></label>'
 + '</div>'
 + '</span>'


// + '<div style="float: left; width: 20px;">&nbsp;</div>'

 + '<span style="float: left; width: 70px; text-align: center;">'
 + 'Neuteil<br>'
 + '<div class="roundedTwo">'   
 + '<input type="checkbox" value="Neuteil wurde verbaut<br>" id="5e_' + counter + '" name="neu[]' + '" />'
 + '<label for="5e_' + counter + '"></label>'
 + '</div>'
 + '</span>'


 + '<div style="float: left; width: 20px;">&nbsp;</div>'

 + '<span style="float: left; width: 70px; text-align: center;">'
 + 'Beilack.<br>'
 + '<div class="roundedTwo">'   
 + '<input type="checkbox" value="Beilackierung<br>" id="6f_' + counter + '" name="spot[]' + '" />'
 + '<label for="6f_' + counter + '"></label>'
 + '</div>'
 + '</span>'


 + '<div style="float: left; width: 20px;">&nbsp;</div>'

 + '<span style="float: left; width: 70px; text-align: center;">'
 + 'Finisch<br>'
 + '<div class="roundedTwo">'   
 + '<input type="checkbox" value="Finischarbeit<br>" id="7g_' + counter + '" name="finisch[]' + '" />'
 + '<label for="7g_' + counter + '"></label>'
 + '</div>'
 + '</span>'


 + '<div style="float: left; width: 20px;">&nbsp;</div>'

 + '<span style="float: left; width: 70px; text-align: center;">'
 + 'Delle Rep.<br>'
 + '<div class="roundedTwo">'   
 + '<input type="checkbox" value=" Dellen instand gesetzt<br>" id="8h_' + counter + '" name="delle[]' + '" />'
 + '<label for="8h_' + counter + '"></label>'
 + '</div>'
 + '</span>'


// + '<div style="float: left; width: 20px;">&nbsp;</div>'

 + '<span style="float: left; width: 70px; text-align: center;">'
 + 'Lederrep.<br>'
 + '<div class="roundedTwo">'   
 + '<input type="checkbox" value="Lederreparatur<br>" id="9i_' + counter + '" name="leder[]' + '" />'
 + '<label for="9i_' + counter + '"></label>'
 + '</div>'
 + '</span>'

 + '<div class="decoration"></div>'

 + '<input id="renr_' + counter + '" name="renr[]' + '" type="hidden" value="' + '<?php echo $renr ?>' + '" />'
 + '<input id="datum_' + counter + '" name="datum[]' + '" type="hidden" value="' + '<?php echo $datum ?>' + '" />'
 + '<input id="jahr_' + counter + '" name="jahr[]' + '" type="hidden" value="' + '<?php echo $jahr ?>' + '" />'
 + '<input id="id1_' + counter + '" name="id1[]' + '" type="hidden" value="' + '<?php echo $id1 ?>' + '" />'

     );
   });
 });
</script>

</head>

<body>

<?php

$id = $_GET['id'];
if (isset($_POST['submit_val'])) {

    if ($_POST['artikel']) {

    $post_count = count($_POST['artikel']);

        for ($i=0;$i<$post_count;$i++) {

            $values1 = mysql_real_escape_string($_POST['artikel'][$i]);
            $values2 = mysql_real_escape_string($_POST['preis'][$i]);
            $values3 = mysql_real_escape_string($_POST['beschreibung'][$i]);
            $values4 = mysql_real_escape_string($_POST['ausein'][$i]);
            $values5 = mysql_real_escape_string($_POST['instand'][$i]);
            $values6 = mysql_real_escape_string($_POST['rep'][$i]);
            $values7 = mysql_real_escape_string($_POST['farb'][$i]);
            $values8 = mysql_real_escape_string($_POST['neu'][$i]);
            $values9 = mysql_real_escape_string($_POST['spot'][$i]);
            $values10 = mysql_real_escape_string($_POST['finisch'][$i]);
            $values14 = mysql_real_escape_string($_POST['delle'][$i]);
            $values15 = mysql_real_escape_string($_POST['leder'][$i]);
            $values11 = mysql_real_escape_string($_POST['datum'][$i]);
            $values12 = mysql_real_escape_string($_POST['jahr'][$i]);
            $values13 = mysql_real_escape_string($_POST['renr'][$i]);
            $values16 = mysql_real_escape_string($_POST['id1'][$i]);

            $query = mysql_query("INSERT INTO rechnung (artikel,preis,beschreibung,ausein,instand,rep,farb,neu,spot,finisch,delle,leder,datum,jahr,renr,kd) VALUES ('$values1', '$values2', '$values3', '$values4', '$values5', '$values6', '$values7', '$values8', '$values9', '$values10', '$values14', '$values15', '$values11', '$values12', '$values13', '$values16')", $conid );  

        }
    }

    echo "<h3><strong>" . count($_POST['artikel']) . "</strong> Artikel hinzugefügt</h3>";
    //mysql_close();
}
?>

<?php if (!isset($_POST['submit_val'])) { ?>

 <form method="post" action="?id=<?php echo $id; ?>">

 <div id="container">
 <div id="neu"><p id="add_field"><a href="#"><img src="plus.png" width="30px"><b>Artikel hinzufügen</b></a></p></div>
 <div class='decoration'></div>
 </div>
 <input type="submit" name="submit_val" value="Weiter zu Fahrzeugdaten" class="button button-blue"/>
 </form>                

<?php } ?>

</body>

Answer 1

问题是由复选框的名称引起的。

无论 tgeir 类型如何，您都使用相同的逻辑为所有表单控件分配名称：controlname[]。是的，因为 [] 最后 php 会将这些参数解释为数组。到目前为止，还不错。

但是，在html中，如果一个复选框没有被选中，那么它就不是一个成功的控件，因此它不会被提交到服务器。

如果第一条记录中的第二个checkbox没有被选中，那么空的vslue将不会被发送到服务器。如果随后在第二条记录中选中了第二个复选框，则它将是提交值中第二个复选框顺序中的第一个值。

如果您使用 print_r 在您的 php 代码中打印 $_POST，就更容易想象了。

解决方案是在复选框的名称中包含一个索引，以指示它们属于哪条记录。因此，不要使用 ausein[] 作为名称，而是使用 ausein[0]、ausein[1] 等作为名称。

Answer 2

@Shadow 的解决方案很有帮助。但我必须设置默认计数

var counter = 0;

至

var counter = -1;

这解决了我的问题。

javascript、php 和 mysql 的动态表单字段：奇怪的错误

dynamic form fields with javascript, php & mysql: strange error

javascript

php

jquery

mysql

dynamic-forms