asp.net下用js实现弹出子窗口选定值并返回
生活随笔
收集整理的這篇文章主要介紹了
asp.net下用js实现弹出子窗口选定值并返回
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
對應上一篇博客代碼：
父頁面：
1 <head runat="server"> 2 <meta http-equiv="X-UA-Compatible" content="IE=9" > 3 <title></title> 4 <script type="text/javascript"> 5 function test() { 6 //window.showModalDialog("test.aspx?tabname=book", window, 'dialogHeight=400px;dialogWidth=600px;'); 7 window.showModalDialog("B.aspx", window, 'dialogHeight=400px;dialogWidth=600px;'); 8 } 9 </script> 10 </head> 11 <body> 12 <form id="form1" runat="server"> 13 <div> 14 <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox> 15 <asp:Button ID="Button1" runat="server" Text="跳轉到B頁面" OnClientClick="test();"/><br /> 16 <asp:TextBox ID="TextBox2" runat="server"></asp:TextBox> 17 </div> 18 </form> 19 </body> 20 </html>框架法（fream包含gridview頁面）：
框架子頁面：
1 <html xmlns="http://www.w3.org/1999/xhtml"> 2 <head runat="server"> 3 <meta http-equiv="X-UA-Compatible" content="IE=9" > 4 <title></title> 5 <script type="text/javascript"> 6 function test() { 7 var child; 8 child = window.document.getElementById("child").contentWindow; 9 window.dialogArguments.document.getElementById("TextBox1").value = child.document.getElementById("tb_name").value; 10 window.close(); 11 } 12 </script> 13 </head> 14 <frameset> 15 <frame id="child" src="CZB.aspx?tabname=<%=set_tabname()%>"></frame> 16 </frameset> 17 </html>gridview頁面：
1 <html xmlns="http://www.w3.org/1999/xhtml"> 2 3 <head runat="server"> 4 <meta http-equiv="X-UA-Compatible" content="IE=9" > 5 <title></title> 6 <script type="text/javascript"> 7 function set() { 8 window.parent.test(); 9 } 10 </script> 11 </head> 12 <body> 13 <form id="form1" runat="server" > 14 <div> 15 <asp:TextBox ID="tb_name" runat="server"></asp:TextBox> 16 <asp:Button ID="bt_in" runat="server" Text="搜索" onclick="bt_in_Click" /> 17 <asp:Button ID="bt_re" runat="server" Text="重置" /> 18 <asp:Button ID="Button1" runat="server" Text="確認選擇" onclick="Button1_Click" /> 19 <input id="Button2" type="button" value="回傳" onclick="set();"/> 20 21 <asp:GridView ID="gvSell" runat="server" 22 onpageindexchanging="GridView1_PageIndexChanging" PageSize="5" > 23 <Columns> 24 <asp:TemplateField HeaderText="數據選擇"> 25 <ItemTemplate> 26 <asp:CheckBox ID="CheckBox1" runat="server" /> 27 </ItemTemplate> 28 </asp:TemplateField> 29 </Columns> 30 <PagerSettings FirstPageText="首頁" LastPageText="末頁" NextPageText="下一頁" PageButtonCount="5" PreviousPageText="上一頁" /> 31 <PagerStyle Font-Names="宋體" Font-Size="15px" /> 32 </asp:GridView> 33 <div class="gridItem" style="padding: 5px; margin: 0px; border: 0; width: 40%; float: left; text-align: left; height: 20px; font-size: 15px;" aria-multiselectable="True"> 共有<span id="spanTotalInfor"></span>條記錄 當前第<span id="spanPageNum"></span>頁 共<span id="spanTotalPage"></span>頁</div> 34 <div class="gridItem" style=" border-style: none; border-color: inherit; border-width: 0; padding: 5px; width: 225px; float: right; text-align: center; height: 20px; vertical-align: middle; font-size: 15px;"> <span id="spanFirst" ><img src='img/first.png'/></span> <span id="spanPre"><img src='img/back.png'/></span><span id="spanInput" style="margin: 0px; padding: 0px 0px 4px 0px; height:100%; "> 第<input id="Text1" type="text" class="TextBox" onkeyup="x()" style="height:20px; text-align: center" />頁 </span><span id="spanNext"><img src='img/front.png'/></span> <span id="spanLast"><img src='img/last.png'/></span> 35 36 </div> 37 </div> 38 39 </form> 40 </body> 41 </html>gridview后臺頁面：
1 public partial class CZB : System.Web.UI.Page 2 { 3 string str = WebConfigurationManager.ConnectionStrings["TempleConnectionString"].ConnectionString; 4 protected void databind(string sql) 5 { 6 using (SqlConnection conn = new SqlConnection(str)) 7 { 8 conn.Open(); 9 using (SqlCommand cmd = conn.CreateCommand()) 10 { 11 12 cmd.CommandText = sql; 13 SqlDataAdapter ap = new SqlDataAdapter(cmd); 14 DataSet ds = new DataSet(); 15 ap.Fill(ds); 16 gvSell.DataSource = ds.Tables[0]; 17 gvSell.DataBind(); 18 } 19 } 20 } 21 protected void Page_Load(object sender, EventArgs e) 22 { 23 if (!IsPostBack) 24 { 25 databind("select * from book"); 26 } 27 } 28 protected void Button1_Click(object sender, EventArgs e) 29 { 30 string strs=""; 31 for (int i = 0; i <= gvSell.Rows.Count - 1; i++) 32 { 33 CheckBox cbox = (CheckBox)gvSell.Rows[i].FindControl("CheckBox1"); 34 if (cbox.Checked == true) 35 { 36 strs = gvSell.Rows[i].Cells[3].Text.ToString(); 37 tb_name.Text = strs; 38 } 39 } 40 } 41 42 43 protected string getvalue() 44 { 45 string str; 46 for (int i = 0; i <= gvSell.Rows.Count - 1; i++) 47 { 48 CheckBox cbox = (CheckBox)gvSell.Rows[i].FindControl("CheckBox1"); 49 if (cbox.Checked == true) 50 { 51 return gvSell.Rows[i].Cells[3].Text.ToString(); 52 } 53 } 54 return "0"; 55 } 56 57 protected void bt_in_Click(object sender, EventArgs e) 58 { 59 string sql = "select * from book where bookName like '%" + tb_name.Text + "%'"; 60 databind(sql); 61 } 62 protected void GridView1_PageIndexChanging(object sender, GridViewPageEventArgs e) 63 { 64 gvSell.PageIndex = e.NewPageIndex; 65 databind("select * from book"); 66 } 67 }js實現方法：
1 <html xmlns="http://www.w3.org/1999/xhtml"> 2 <head runat="server"> 3 <title></title> 4 <script type="text/javascript"> 5 function getvalue() { 6 var table = document.getElementById("gvSell"); 7 var s=0; 8 for(var i=1;i<table.rows.length;i++) { 9 var input = table.rows[i].cells[0].getElementsByTagName("input")[0].checked; 10 if (input == true) 11 { 12 window.dialogArguments.document.getElementById("TextBox1").value = table.rows[i].cells[3].innerHTML; 13 s = 1; 14 window.close(); 15 } 16 } 17 if(s!=1) 18 alert("您未勾選任何一個選項！"); 19 } 20 //搜索 21 function search() { 22 var content = document.getElementById(tb_name).value; 23 if (content == "") { 24 alert("您未輸入任何內容！"); 25 return; 26 } 27 var table = document.getElementById("gvSell"); 28 var txt = document.getElementById("tb_name").value; 29 var arr = new Array(); 30 var j = 0;var judge = 0; 31 //獲取相關行數 32 for (var i = 1; i < table.rows.length; i++) { 33 if (table.rows[i].cells[3].innerHTML == txt || table.rows[i].cells[3].innerHTML.indexOf(txt) > -1) 34 { 35 arr[j] = i; 36 j++; 37 } 38 } 39 if (j == 0) { 40 alert("未找到有關數據！"); 41 return; 42 } 43 //刪除無關的行 44 for (i = i-1; i > 0; i--) { 45 judge=0; 46 for (var k = 0; k < j; k++) 47 if (arr[k] == i) 48 judge = 1; 49 if (judge == 0) 50 document.getElementById("gvSell").deleteRow(i); 51 52 } 53 y(); 54 } 55 56 function delet() { 57 document.getElementById("tb_name").value = ""; 58 } 59 </script> 60 61 62 </head> 63 <body> 64 <form id="form1" runat="server"> 65 <div> 66 <input id="tb_name" type="text" /> 67 <input id="Button3" type="button" value="搜索" onclick="search();"/> 68 <input id="Button1" type="button" value="選擇" onclick="getvalue();"/> 69 <input id="Button2" type="button" value="重置" onclick="delet();"/> 70 <input id="tb_hidden" type="text" style="visibility: hidden" /> 71 <asp:GridView ID="gvSell" runat="server" > 72 <Columns> 73 <asp:TemplateField HeaderText="數據選擇"> 74 <ItemTemplate> 75 <input id="Checkbox2" type="checkbox" /> 76 </ItemTemplate> 77 </asp:TemplateField> 78 </Columns> 79 80 81 </asp:GridView> 82 <div class="gridItem" style="padding: 5px; margin: 0px; border: 0; width: 40%; float: left; text-align: left; height: 20px; font-size: 15px;" aria-multiselectable="True"> 共有<span id="spanTotalInfor"></span>條記錄 當前第<span id="spanPageNum"></span>頁 共<span id="spanTotalPage"></span>頁</div> 83 <div class="gridItem" style=" border-style: none; border-color: inherit; border-width: 0; padding: 5px; width: 225px; float: right; text-align: center; height: 20px; vertical-align: middle; font-size: 15px;"> <span id="spanFirst" ><img src='img/first.png'/></span> <span id="spanPre"><img src='img/back.png'/></span><span id="spanInput" style="margin: 0px; padding: 0px 0px 4px 0px; height:100%; "> 第<input id="Text1" type="text" class="TextBox" onkeyup="x()" style="height:20px; text-align: center" />頁 </span><span id="spanNext"><img src='img/front.png'/></span> <span id="spanLast"><img src='img/last.png'/></span> 84 </div> 85 </div> 86 <script type="text/javascript"> 87 var theTable = document.getElementById("gvSell"); 88 var txtValue = document.getElementById("Text1").value; 89 function y() { 90 theTable = document.getElementById("gvSell"); 91 txtValue = document.getElementById("Text1").value; 92 renovate(); 93 } 94 function x() { 95 var txtValue2 = document.getElementById("Text1").value; 96 if (txtValue != txtValue2) { 97 if (txtValue2 > pageCount()) { 98 99 } 100 else if (txtValue2 <= 0) { 101 102 } 103 else if (txtValue2 == 1) { 104 first(); 105 106 } 107 else if (txtValue2 == pageCount()) { 108 last(); 109 110 } 111 else { 112 hideTable(); 113 page = txtValue2; 114 pageNum2.value = page; 115 116 currentRow = pageSize * page; 117 maxRow = currentRow - pageSize; 118 if (currentRow > numberRowsInTable) currentRow = numberRowsInTable; 119 for (var i = maxRow; i < currentRow; i++) { 120 theTable.rows[i].style.display = ''; 121 } 122 if (maxRow == 0) { preText(); firstText(); } 123 showPage(); 124 nextLink(); 125 lastLink(); 126 preLink(); 127 firstLink(); 128 } 129 130 txtValue = txtValue2; 131 } 132 } 133 function renovate() { 134 numberRowsInTable = theTable.rows.length - 1; //table值發生變化 更新分頁 135 for (var i = pageSize + 1; i < numberRowsInTable + 1; i++) { 136 theTable.rows[i].style.display = 'none'; 137 } 138 for (var j = 0; j <= 5; j++) { 139 if (j > numberRowsInTable) 140 break; 141 theTable.rows[j].style.display = ''; 142 } 143 inforCount(); 144 145 totalPage.innerHTML = pageCount(); 146 showPage(); 147 pageNum2.value = page; 148 149 if (pageCount() > 1) { 150 nextLink(); 151 lastLink(); 152 } 153 } 154 </script> 155 <script type="text/javascript" src="Pagging.js"></script> 156 </form> 157 </body> 158 </html>相關js代碼：
?
1 var totalPage = document.getElementById("spanTotalPage"); 2 var pageNum = document.getElementById("spanPageNum"); 3 var totalInfor = document.getElementById("spanTotalInfor"); 4 var pageNum2 = document.getElementById("Text1"); 5 6 var spanPre = document.getElementById("spanPre"); 7 var spanNext = document.getElementById("spanNext"); 8 var spanFirst = document.getElementById("spanFirst"); 9 var spanLast = document.getElementById("spanLast"); 10 var pageSize = 5; 11 12 var numberRowsInTable = theTable.rows.length-1; 13 14 var page = 1; 15 //下一頁 16 function next() { 17 18 if (pageCount() <= 1) { 19 } 20 else { 21 22 23 hideTable(); 24 currentRow = pageSize * page + 1; 25 maxRow = currentRow + pageSize; 26 if (maxRow > numberRowsInTable) maxRow = numberRowsInTable+1; 27 for (var i = currentRow; i < maxRow; i++) { 28 theTable.rows[i].style.display = ''; 29 } 30 page++; 31 pageNum2.value = page; 32 33 if (maxRow == numberRowsInTable) { nextText(); lastText(); } 34 showPage(); 35 if (page == pageCount()) { 36 nextText(); 37 lastText(); 38 } 39 preLink(); 40 firstLink(); 41 } 42 } 43 44 45 46 //上一頁 47 function pre() { 48 49 if (pageCount() <= 1) { 50 } 51 else { 52 53 54 hideTable(); 55 56 page--; 57 pageNum2.value = page; 58 59 currentRow = pageSize * page + 1; 60 maxRow = currentRow - pageSize; 61 if (currentRow > numberRowsInTable) currentRow = numberRowsInTable; 62 for (var i = maxRow; i < currentRow; i++) { 63 theTable.rows[i].style.display = ''; 64 } 65 if (maxRow == 0) { preText(); firstText(); } 66 showPage(); 67 if (page == 1) { 68 firstText(); 69 preText(); 70 } 71 nextLink(); 72 lastLink(); 73 } 74 } 75 76 77 //第一頁 78 function first() { 79 80 if (pageCount() <= 1) { 81 } 82 else { 83 hideTable(); 84 page = 1; 85 pageNum2.value = page; 86 for (var i = 1; i < pageSize+1; i++) { 87 theTable.rows[i].style.display = ''; 88 } 89 showPage(); 90 91 firstText(); 92 preText(); 93 nextLink(); 94 lastLink(); 95 } 96 } 97 98 99 //最后一頁 100 function last() { 101 102 if (pageCount() <= 1) { 103 } 104 else { 105 106 hideTable(); 107 page = pageCount(); 108 109 pageNum2.value = page; 110 currentRow = pageSize * (page - 1)+1; 111 for (var i = currentRow; i < numberRowsInTable+1; i++) { 112 theTable.rows[i].style.display = ''; 113 } 114 115 showPage(); 116 lastText(); 117 nextText(); 118 preLink(); 119 firstLink(); 120 } 121 } 122 123 124 function hideTable() { 125 for (var i = 0; i < numberRowsInTable+1; i++) { 126 theTable.rows[i].style.display = 'none'; 127 } 128 theTable.rows[0].style.display = ''; 129 } 130 131 132 function showPage() { 133 pageNum.innerHTML = page; 134 135 } 136 137 function inforCount() { 138 spanTotalInfor.innerHTML = numberRowsInTable; 139 } 140 141 142 143 //總共頁數 144 function pageCount() { 145 var count = 0; 146 if (numberRowsInTable % pageSize != 0) count = 1; 147 return parseInt(numberRowsInTable / pageSize) + count; 148 } 149 150 151 //顯示鏈接 152 function preLink() { spanPre.innerHTML = "<a href='javascript:pre();'><img src='../Images/Common/back.png'/></a>"; } 153 function preText() { spanPre.innerHTML = "<img src='../Images/Common/back.png'/>"; } 154 155 156 157 function nextLink() { spanNext.innerHTML = "<a href='javascript:next();'><img src='../Images/Common/front.png'/></a>"; } 158 function nextText() { spanNext.innerHTML = "<img src='../Images/Common/front.png'/>"; } 159 160 161 function firstLink() { spanFirst.innerHTML = "<a href='javascript:first();'><img src='../Images/Common/first.png'/></a>"; } 162 function firstText() { spanFirst.innerHTML = "<img src='../Images/Common/first.png'/>"; } 163 164 165 function lastLink() { spanLast.innerHTML = "<a href='javascript:last();'><img src='../Images/Common/last.png'/></a>"; } 166 function lastText() { spanLast.innerHTML = "<img src='../Images/Common/last.png'/>"; } 167 168 169 //隱藏表格 170 function hide() { 171 for (var i = pageSize + 1; i < numberRowsInTable+1 ; i++) { 172 theTable.rows[i].style.display = 'none'; 173 } 174 theTable.rows[0].style.display = ''; 175 176 inforCount(); 177 178 totalPage.innerHTML = pageCount(); 179 showPage(); 180 pageNum2.value = page; 181 182 if (pageCount() > 1) { 183 nextLink(); 184 lastLink(); 185 } 186 187 } 188 189 function renovate() { 190 numberRowsInTable = theTable.rows.length - 1; //table值發生變化 更新分頁 191 for (var i = pageSize + 1; i < numberRowsInTable + 1; i++) { 192 theTable.rows[i].style.display = 'none'; 193 } 194 for (var j = 0; j <= 5;j++ ){ 195 if(j>numberRowsInTable) 196 break; 197 theTable.rows[j].style.display = ''; 198 } 199 inforCount(); 200 201 totalPage.innerHTML = pageCount(); 202 showPage(); 203 pageNum2.value = page; 204 205 if (pageCount() > 1) { 206 nextLink(); 207 lastLink(); 208 } 209 } 210 hide();?
轉載于:https://www.cnblogs.com/yfsmooth/p/4422228.html
總結
以上是生活随笔為你收集整理的asp.net下用js实现弹出子窗口选定值并返回的全部內容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： 第一个Python程序hello.py提
- 下一篇： 设计模式--23、访问者模式