点击按钮进入一个只能选择的页面

最新推荐文章于 2022-10-20 20:57:55 发布

最新推荐文章于 2022-10-20 20:57:55 发布 · 155 阅读

文章标签：

#xhtml #javascript #ViewUI

本文介绍了一个基于ASP.NET的线路选择界面实现方法，包括前端界面设计、JavaScript交互逻辑及后台处理过程。通过一个弹出窗口展示线路列表，并允许用户进行搜索与选择，最后将所选线路信息返回到主页面。

主页面：

线路标记(隐藏)： <asp:Label ID="lbl_roadRemark" runat="server" CssClass="input" Style="display: none" />

主页面的js代码：
//开启线路标记窗口
function openWindowRoadRemark() {
var result = window.showModalDialog("FindCircuitList.aspx?Rnd=" + Math.random(), "", "location:No;status:No;help:No;dialogWidth:610px;dialogHeight:500px;");
if (result) {
var list = result.split('*');
document.getElementById("txt_roadName").value = list[0];
document.getElementById("lbl_roadRemark").value = list[1];

}
}

主页面的后台代码：

//ScriptManager1.RegisterAsyncPostBackControl(btn_selectRoadRemark);

（这个选择按钮需要在Page_load程序开始的方法注册一下，否则页面会刷新的）

需要选择的窗口页面：

<%@ Register Src="~/PageControl.ascx" TagName="PageControl" TagPrefix="uc2" %>
<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="cc1" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

</head>
<body>
<form id="form1" runat="server">
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
<div style="text-align: center">
<table>
<tr>
<td>
<div id="carlist">
<table width="100%" border="0" cellspacing="0" cellpadding="0" style="background-color: #d4e4f3;">
<tr>
<td class="carlist_bt">
线路名称：
</td>
<td width="130px">
<asp:TextBox ID="txt_carNO" runat="server" CssClass="inputkcar"></asp:TextBox>
<cc1:AutoCompleteExtender ID="txt_carNo_AutoCompleteExtender" runat="server" DelimiterCharacters=""
ServicePath="" ServiceMethod="GetCarCompletionList" UseContextKey="True" MinimumPrefixLength="1"
TargetControlID="txt_carNO">
</cc1:AutoCompleteExtender>
</td>
<td align="left">
<asp:Button ID="btn_query" runat="server" Text="查询" Style="float: none" CssClass="anniu"
OnClick="btn_query_Click" />
<%--<asp:Button ID="btnAdd" CssClass="anniu" runat="server" Text="新增" OnClick="btnAdd_Click" />--%>
</td>
</tr>
</table>
</div>
</td>
</tr>
<tr>
<td>
<asp:UpdatePanel ID="up_gv" runat="server" UpdateMode="Conditional">
<ContentTemplate>
<asp:GridView ID="gv_car" runat="server" AutoGenerateColumns="False" CellPadding="2"
CssClass="gridview_title" Width="100%">
<FooterStyle CssClass="gridview_footer" HorizontalAlign="Center" />
<RowStyle CssClass="gridview_row" HorizontalAlign="Center" />
<PagerStyle CssClass="gridview_page" />
<AlternatingRowStyle CssClass="gridview_alternatingrow" />
<HeaderStyle CssClass="gridview_header" HorizontalAlign="Center" />
<SelectedRowStyle CssClass="gridview_selectrow" />
<Columns>
<asp:BoundField DataField="名称" HeaderText="线路名称" />
<asp:TemplateField HeaderText="选择">
<ItemTemplate>
<input id="btn_add" class="anniu" type="button" value="选择" onclick="execute('<%# Eval("名称") %>*<%# Eval("线路ID")%>*<%# Eval("线路点集")%>');" />
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
<uc2:PageControl ID="PageControl1" runat="server" PageSize="10" />
</ContentTemplate>
</asp:UpdatePanel>
</td>
</tr>
</table>
</div>
</form>
</body>
</html>