最近在一個項目中，由于根據需求，需要增加一個概覽頁面，也就是最高權限使用者可以對全局概況有一個總的了解，下面就來簡單介紹下，主要是對于其中實作的部分小技巧做一下總結。貼圖示例如下：
在這個頁面中一個frameset裡有三個frame，分為左中右三個部分，中間是顯示部分，右邊的上半部分是快速查詢部分，裡面主要是由三個下拉框和一個單選框組成，通過點選按鈕将參數傳遞到另外一個頁面，并且這個頁面是在中間的frame裡顯示最終的結果。
看代碼：
<script type="text/javascript" language="javascript">
function openWindow()
{
var year = document.getElementById("ddlYear").options[document.getElementById("ddlYear").selectedIndex].text;
var city = document.getElementById("ddlCity").options[document.getElementById("ddlCity").selectedIndex].value;
var county = document.getElementById("ddlCounty").options[document.getElementById("ddlCounty").selectedIndex].value;
var rbltable =document.getElementById("rblType");
var rbs= rbltable.getElementsByTagName("INPUT");
for(var i = 0;i<rbs.length;i++)
{
if(rbs[i].checked)
{
var option =rbltable.cells[i].innerText;
}
}
var url = "result.aspx?year=" + year + "&city=" + city + "&county=" + county + "&type=" +escape(option);
window.open(url,'center','height=100%,width=100%,status=no,toolbar=no,menubar=no,scrollbars=no,location=no');
}
</script>
...
<input type="button" value="查詢" OnClick="openWindow()" />
....
以上是在js中擷取伺服器端控件dropdownlist和radiobuttonlist控件值的方法：
dropdownlist控件：
var city = document.getElementById("ddlCity").options[document.getElementById("ddlCity").selectedIndex].value;
------------------------------------------------------------------------------------------------------------------------------------radiobuttonlist控件：
var rbltable =document.getElementById("rblType");
var rbs= rbltable.getElementsByTagName("INPUT");
for(var i = 0;i<rbs.length;i++)
{
if(rbs[i].checked)
{
var option =rbltable.cells[i].innerText;
}
}
這裡其實可以在背景cs檔案裡擷取到控件的值，并實作跳轉，不錯，是可以，但是會有點顯示的小問題，就是按鈕點選過後，radiobuttonlist控件裡的文字變大了，很是難看。
背景裡擷取值很簡單：
string year = Request.QueryString["year"].ToString();
string city = Request.QueryString["city"].ToString();
string county = Request.QueryString["county"].ToString();
string type = Server.UrlDecode(Request.QueryString["type"].ToString()).ToString();
然後做簡單處理即可。中間的frame後來的顯示效果如下圖：
