如何将下拉列表控制脚本应用于.aspx页面

本文关键字:应用于 aspx 页面 脚本 控制 下拉列表 | 更新日期: 2023-09-27 18:09:33

我现在开始深入研究ASP.Net的世界。到目前为止,我一直在用HTML样式创建我的大多数页面,并相应地使用CSS,最近我一直在应用Site。母版页给我整理页面的代码。我正在创建一个需要下拉列表控件的页面,该控件最终将进入数据库并显示相关信息,但现在我保持了简单,当您在下拉列表中选择一个项目时,页面仅更新为"您已选择了项目1"。问题是,我似乎不知道如何将脚本应用到页面上。

到目前为止,这是我所拥有的:

<%@ Page Title="Bowtie Performance Parts - Inventory" Language="C#" MasterPageFile="~/Site.master" AutoEventWireup="true"
    CodeBehind="parts.aspx.cs" Inherits="WebApplication1._Default"%>
<asp:Content ID="HeaderContent" runat="server" ContentPlaceHolderID="HeadContent">
<!--Dropdown Menu Setup-->
<head>
</head>
</asp:Content>
<asp:Content ID="BodyContent" runat="server" ContentPlaceHolderID="MainContent">
    <h1 class="defaultTitle">Parts Catalog</h1>
    <p id="defaultLarge">Please Choose from the list below to get started!</p>
    <center>
        <form id="PartsForm" runat="server">
            <asp:DropDownList id="dropDown2" runat="server">
            <asp:ListItem>Please Choose</asp:ListItem>
            <asp:ListItem disabled="disabled">--Motors--</asp:ListItem>
            <asp:ListItem>4 Cylinder</asp:ListItem>
            <asp:ListItem>6 Cylinder</asp:ListItem>
            <asp:ListItem>8 Cylinder</asp:ListItem>
            <asp:ListItem disabled="disabled">--Intakes--</asp:ListItem>
            <asp:ListItem disabled="disabled">--Forced Induction--</asp:ListItem>
            <asp:ListItem>Superchargers</asp:ListItem>
            <asp:ListItem>Turbos</asp:ListItem>
            </asp:DropDownList></form>
   </center>
</asp:Content>

页面按照预期样式和显示,下拉菜单显示和工作,因为它应该,但现在我试图找出在哪里放置脚本,以便当我选择列表上的项目时,它显示"你已经选择了项目#"。

<script  runat="server">
Sub submit(sender As Object, e As EventArgs)
   mess.Text="You selected " & dropDown2.SelectedItem.Text
End Sub
</script>

将此脚本放置在代码中的任何位置都会导致错误,并且页面无法正确编译。我是使用c#和ASP.net的新手,我不确定我是否掌握了如何做到这一点的逻辑。我看过很多这样的例子:

<script  runat="server">
Sub submit(sender As Object, e As EventArgs)
   mess.Text="You selected " & drop1.SelectedItem.Text
End Sub
</script>
<!DOCTYPE html>
<html>
<body>
<form runat="server">
<asp:DropDownList id="drop1" runat="server">
<asp:ListItem>Item 1</asp:ListItem>
<asp:ListItem>Item 2</asp:ListItem>
<asp:ListItem>Item 3</asp:ListItem>
<asp:ListItem>Item 4</asp:ListItem>
<asp:ListItem>Item 5</asp:ListItem>
<asp:ListItem>Item 6</asp:ListItem>
</asp:DropDownList>
<asp:Button Text="Submit" OnClick="submit" runat="server"/>
<p><asp:label id="mess" runat="server"/></p>
</form>
</body>
</html>

但是以这种方式应用脚本会阻止我引用站点。母版页包含一个横幅,导航条和一个链接到一个。css文件,整个网站的风格(在所有网页的一致性)。

如何做到这一点?

提前感谢,泰勒院长

如何将下拉列表控制脚本应用于.aspx页面

在你的代码后面使用drop1_SelectedIndexChanged事件

Protected Sub drop1_SelectedIndexChanged(ByVal sender As Object, ByVal e As System.EventArgs) Handles drop1.SelectedIndexChanged
  mess.text = drop1.SelectedValue     
End Sub

这是在VB中,但你可以将其转换为c#。