javascript jQuery 不会在 .append() 之后发布表单的所有输入

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/3847492/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-25 02:27:12  来源:igfitidea点击:

jQuery not posting all inputs of a form after the .append()

javascriptjqueryform-submit

提问by Claudio

I have a form generated dynamically with the method .append() of jQuery. I can add any number of new input, textbox, cmbbox, etc...

我有一个使用 jQuery 的 .append() 方法动态生成的表单。我可以添加任意数量的新输入、文本框、cmbbox 等...

But the problem is that when I do the sumbit of the form, the PHP target does not receive the new input added, but just the vars connected to the input already in the form before the append().

但问题是,当我对表单进行求和时,PHP 目标不会接收添加的新输入,而只是连接到 append() 之前表单中已有输入的变量。

Any ideas?

有任何想法吗?


The javascript:


javascript:

$("#button").live('click',function add(){
   $("#list").append(
       '<li style="height:20px;">'
    +'<input type="text" class="text" id="prova" name="prova[]" value="prova">'+ 
       '</li>'
   );
});


The Html:


Html:

<input type="submit" id="button" value="Add input">
<form name = "form" id="form" action="post.php" method="POST">
   <ul style="width:670px;padding:0px 0px 30px 0px" id="list">
   </ul>
   <input type="submit" id="submit" value="Submit">
</form>


The PHP:


PHP:

<?php
  print_r($_POST);
?>

采纳答案by Peter Ajtai

Problem 1:

问题1:

Your #buttonshould not be of type submit, since you just want to use it to add to the form and not submit the form. So you should have:

#button不应该是 type submit,因为您只想使用它来添加到表单而不是提交表单。所以你应该有:

<input type="button" id="button" value="Add input">



Problem 2:

问题2:

You are overwriting your variables. The nameis the variable sent with the form, so each inputaddition must have a new name, or the variable must be an array.

您正在覆盖变量。的name是与形式发送的变量,所以每个input此外必须有一个新的名字,或变量必须是一个数组。

Additionally, you can't have more than one element with the same id.

此外,不能有多个具有相同id.

The simplest way to solve this is to make provaan array by using the form prova[]:

解决这个问题的最简单方法是prova使用以下形式创建一个数组prova[]

$("#button").live('click',function() {
   $("#list").append(
       '<li style="height:20px;">' +
         // Removed repetitive ID and made prova an array
       '<input type="text" class="text" name="prova[]" value="prova"></li>'
   ); 
});

jsFiddle example

jsFiddle 示例

回答by Dazbert

Just to clarify, and putting any other problems aside, @Claudio's note is the correct answer here. I just had the same problem, button type was 'button' and the new element's name was being dynamically incremented. Everything looked fine, but the added elements would not submit.

只是为了澄清,并把任何其他问题放在一边,@Claudio 的注释是这里的正确答案。我只是遇到了同样的问题,按钮类型是“按钮”,并且新元素的名称正在动态递增。一切看起来都很好,但添加的元素不会提交

Then I noticed my form tags were inside the table tags. I moved them outside and it all worked as planned.

然后我注意到我的表单标签在表格标签内。我把它们搬到外面,一切都按计划进行。

回答by MartinodF

You are intercepting the clickevent and adding elements to the form, but the event has already started, and will complete its default action (submit the form) without re-checking the content of the form.

您正在拦截click事件并向表单添加元素,但该事件已经开始,并且将完成其默认操作(提交表单)而无需重新检查表单内容。

You should stop the event after adding the fields (preventDefault should be the right choice), and then re-submit the form.

您应该在添加字段后停止事件(preventDefault 应该是正确的选择),然后重新提交表单。

Something along these lines:

沿着这些路线的东西:

$('#button').live('click', function add(event){
    event.preventDefault();
    $('#list').append(...);
    $('#form').submit();
});

I haven't tested it, but I'm pretty confident that it should work :)

我还没有测试过,但我非常有信心它应该可以工作:)

回答by jsuggs

Have any code to show? In order for php to "see" the vars submitted, you have to ensure that it has the "name" attribute specified on the form elements. I have a feeling your issue is going to be with the jQuery not the php.

有任何代码可以显示吗?为了让 php“看到”提交的变量,你必须确保它具有在表单元素上指定的“名称”属性。我有一种感觉,你的问题是 jQuery 而不是 php。

回答by Thomas

Best guess: You haven't set name attributes for your dynamically added elements.

最佳猜测:您还没有为动态添加的元素设置名称属性。