Koduję dynamiczny upload plików bez przeładowania strony z użyciem iframe'ów. Natrafiłem na pewien problem związany z edycją dopiero co uploadowanych plików. I tak:
- użytkownik wybiera folder i wprowadza do formularza plik, który uploaduje się bezpośrednio do danego katalogu
- generuje się miniaturka, linki i kod html się dokleja do już istniejącego
- Problem pojawia się jednak w dalszym scenariuszu.
Kiedy wgram zdjęcie A i mówię sobie - to nie to. W jego miejsce chcę wgrać zdjęcie B. Operacja wykonuje się (podmiana pliku w bazie + usunięcie starego z serwera, a dodanie nowego). Jednak nie mogę manipulować kodem html.
Oto kod do podmiany pliku - używam go zarówno do elementów , które istniały natywnie, jak i tych generowanych dynamicznie przez JS. Jego problem polega na tym, że w wypadku zdjęć natywnych (które były obecne w momencie wczytywania strony) działa on bez zarzutów. Gorzej z tymi, które są generowane przez JS po załadowaniu strony.
Myślałem też, że zamiast manipulacji na elementach, mógłbym wywoływać u rodzica funkcję, która by tego dokonywała. Jednak po wielu próbach z window.opener.funkcja, parent.opener.funkcja ... straciłem wszelką koncepcję.
Kod
function loadFile(id) {
if ($("#rodzaj").html() == 'image') { alert($("#NOWY").html());
$('#id-'+id, window.parent.document).attr("src" , $("#NOWY").html());
}
else {
$('#id-'+id, window.parent.document).html($("#NOWY").html());
}
}
if ($("#rodzaj").html() == 'image') { alert($("#NOWY").html());
$('#id-'+id, window.parent.document).attr("src" , $("#NOWY").html());
}
else {
$('#id-'+id, window.parent.document).html($("#NOWY").html());
}
}