JavaScript 彈出窗體點擊按鈕返回選擇數(shù)據(jù)的實現(xiàn)
更新時間:2010年04月01日 20:57:23 作者:
這兩天一直想實現(xiàn)這個,以前做做個Demo,但是不知道跑哪去了。于是今天在網(wǎng)上找了些資料再自己動手搞定。廢話不多說。直接進入主題啦。
首先是父頁面的代碼:
<head runat="server">
<title>無標題頁</title>
<%-- <script type="text/javascript">
function openDia() {
var returned = window.showModalDialog("Default4.aspx?" + (new Date()), window);
if (returned) {
document.getElementById("ret").innerHTML = returned;
}
else {
document.getElementById("ret").innerHTML = "";
}
}
</script> --%>
<script type="text/javascript">
function openDia(){
var returned = window.showModalDialog("Default3.aspx?" + (new Date()), window);
if (returned){
document.getElementById("tbtext").value = returned;
}
else{
document.getElementById("tbtext").value = "";
}
}
</script>
</head>
<body>
<form id="form1" runat="server">
<div id="ret">
<input id="tbtext" type="text" value="" onclick="openDia();return false;" />
</div>
<asp:Button ID="Button1" runat="server" Text="Button" OnClientClick="openDia();return false;" />
<input id="Hidden1" type="hidden" runat="server" />
</form>
</body>
</html>
關于加上那個 (new Data()) 是要避免showModalDialog頁面自動緩存的問題,導致第二次打開頁面,數(shù)據(jù)沒有被刷新,這是因為showModalDialog頁面如果每次的URL一樣的話,它會自動顯示以前在緩存里面的數(shù)據(jù)。
接著是子頁面Default3.aspx的代碼:
<head runat="server">
<title>無標題頁</title>
<script type="text/javascript">
function getSelected(data) {
var str = data;
window.returnValue = str.toString();
window.close();
}
</script>
<base target="_self"/>
</head>
<body>
<form id="form1" runat="server" target="">
<div>
<asp:GridView ID="GridView1" runat="server" OnRowDataBound="GridView1_RowDataBound">
<Columns>
<asp:TemplateField>
<ItemTemplate>
<asp:LinkButton id="lnkSelect2" runat="server" Text="Select" > </asp:LinkButton>
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
</div>
</form>
</body>
</html>
Default3.aspx里面有一個gridview控件,數(shù)據(jù)綁定(自己去綁定,代碼就不貼上來了)好后,就是選擇自己需要的數(shù)據(jù)了。
Default3.aspx.cs:
[code]
protected void GridView1_RowDataBound(object sender, GridViewRowEventArgs e)
{
if (e.Row.RowType == DataControlRowType.DataRow)
{
LinkButton b = (LinkButton)e.Row.FindControl("lnkSelect2");
b.Attributes.Add("OnClick", "javascript:getSelected('" + e.Row.Cells[1].Text + "');");
}
}
[html]
其中Default3.aspx中<head></head>之間的<base target="_self"/>和<form target="">作用是可以避免子頁面點擊選擇按鈕后彈出第三個窗體。
例子就這樣,具體還是要根據(jù)自己的需求s去體驗和改進。
復制代碼 代碼如下:
<head runat="server">
<title>無標題頁</title>
<%-- <script type="text/javascript">
function openDia() {
var returned = window.showModalDialog("Default4.aspx?" + (new Date()), window);
if (returned) {
document.getElementById("ret").innerHTML = returned;
}
else {
document.getElementById("ret").innerHTML = "";
}
}
</script> --%>
<script type="text/javascript">
function openDia(){
var returned = window.showModalDialog("Default3.aspx?" + (new Date()), window);
if (returned){
document.getElementById("tbtext").value = returned;
}
else{
document.getElementById("tbtext").value = "";
}
}
</script>
</head>
<body>
<form id="form1" runat="server">
<div id="ret">
<input id="tbtext" type="text" value="" onclick="openDia();return false;" />
</div>
<asp:Button ID="Button1" runat="server" Text="Button" OnClientClick="openDia();return false;" />
<input id="Hidden1" type="hidden" runat="server" />
</form>
</body>
</html>
關于加上那個 (new Data()) 是要避免showModalDialog頁面自動緩存的問題,導致第二次打開頁面,數(shù)據(jù)沒有被刷新,這是因為showModalDialog頁面如果每次的URL一樣的話,它會自動顯示以前在緩存里面的數(shù)據(jù)。
接著是子頁面Default3.aspx的代碼:
復制代碼 代碼如下:
<head runat="server">
<title>無標題頁</title>
<script type="text/javascript">
function getSelected(data) {
var str = data;
window.returnValue = str.toString();
window.close();
}
</script>
<base target="_self"/>
</head>
<body>
<form id="form1" runat="server" target="">
<div>
<asp:GridView ID="GridView1" runat="server" OnRowDataBound="GridView1_RowDataBound">
<Columns>
<asp:TemplateField>
<ItemTemplate>
<asp:LinkButton id="lnkSelect2" runat="server" Text="Select" > </asp:LinkButton>
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
</div>
</form>
</body>
</html>
Default3.aspx里面有一個gridview控件,數(shù)據(jù)綁定(自己去綁定,代碼就不貼上來了)好后,就是選擇自己需要的數(shù)據(jù)了。
Default3.aspx.cs:
[code]
protected void GridView1_RowDataBound(object sender, GridViewRowEventArgs e)
{
if (e.Row.RowType == DataControlRowType.DataRow)
{
LinkButton b = (LinkButton)e.Row.FindControl("lnkSelect2");
b.Attributes.Add("OnClick", "javascript:getSelected('" + e.Row.Cells[1].Text + "');");
}
}
[html]
其中Default3.aspx中<head></head>之間的<base target="_self"/>和<form target="">作用是可以避免子頁面點擊選擇按鈕后彈出第三個窗體。
例子就這樣,具體還是要根據(jù)自己的需求s去體驗和改進。
相關文章
Firefox下提示illegal character并出現(xiàn)亂碼的原因
Firefox下提示illegal character并出現(xiàn)亂碼的問題,時間是是因為編碼的問題導致。2010-03-03Jquery Autocomplete 結合asp.net使用要點
Jquery的Autocomplete是一個很好的智能提示插件,但是在實際使用過程中還是會遇到一些小問題.2010-10-10uniapp實現(xiàn)app檢查更新與升級詳解(uni-upgrade-center)
UniApp是一個跨平臺的開發(fā)框架,可以同時開發(fā)iOS和Android應用,下面這篇文章主要給大家介紹了關于uniapp實現(xiàn)app檢查更新與升級(uni-upgrade-center)的相關資料,需要的朋友可以參考下2023-11-11JavaScript數(shù)據(jù)類型轉換詳解(推薦)
眾所周知JavaScript是一門弱類型(語言,即變量的類型是不確定的。所以下面這篇文章主要給大家介紹了關于JavaScript數(shù)據(jù)類型轉換的相關資料,需要的朋友可以參考下2021-05-05JS實現(xiàn)的用來對比兩個用指定分隔符分割的字符串是否相同
這篇文章主要介紹了JS實現(xiàn)的用來對比兩個用指定分隔符分割的字符串是否相同,本文代碼為特殊需要而寫,需要的朋友可以參考下2014-09-09