2012年11月1日 星期四

Javascript 開新視窗並帶回參數


最近工作上有一個需求是要
開新視窗讓使用者去挑選資料,並將資料直接填回控制項。
//首先 在A 網頁 
//建立javascript 程式碼跟 3個控制項
 <script type="text/javascript">
function opena(idControla, idControlb)    //opena 方法帶入兩個參數
{
var OpenPage = window.open('tt2.aspx?idControla=' + idControla +'&idControlb=' + idControlb);
 //再來就是開啟新網頁並加上控制項參數  
} </script>
--------------------------------------------------------------------
<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
<asp:TextBox ID="TextBox2" runat="server"></asp:TextBox>
<asp:Button ID="Button1" runat="server" Text="Button" />
當我們按下 Button1 時,要將A網頁的控制項傳給B 網頁

protected void Page_Load(object sender, EventArgs e)
{
Button1.Attributes["onclick"] = "opena('" + TextBox1.ClientID + "','" +
                                TextBox2.ClientID + "');return false;";
}
//接下來是 B網頁
//先建立 javascript 程式碼 跟三個控制項
 <script type="text/javascript">
        function openA(controla, valuea, controlb, valueb) {
            window.opener.window.document.getElementById(controla).value = valuea;
            window.opener.window.document.getElementById(controlb).value = valueb;
            window.close();
        }
    </script>
----------------------------------------------------------------
<asp:TextBox ID="TextBox1" runat="server" Text="123"></asp:TextBox>
<asp:TextBox ID="TextBox2" runat="server" Text="456"></asp:TextBox>
<asp:Button ID="Button1" runat="server" Text="Button" onclick="Button1_Click" />
-----------------------------------------------------------------------
//在button1 的click 事件 下做處裡

protected void Button1_Click(object sender, EventArgs e)
{
 string controla = Request["idControla"]; //設定控制項,因為傳回去的時候要指定控制項並填值
 string controlb = Request["idControlb"]; 
 ClientScript.RegisterStartupScript(GetType(),"open""openA('" +
              controla + "','" + this.TextBox1.Text +"','" + 
              controlb +"','"  this.TextBox2.Text + "');"true);
}
第一次打程式文章,花了快40分鐘......沒寫幾句話@@
為了讓大家能複製程式碼,所以沒用拍照的。






後續:
當控制項為 Label 時,你就會發現,為什麼數值傳不回來!
用Debug 模式去看,卻發現,有傳回來啊,為什麼Label.Text 不接受呢?

後來經過高手指導才知道,原來要用 innerHTML  或是 innerText

範例:
window.opener.window.document.getElementById(controlb).innerHTML = valueb;




沒有留言:

張貼留言