【问题标题】:Dynamically created index fields not being submitted with form动态创建的索引字段未与表单一起提交
【发布时间】:2012-03-03 22:07:50
【问题描述】:

我正在使用 jQuery 为电子邮件地址动态创建新字段,其中包含一个用于指定电子邮件地址类型的 SELECT 下拉框和一个用于电子邮件地址的文本 INPUT。

HTML

<form enctype="multipart/form-data" action="handler.php" method="post" />
<ul class="ul-lov">
<li>
    <select name="email_type_id[]" class="float-l edit-email-type">
      <option value="1">No Label</option>
      <option value="5">Email</option>
      <option value="10" selected="selected">Personal</option>
      <option value="20">Work</option>
      <option value="30">Other</option>
    </select>
    <input type="text" name="email_value[]" value="you@domain.com" class="float-l edit-email"> 
    <img src="/gui/minus-button.png" class="minus">
    <img src="/gui/plus-button.png" class="addlov">
</li>
</ul>
</form>

jQuery: 当用户单击“plus-button.png”时,它将运行以下代码。本质上,它只是创建了当前 LI 的副本并删除了值。

// Click plus
$('.addlov').live('click', (function() {        
    $(this).closest('ul').append(
        $(this).parent('li').clone(true).children('input, select').val('').end()
    );
    $(this).remove();
}));

这一切都很好,问题是当我提交表单时,动态创建的字段被忽略了。提交时,我正在序列化表单数据并显示在警报中以验证这一点。我已经尝试了一切,似乎无法看到问题所在!?有什么想法吗?

【问题讨论】:

    标签: php jquery forms dom clone


    【解决方案1】:

    我想通了……

    我在上面发布的表单 sn-p 是一个更大的应用程序的一小部分。该应用程序仍然只在页面上使用一种形式。不同的 div 中有许多表单元素。它不起作用的原因是因为我的 FORM 标签不在所有 div 之外。

    下面是我的代码设置示例:

    <div id="topform">
        <form action="handler.php" method="post">
        // some form items
    </div>
    <div id="moreformstuff">
        // some form items
    </div>
    <div id="bottomformstuff">
        // some form items
        </form>
    </div>
    

    所以我像这样移动了我的标签:

    <form action="handler.php" method="post">
    <div id="topform">        
        // some form items
    </div>
    <div id="moreformstuff">
        // some form items
    </div>
    <div id="bottomformstuff">
        // some form items
    </div>
    </form>
    

    现在一切正常。 :/ 希望这可以帮助其他人不要在同样的问题上浪费时间!

    【讨论】:

      【解决方案2】:

      在 handler.php 上抛出 &lt;pre&gt;&lt;?php var_dump($_POST); ?&gt;&lt;/pre&gt; 并查看传递的内容。当我测试您的示例时,单击一次加号并填写后,我在 handler.php 上得到了这个:

      array(2) {
        ["email_type_id"]=>
        array(2) {
          [0]=>
          string(2) "10"
          [1]=>
          string(2) "30"
        }
        ["email_value"]=>
        array(2) {
          [0]=>
          string(14) "you@domain.com"
          [1]=>
          string(15) "you2@domain.com"
        }
      }
      

      在发布到 handler.php 之前,您是否对数据进行了其他操作?

      【讨论】:

      • 是的,就是这样,不久前它还在工作。我发布的文章只是大型应用程序的一小部分。但我似乎无法弄清楚是什么导致它停止工作,因为自从它上次工作以来我没有做太多事情。感谢您的验证。
      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2021-10-29
      • 1970-01-01
      • 2011-12-21
      • 1970-01-01
      • 2012-06-07
      相关资源
      最近更新 更多