Javascript ile açılan popup pencereden kök pencereye form değerleri (textfield) taşıyabilir hatta popup üzerindeki herhangi bir eleman ile kök formu submit edebilirsiniz.
Bu işlev için önce kök sayfada (main.html) <head> </head> tagları arasına şu kodları ekliyoruz:
1 2 3 4 5 6 7 8 9 10 | <script language="JavaScript"> <!-- myPopup = ''; function openPopup(url) { myPopup = window.open(url,'popupWindow','width=400,height=200'); if (!myPopup.opener) myPopup.opener = self; } //--> </script> |
Daha sonra bu sayfadaki formu ve popup pencereden gönderilecek olan metnin yazdırılacağı textfield’i ayarlıyoruz (<body> </body> tagları arasına):
1 2 3 4 | <form name="kokForm"> <input type="button" value="Popup Aç" onClick="openPopup('popup.html')"><br><br> <input name="deger" type="text"> <input type="submit" value="Formu Gönder"> </form> |
Sıra popup pencereyi ayarlamaya geldi (popup.html), yine <head> </head> tagları arasına aşağıdaki javascript kodlarını ekliyoruz:
1 2 3 4 5 6 7 8 9 10 | <script language="JavaScript"> <!-- function copyForm() { opener.document.kokForm.deger.value = document.popupForm.girilecek.value; // opener.document.kokForm.submit(); // Kök sayfadaki formu submit etmek için // window.close(); // Popup pencereyi kapatmak için return false; } //--> </script> |
Burdaki “// opener.document.kokForm.submit();” ifadesi main.html isimli kök sayfamızdaki formu popup pencere üzerinden submit etmeye yarıyor, satır başındaki // ifadesini kaldırarak aktif olmasını sağlayabilirsiniz. Yine “// window.close();” de adından da anlaşılabileceği üzere popup pencerenin form elemanı gönderildikten sonra kapatılmasını sağlıyor, onun da başındaki // ifadelesini kaldırarak aktif olmasını sağlayabilirsiniz.
Daha sonra popup pencere içerisindeki formu ve kök pencereye gönderilecek değeri içerecek olan text inputunu bir kaç satırla ayarlıyoruz (<body> </body> tagları arasına):
1 2 3 | <form name="popupForm" onSubmit="return copyForm()"> <input type="text" name="girilecek"> <input type="button" value="Ekle" onClick="copyForm()"> </form> |
Hepsi bu kadar, bilinen tarayıcılar tarafından desteklenen ve bir o kadar basit nur topu gibi bir scriptimiz oldu. main.html ve popup.html isimleriyle kaydettiğiniz sayfaları şimdi test edebilirsiniz.
Scriptin detaylı örneği için:
Demo
ben bu adamı seviyorum ya :)
paylasim icin tsk ederim
O adam da sana karşı boş değil Ahmet :)
merhaba,
paylaşımlarınız çok güzel.
ben bu şekilde popup pencereden veri tabanında arama yapıp çıkan sonuçlardan seçtigim degeri kök pencereye göndermek istiyorum bunu nasıl yapabiliriz. burada input daki veriyi kök pencereye atıyor istedigim şekilde yapamadım yardım ederseniz çok sevinirim
iyi çalışmalar baarılarınızın devamını dilerim..
günlerdir tabiri caizse debelenerek bunu aradım :D şimdi mutluluklardayım
Arkadaslar ben bu örneğe bakarak benzer bir uygulama yaptım ancak bu uygulama benm bılgısayarımda calısııyor baska bilgisayarlarda denettim olmuyor yani ana forma göndermiyor. herhangi bir yolda belirtmedim… :S Fikri olan var mı?
eline sağlık panpa.
merhaba,
paylaşımlarınız için teşekkürler.
ben bu şekilde popup pencereden veri tabanında arama yapıp çıkan sonuçlardan seçtigim degeri kök pencereye göndermek istiyorum bunu nasıl yapabiliriz. burada input daki veriyi kök pencereye atıyor istedigim şekilde yapamadım yardım ederseniz çok sevinirim
iyi çalışmalar baarılarınızın devamını dilerim..
Teşekkürler işimizi gördük sayenizde
hocam peki aynı şeklde linkin üzerine maus üzerine geldiği zaman açılıanı nasıl yaparız
buna benzer bir şey lazım bana.
bir sayfadan popup açılacak.
popup açan sayfada – popup açıldı – yazacak
eğer popup kapanırsa – popup kapandı – yazacak.
bu kod hakkında yardımcı olur musunuz?