2017-10-06 123 views
1

所以我有这个基本的引导形式和我有一个名为按钮添加另一个地点将动态地创建另一个4个输入,以增加更多的位置。这是通过jQuery和jQuery UI实现的。所以我制作了3份这种形式的表格,并将它们放在一个列表中,因为最终,它们将来自服务器并循环,表格取决于可用的许多信息集。我遇到的问题是,只有我的第一个添加另一个位置按钮的作品,它也创造了第二和第三个额外的投入。我可以给新窗体上的按钮赋予不同的id/class,但这样做对我来说没有任何好处,因为可以通过服务器显示更多或更少的窗体。我的问题是,每个按钮如何独立运作而不会给予不同的id/class。所以如果我点击在第二组窗体上添加另一个位置按钮,它仅在第二组上创建附加输入,而不是第一组或第三组,第一组和第三组相同。JQuery的,通过按钮不是形式列表创建工作表单输入

这是jQuery的代码,克隆并追加新的投入

$("#pm-do-clone1").click(function() { 

    $(".pm-clone-this3 .pm-clone4").clone().appendTo(".pm-clone-here1"); 
}); 

,这里是我的jsfiddlehttps://jsfiddle.net/jaisilchacko/yqvd4Lvv/4/ PS:第一添加位置也没有创造新投入的小提琴,但它的工作原理在我本地。可能是一个外部资源问题

+0

您正在向DOM动态添加新元素。点击(函数(){'到这个'$(document).on('click','#pm-do-clone1',function(){ '。这将允许你应用一个点击事件添加在DOM之前和之后添加的元素 –

回答

1

好吧,据我所知你必须抓住点击按钮通过referancing它;

$("#pm-do-clone1").click(function() { 
$(this).//rest of the code 

,并在代码的其余部分,因为我们拍摄的点击一个,我们现在必须找到它的父,我们要去添加新的投入。例如,

var y = document.createElement('input'); 
var x =$(this).parents('.form'); 
$(x).append(y); 

编辑:顺便说一句,你点击一个ID,ID是不是抓一个从多个elemets,因为它有时会犯错误,使用类,而不是最好的模式。

编辑2:请检查此片段。我相信这会帮助你。 View DEMO

EDIT3:为什么你们每个包装投入的div?似乎没有必要不要创建太多元素,因为只有输入才能达到相同的结果。

+0

真棒谢谢。 –

相关问题