2017-10-06 58 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

真棒謝謝。 –

相關問題