Situacija je sledeća: Imam više slika na stranici, klikom na njih otvaram dijalog (klasičan lightbox/iframe) za upload nove slike. Kada se izabere slika vrši se klasičan upload i na toj stranici se ispisuje JS kod koji menja sliku na koju je kliknuto.
HTML:
HTML kôd:
<img src="default-thumb.jpg" data-big="default.jpg" />
<img src="default-thumb.jpg" data-big="default.jpg" />
<img src="default-thumb.jpg" data-big="default.jpg" />
<img src="default-thumb.jpg" data-big="default.jpg" />
JS:
PHP kôd:
//ovo ide u document.ready
$('img').click(function() {
//oznacim sliku (trebace mi kasnije)
$(this).addClass('replace-this-image');
//otvori lightbox
$.lightbox('replace.php');
});
replace.php (nakon sto sačuva uploadovani fajl)
PHP kôd:
$(document).ready(function () {
//cisto primer, PHP generiše ovaj JS objekat
var slikaObj = {uri: 'putanja/do/thumb-slike.jpg', big: 'putanja/do/slike.jpg'};
//dohvatam DOM slike
var slika = $('.replace-this-image', window.parent.document); //probao sam i sa window.parent.$('.replace-this-image'); i dobijam iste rezultate
//postavljam src, data('big') i uklanjam css klasu
$(slika).attr('src', slikaObj.uri);
$(slika).data('big', slikaObj.big);
$(slika).removeClass('replace-this-image');
//test
alert($(slika).data('big')); //dobijam putanja/do/slike.jpg, očekivano
window.parent.$.lightbox.close(); //zatvaram popup dialog
});
Kada se zatvori lightbox i opet pročitam data-big vrednost slike koja je promenjena(
alert($(slika).data('big'));), dobijam prvobitnu vrednost (default.jpg) dok sve ostalo radi (src je promenjen). Kako da i nakon zatvaranja lightboxa data('big') ima vrednost koja je postavljena iz iframe-a?