时间戳

首页 > 解决方案 > 使用多个 DropDownList 来识别要显示的图像

c# - 使用多个 DropDownList 来识别要显示的图像

问题描述

<asp:DropDownList ID="Type" runat="server" OnSelectedIndexChanged="Type_SelectedIndexChanged" AutoPostback="True">
    <asp:ListItem Text="-Select Type-" value=""/>
    <asp:ListItem Text="Apple" value="apple" />
    <asp:ListItem Text="Orange" value="orange" />
</asp:DropDownList>

protected void Type_SelectedIndexChanged(object sender, EventArgs e)
    {
        string a = Type.SelectedItem.Value;
        switch (a)
        {
            case "apple":
                image1.ImageUrl = "~/image/apple.jpg";
                break;
            case "orange":
                image1.ImageUrl = "~/image/orange.jpg";
                break;
        }
    }

此代码允许用户选择橙色/苹果，页面中显示的图像将相应更改。但是，如果我需要有多个下拉列表来标识要显示的图像怎么办。例如，我添加了另一个下拉列表，允许用户选择水果类型的大小。如果用户在类型下拉列表中选择苹果，在大小下拉列表中选择大，“大苹果”图像将被选择显示在图像 div 中。

任何帮助将不胜感激。

标签： c#asp.netimagedrop-down-menuwebforms

解决方案

假设您的第二个DropDownList是 Size ，其SelectedIndexChanged方法如下：

protected void Size_SelectedIndexChanged(object sender, EventArgs e)
    {
        string image = "";
        switch (Type.SelectedItem.Value)
        {
            case "apple":
                image = "~/image/apple.jpg";
                break;
            case "orange":
                image = "~/image/orange.jpg";
                break;
        }

        switch (Size.SelectedItem.Value)
        {
            case "small":
                image1.ImageUrl = image;
                image1.Width = 200;
                image1.Height = 200;
                break;
            case "big":
                image1.ImageUrl = image;
                image1.Width = 400;
                image1.Height = 400;
                break;
        }
    }

并且不需要做任何代码Type_SelectedIndexChanged

更新：

如果您已经有不同大小的不同图像，那么您可以这样处理：

protected void Size_SelectedIndexChanged(object sender, EventArgs e)
    {
        string image = "";
        switch (Type.SelectedItem.Value)
        {
            case "apple":
                switch (Size.SelectedItem.Value)
                {
                    case "small":
                        image1.ImageUrl = "~/image/small-apple.jpg";
                        break;
                    case "big":
                        image1.ImageUrl = "~/image/big-apple.jpg";
                        break;
                }
                break;
            case "orange":
                switch (Size.SelectedItem.Value)
                {
                    case "small":
                        image1.ImageUrl = "~/image/small-orange.jpg";
                        break;
                    case "big":
                        image1.ImageUrl = "~/image/big-orange.jpg";
                        break;
                }
                break;
        }            
    }

推荐阅读