CodeIgniter Forums
Jquery manipulation with previously jquery loaded data - Printable Version

+- CodeIgniter Forums (https://forum.codeigniter.com)
+-- Forum: Archived Discussions (https://forum.codeigniter.com/forumdisplay.php?fid=20)
+--- Forum: Archived Development & Programming (https://forum.codeigniter.com/forumdisplay.php?fid=23)
+--- Thread: Jquery manipulation with previously jquery loaded data (/showthread.php?tid=55027)



Jquery manipulation with previously jquery loaded data - El Forum - 10-06-2012

[eluser]trta911[/eluser]
Hi all,
I'm working in uploadify integration on CI and have trouble, when I upload some photos, then those photos with jquery display on the page ...and I append to each of photo ability to delete (without reloading page), but this is not working - I build simple example what is wrong and what I need:

Code:
<body>
<h1>Test jQuery</h1>
[removed]
$(function(){
$("#img1").click(function(){
$("#img1").hide();
$("#target").replaceWith('<p id="target2">Hello</p>'+'<img id="test2" src="cross.png" alt="cross.png, 655B" title="Cross" border="0" height="16" width="16">');
});

$("#test2").click(function(){
alert("OK");
});

});
[removed]
<img id="img1" src="cross.png" alt="cross.png, 655B" title="Cross" border="0" height="16" width="16">
<p id="target">This is a test</p>


&lt;/body&gt;

So I need, after jQuery loads results, that this results pass another jquery action (and ajax).

Thanks for help.


Jquery manipulation with previously jquery loaded data - El Forum - 10-06-2012

[eluser]jmadsen[/eluser]
The issue you are having is because the image html is generated code, and so not bound to the jquery code

The easiest fix is to use .live('click', function(){...}) instead (or .on() is recommended now, but it isn't 100% the same)

http://api.jquery.com/live/


Jquery manipulation with previously jquery loaded data - El Forum - 10-06-2012

[eluser]trta911[/eluser]
Wow!
very thanks this is exactly what I need!

Once again very thanks.


Jquery manipulation with previously jquery loaded data - El Forum - 10-06-2012

[eluser]skunkbad[/eluser]
[quote author="jmadsen" date="1349569528"]The issue you are having is because the image html is generated code, and so not bound to the jquery code

The easiest fix is to use .live('click', function(){...}) instead (or .on() is recommended now, but it isn't 100% the same)

http://api.jquery.com/live/[/quote]

.on() isn't quite the same, but should be used instead of .live() because you will end up making code that is instantly outdated if you use the deprecated .live() method.

See:
http://www.jquery4u.com/jquery-functions/on-vs-live-review/#.UHEFI1G4LTo
http://stackoverflow.com/questions/8477779/jquery-on-versus-live
http://www.andismith.com/blog/2011/11/on-and-off/
and a thousand more if you search on Google!

I always liked .live() because it was a instant swap for .bind(), but you gotta do what you gotta do. (unless you're using an old version of jQuery and then you don't gotta do what you can't do)