Reputation: 57
<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;
}
}
This code allow the user select either orange/apple and image shown in the page will change accordingly. But what if I need to have multiple dropdownlist to identity which image to be shown. For example, I add another Dropdownlist which allow user to choose the size of the type of fruit. If user select apple at Type dropdownlist and Big at Size dropdownlist, the "Big Apple" image will be selected to shown in image div.
Any help will be appreciated.
Upvotes: 1
Views: 47
Reputation: 409
Let say your second DropDownList
is Size and its SelectedIndexChanged
method will be as following:
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;
}
}
and no need to do any code in Type_SelectedIndexChanged
Update:
If you already have different images of different sizes then you can handle it this way:
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;
}
}
Upvotes: 1