父子視窗傳值

承前面一篇的民國年份之月曆開發,在點選完日期後當然要將日期傳回至本來的父視窗,這時就面臨傳值的問題,以下為透過javascript的2個小方法。
(假設父視窗叫做parent.aspx,用來放置小月曆的子視窗叫做child.aspx)

1.方法一
開啟方式:window.open
傳值方式:opener

開啟方式ex:window.open('child.aspx','月曆選取器','width=300,height=300')
傳值方式ex:opener.form1.SelectDay.value = day;
(form1是父視窗的form名稱,SelectDay是父視窗裡面的一個text input,day就是子視窗小月曆提供的值)


2.方法二
開啟方式:window.showModalDialog
傳值方式:window.dialogArguments.form1.SelectDay.value = day;

開啟方式ex:window.showModalDialog('child.aspx',window,'dialogWidth:300;dialogHeight:300;')
傳值方式ex:window.dialogArguments.form1.SelectDay.value = day;
(form1是父視窗的form名稱,SelectDay是父視窗裡面的一個text input,day就是子視窗小月曆提供的值)

[心得]
★上述2種方法都可,要注意的是方法二要能讓父子視窗互動的話,一定要在showModalDialog的第2個參數填上window
★之所以後來採用方法二,是為了讓視窗永遠focus在child.aspx並顯示為最上層,這樣使用者在開啟child.aspx視窗後,就不會有忘記視窗已開啟而誤以為網頁無法傳值的問題!

1 則留言:

piggy 提到...

上次寫這篇還沒有安裝IE8...
如果javascript的函示要確實work,記得要把指定的視窗大小(例如文中的300)給定單位...也就是300px,不然IE8會裝傻開一個全螢幕大的視窗XD