Question

所以这就是交易：

我有一个订单页面，我使用两种形式。

第一个表单包含一个订单项的输入数据，当我按下OK时，我会通过onsubmit=send_item_data(this)将表单的输入数据传递给javascript，最后我会在send_item_data函数中return false;，所以它不会不会发布。

在第二个中，我想在div组中追加/减去以前的数据（所以我可以添加更多或者轻松删除它们）但是我无法思考（或找到）将数据放入分组的解决方案一个div中的第一个表单，并将该子div附加到第二个表单。

最后，通过按下按钮，第二个表单将发布所有div的数据，我将使用PHP后端代码处理它。

代码正文：

<form action="" id="first_form" method="post" onsubmit="return send_item_data(this)"> 

    <div id="Select_list">
        <select blah blah>
            ---bunch of options---
        </select>
    </div>

    <div id="extras">
                ---Some extras that you can choose by a checkbox input (I generate it via PHP)---
                example:
                <input name="checkbox[<?php echo $row['column_data_from_query']?>]" type="checkbox" value="checked">
    </div>

            --->Possibly two more input fields here<---

    <input type="button" value="clear" onclick="clear_form()">
    <input type="submit" value="OK">
</form>

<form action="" id="finalize_order_form" method="post"> 
   --->This is the second form<---
   --->In here I want to put the data from the first form so i can handle them by group<---

    if I click OK three times in the first form there should be three groups here that contain each form's data
    <input type="submit" class="button" value="Finallize order"/>
</form>

我主要使用PHP Mysql和Javascript（包括AJAX，而不是jQuery）。

Answer 1

因此，您希望在第二个表单中列出订单商品，例如结帐前购物车。如果您使用div，则不会将POST数据提交给服务器 - 它们将仅显示。因此，每次添加/删除项目时，您都需要遵循Robert的建议并将第一个表单的数据保存到数据库中（除了他的其他原因，例如不丢失客户的会话信息）。这样，当他们点击确认订单时，数据库已经是最新的。或者你需要将Confirm Order按钮挂钩到JS函数，该函数将div转换回JSON并将其发布到服务器以存储在DB中。

就从第一个表单的数据创建仅显示div而言，send_item_data函数需要遍历所有表单的输入，获取它们的值，然后将它们添加到div中，但是您希望它们显示。然后你可以将div插入第二个表单。由于您将“this”传递给函数（即表单对象本身），因此可以通过以下方式获取输入：

var inputs = this.getElementsByTagName("input");
for(var i = 0; i < inputs.length; i++) {
    if(inputs[i].type == 'submit') continue; //ignore the Submit button
    var name = inputs[i].name, value = inputs[i].value;
    ---use the name and value of this input to construct a span or something to insert inside your div---
}
---now you can insert the div into the 2nd form---

将填充了数据的div从一个简单表单附加到包含所有已分组并准备POST的div的表单

1 个答案: