0

我有以下代码...

<h3>Guests</h3>
<form class="form-inline">
    <fieldset>                                  
        <label class="control-label" for="input01">First Name:</label>
            <input type="text" class="input-small" id="input01">                            
        <label class="control-label" for="input01">&nbsp;&nbsp;Middle Name:</label>
            <input type="text" class="input-small" id="input01">
        <label class="control-label" for="input01">&nbsp;&nbsp;Last Name:</label>
            <input type="text" class="input-small" id="input01">
        <label class="control-label" for="input01">&nbsp;&nbsp;Birthday:</label>
            <input type="text" class="input-small" id="input01">>                   
    </fieldset>
</form>

我希望能够添加一个显示“添加更多”的按钮，并让它添加一行新元素，最终将表单保存到数据库中。如果我添加一个添加一行的按钮（这需要向数据库添加一条记录。对于更改的记录，我想更新数据库中的记录）。

所以问题，多部分是：

  1. 当他们单击“添加更多”按钮时，我认为这是向数据库添加记录的最佳时间。然后当我保存表单时，我循环并更新表单中的所有记录。还是有其他想法？
  2. 要点：有人可以建议如何循环并执行更新的示例吗？
4

2 回答 2

4

我建议单击“添加更多”按钮 不是向数据库添加记录的最佳时间。想象一下有人点击了按钮，但实际上并没有填写该行。很酷，您想对自己的表单进行全面的了解并提供更具交互性的用户体验，但不要贬低“表单 101”：有一个“提交/保存”按钮。在保存到数据库之前进行验证。逻辑非常简单：您需要将行的 ID 隐藏在某处（可能是隐藏的文本字段）。逻辑类似于“我收到了 $_POST。我检查了所需的数据是否存在并且确定。我有 ID 吗？是：更新。否：插入。”

于 2012-06-02T09:03:17.953 回答
2

我同意将值同时保存到数据库不是一个好主意，并再次考虑您在这里尝试什么。当有人单击“添加更多”时，您将有新行，然后您将这些行值添加到数据库中但是最初的那些...

可能这会有所帮助

    <label class="control-label" for="input01">First Name:</label>
        <input type="text" class="input-small" id="input01" name="firstname[]">                            
    <label class="control-label" for="input01">&nbsp;&nbsp;Middle Name:</label>
        <input type="text" class="input-small" id="input01" name="middlename[]">
    <label class="control-label" for="input01">&nbsp;&nbsp;Last Name:</label>
        <input type="text" class="input-small" id="input01" name="lastname[]">
    <label class="control-label" for="input01">&nbsp;&nbsp;Birthday:</label>
        <input type="text" class="input-small" id="input01" name=birthday[]>

现在保存在 js var 中单击按钮时要显示的字段

var extras = $('fieldset').clone();

然后

$(".yourAddButton").click(function(){ $("form").append(extras); });

最后别忘了有提交按钮来提交表单。

于 2012-06-02T10:28:58.667 回答