CODEWITHSUNDEEP
jqueryjquery-mobile
SocialCircus
SocialCircus

Reputation: 2170

jQuery: Cloned dropdown does not react to change

I have a div cloned to a jQuery object, such as:-

$dependent = $page.find("div[data-name=dependent]").clone();

This $page.find("div[data-name=dependent]") is hidden i.e display: none in HTML.

Now the cloned div has a <select> which a obviously cloned too. I make a few modifications to the $dependent such as:-

$dependent.attr("data-name", "dependent-clone");
$dependent.find("a").attr("onclick", 'functionCall()');

No changes are made to the <select> .

Now when I append the cloned div i.e. $dependent, the dropdown does not display the changed values. It responds to the onChange() event but does not display the changed value.

I am using jquery-1.6.4.js and jquery.mobile-1.0.1.js.

Any ideas?

Upvotes: 0

Views: 1077

Answers (1)

Tats_innit
Tats_innit

Reputation: 34107

Hiya working demo :) http://jsfiddle.net/EGQEL/7/ (Please let me know if I missed anything)

Binding need to happen on the dynamic append use .on or .live in latest Jquery .on replaces .live

.on can be used instead of .live

also this will be helpful : http://jsfiddle.net/pbWEp/2/ Link==> copy/Clone dropdown list with selected option in jquery

OR http://jsfiddle.net/ZTF5J/2/ - link==> drop-down clone add and remove using jquery

OR you can provide your jsfiddle I might take a look; Please note above jsfiddle is there to give you a tip :)

Hope this helps, have a nice one, cheers!

Upvotes: 1

Related Questions