本文介绍了一个用于眼镜搜索的网页设计，包含多种筛选条件如性别、款式等，并通过DataList展示查询结果。文章还展示了如何使用ASP.NET处理CheckBox的选中值。
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="SJDefaultSerch.aspx.cs" Inherits="Provide_SjDesign_SJDefaultSerch" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
<title>Design serch</title>
<link href="../../css.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="../../Celend/popcalendar.js"></script>
<script type="text/javascript" src="../../WebDisk_/photoJS.js"></script>
<script type="text/javascript">
function closese()
{
// alert("123");
window.location.href="SJDefault.aspx";
}
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<table style="width: 812px; height: 460px">
<tr>
<td style="width: 100%; height:10%">
架别：<asp:DropDownList ID="Drpsextype" runat="server" Width="60px">
<asp:ListItem></asp:ListItem>
<asp:ListItem>男性</asp:ListItem>
<asp:ListItem>女性</asp:ListItem>
<asp:ListItem>儿童</asp:ListItem>
<asp:ListItem>中性</asp:ListItem>
</asp:DropDownList>款式：<asp:DropDownList ID="Drpkstype" runat="server" Width="60px">
<asp:ListItem></asp:ListItem>
<asp:ListItem>时尚</asp:ListItem>
<asp:ListItem>传统</asp:ListItem>
<asp:ListItem>复古</asp:ListItem>
<asp:ListItem>运动</asp:ListItem>
</asp:DropDownList>
架类：<asp:DropDownList ID="Drpjltype" runat="server" Width="60px">
<asp:ListItem></asp:ListItem>
<asp:ListItem>光学</asp:ListItem>
<asp:ListItem>太阳</asp:ListItem>
<asp:ListItem>老花</asp:ListItem>
</asp:DropDownList>
材质：<asp:DropDownList ID="Drpcztype" runat="server" Width="60px">
<asp:ListItem></asp:ListItem>
<asp:ListItem>板材</asp:ListItem>
<asp:ListItem>金属</asp:ListItem>
<asp:ListItem>塑胶</asp:ListItem>
<asp:ListItem>TR90</asp:ListItem>
<asp:ListItem>钛</asp:ListItem>
</asp:DropDownList> 关键字:
<asp:TextBox ID="Tbgjz" runat="server"></asp:TextBox>
<asp:Button ID="Btserch" runat="server" Text="查询" Width="41px" OnClick="Btserch_Click" /> <asp:Button ID="Btaddlist" runat="server" Text="加入列表" Width="60px" OnClick="Btaddlist_Click" />
<input id="Button1" type="button" value="关闭" onclick="closese()"/>
</td>
</tr>
<tr>
<td style="width: 100%; height:90%" >
<div style="margin:auto; padding-top:0px; width: 100%; height:100% ">
<asp:DataList ID="DataList1" runat="server" RepeatColumns="4" Width="99%" >
<ItemTemplate><div style="width:160px;margin:auto;height:120px;border:1px solid gray;">
<div>
<img alt="" style="margin:auto;border:none;padding:5px 5px 5px 5px;" src="<%#Eval("SmallPhoto")%>" onclick="PhotoShow.url='<%#Eval("SmallSmallPic")%>' ;PhotoShow.PhotoClick();" />
</div>
</div>
<div style="color:Gray;text-align:Center;height:20px;"><input type="checkbox" id="chkDo" runat="server" name="chk" value='<%# Eval("listid") %>' />
<%#Eval("Name") %></div>
</ItemTemplate>
</asp:DataList>
<div style="margin:auto;height:20px;padding:0px;text-align:right;padding:0px; width: 798px;">
<br/>
<asp:LinkButton ID="lbnPrevPage" runat="server" CommandName="prev" OnCommand="Page_OnClick " OnClientClick='setTab("one",2,2)' >上一页</asp:LinkButton>
<asp:Label ID="lbCurrentPage" runat="server" Text=""></asp:Label>
<asp:Label ID="lbTotal" runat="server" Text=""></asp:Label>
<asp:LinkButton ID="lbnNextPage" runat="server" CommandName="next" OnCommand="Page_OnClick " OnClientClick='setTab("one",2,2)' >下一页</asp:LinkButton>
跳转至第<asp:DropDownList ID="lstPage" runat="server" OnSelectedIndexChanged="lstPage_SelectedIndexChanged1" AutoPostBack="True" >
</asp:DropDownList>页
</div>
</div>
</td>
</tr>
</table>
</div>
</form>
</body>
</html>
以上是html 代码
以下是对 CheckBox 取值。
protected void Btaddlist_Click(object sender, EventArgs e)
{
string num = "";
foreach (Control c in DataList1.Controls)
{
//CheckBox chk = (CheckBox)c.FindControl("chkDo"); 此只能取服务器控件的值
HtmlInputCheckBox chk = (HtmlInputCheckBox)c.FindControl("chkDo"); 此可以取回html控件的值
if (chk.Checked)
num += chk.Value+ ",";
}
Response.Write("<script>alert('" + num + "')</script>");
}
扫一扫
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
