如何基於ASP.net Web表單中的下拉列表選擇來更改按鈕的顏色？

Question

我有一個帶有一些列表項的下拉列表，並且有一個按鈕，我想根據下拉列表選擇更改該按鈕的顏色。 每個選擇都會為按鈕賦予不同的顏色。

我有這個selectedindexchange事件，但無法正常工作：

protected void DropDownList1_SelectedIndexChanged(object sender, EventArgs e)
{
    if (DropDownList1.SelectedItem.Text == "jim.rumdner@gmail.com")
    {
        Button1.BackColor = System.Drawing.Color.Blue;
    }
    else if (DropDownList1.SelectedItem.Text == "alon_gk@netvision.net.il")
    {
        Button1.BackColor = System.Drawing.Color.Green;
    }
    else if (DropDownList1.SelectedValue == "ohad_jl@internet-zahav.co.il")
    {
        Button1.BackColor = System.Drawing.Color.Red;
    }
    else if (DropDownList1.SelectedValue == "nirho_fg@walla.com")
    {
        Button1.BackColor = System.Drawing.Color.Yellow;
    }
    else if (DropDownList1.SelectedValue == "yidhj_ry@yahoo.com")
    {
        Button1.BackColor = System.Drawing.Color.White;
    }
    else if (DropDownList1.SelectedValue == "kit_ru@hotmail.com")
    {
        Button1.BackColor = System.Drawing.Color.Black;

    }

下拉列表：

<asp:DropDownList ID="DropDownList1" AutoPostBack="True" OnSelectedIndexChanged="DropDownList1_SelectedIndexChanged" runat="server">
    <asp:ListItem value="blue">amir.tuchner@gmail.com</asp:ListItem>
    <asp:ListItem Value="Green">alon_gk@netvision.net.il</asp:ListItem>
    <asp:ListItem Value="Red">ohad_jl@internet-zahav.co.il</asp:ListItem>
    <asp:ListItem Value="yellow">nirho_fg@walla.com</asp:ListItem>
    <asp:ListItem Value="white">yidhj_ry@yahoo.com</asp:ListItem>
    <asp:ListItem Value="black">kit_ru@hotmail.com</asp:ListItem>
</asp::DropDownList>

和一個按鈕：

enter code here<asp:Button ID="Button1" runat="server" style="background-color:aqua" Text="Send and Receive" BackColor="#FF3399" />

我該怎么做才能使其正常工作？

Answer 1

在您的DropDownList中 ，將AutoPostBack屬性設置為true 。 因此，每次更改選擇時，都會回發到服務器。

這將迫使頁面重新加載。

但是，您已經為Button定義了嵌入式樣式。 定義的每個內聯樣式都將覆蓋您的回發樣式，因為將呈現頁面，然后將應用這些樣式。

在您的CodeBehind中，檢查DropDownList1.SelectedItem.Text，並在某些情況下檢查DropDownList1.SelectedValue 。

只需更新您的代碼...

protected void DropDownList1_SelectedIndexChanged(object sender, EventArgs e)
{        
if (DropDownList1.SelectedItem.Text == "jim.rumdner@gmail.com")
        {
            Button1.BackColor = System.Drawing.Color.Blue;
        }
        else if (DropDownList1.SelectedItem.Text == "alon_gk@netvision.net.il")
        {
            Button1.BackColor = System.Drawing.Color.Green;
        }
        else if (DropDownList1.SelectedItem.Text == "ohad_jl@internet-zahav.co.il")
        {
            Button1.BackColor = System.Drawing.Color.Red;
        }
        else if (DropDownList1.SelectedItem.Text == "nirho_fg@walla.com")
        {
            Button1.BackColor = System.Drawing.Color.Yellow;
        }
        else if (DropDownList1.SelectedItem.Text == "yidhj_ry@yahoo.com")
        {
            Button1.BackColor = System.Drawing.Color.White;
        }
        else if (DropDownList1.SelectedItem.Text == "kit_ru@hotmail.com")
        {
            Button1.BackColor = System.Drawing.Color.Black;

        }
}

而不是使用很多if / else，應該使用switch語句adn check來檢查DropDownList1.SelectedValue ...

switch (DropDownList1.SelectedValue)
        {
            case "blue":
                Button1.BackColor = System.Drawing.Color.Blue;
                break;
            case "green":
                Button1.BackColor = System.Drawing.Color.Green;
                break;
            case "red":
                Button1.BackColor = System.Drawing.Color.Red;
                break;
            case "yellow":
                Button1.BackColor = System.Drawing.Color.Yellow;
                break;
            case "white":
                Button1.BackColor = System.Drawing.Color.White;
                break;
            case "black":
                Button1.BackColor = System.Drawing.Color.Black;
                break;
            default:
                Button1.BackColor = System.Drawing.Color.Gray;
                break;
        }

...這將使閱讀和維護更加容易。 最后，刪除按鈕的內聯樣式。

<asp:Button ID="Button1" runat="server" Text="Send and Receive" BackColor="#FF3399"/>