DropDown List Background Color C# ASP.NET

มาใส่สีพื้นหลังให้กับ DropDown List  ให้มีสีสันสวยงามกันดีกว่าครับ



ตัวอย่างการใช้งาน Code-Behind (C#) 

AspNetCodeBehind.aspx

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="AspNetCodeBehind.aspx.cs" Inherits="AspNetCodeBehind" %>

<html>
<head>
<   title>DropDownList Background Color ASP.NET</title>
</head>
<body>
    <form id="form1" runat="server">
    <div class="input-group">
                              <span class="input-group-addon" id="basic-addon-zonecolor">เลือกสี</span>
                              <asp:DropDownList ID="ddlMultiColor" runat="server"  OnSelectedIndexChanged="ddlMultiColor_OnSelectedIndexChanged"
                                    class="form-control" aria-describedby="basic-addon-zonecolor" AutoPostBack="true">
                                    <asp:ListItem value="Transparent">Transparent</asp:ListItem>
                                    <asp:ListItem value="LimeGreen">LimeGreen</asp:ListItem>
                                    <asp:ListItem value="CornflowerBlue">CornflowerBlue</asp:ListItem>
                                    <asp:ListItem value="Plum">Plum</asp:ListItem>
                                    <asp:ListItem value="Orange">Orange</asp:ListItem>
                                    <asp:ListItem value="LightBlue">LightBlue</asp:ListItem>
                                    <asp:ListItem value="LightSalmon">LightSalmon</asp:ListItem>
                                    <asp:ListItem value="Khaki">Khaki</asp:ListItem>
                                    <asp:ListItem value="SaddleBrown">SaddleBrown</asp:ListItem>
                                    <asp:ListItem value="DeepSkyBlue">DeepSkyBlue</asp:ListItem>
                                    <asp:ListItem value="Yellow">Yellow</asp:ListItem>
                                    <asp:ListItem value="MediumAquamarine">MediumAquamarine</asp:ListItem>
                                    <asp:ListItem value="Red">Red</asp:ListItem>
                                    <asp:ListItem value="DarkOrchid">DarkOrchid</asp:ListItem>
                              </asp:DropDownList>
                                 <div  id="msgColor" runat="server" ></div>
                  </div>
    </form>
</body>
</html>




AspNetCodeBehind.aspx.cs

using System;
using System.Data;
using System.Configuration;
using System.Collections;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.HtmlControls;

public partial class AspNetCodeBehind : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {
if (!Page.IsPostBack)

        {
       populateDdlMultiColor();
       colorManipulation();
        }
    }


    private void colorManipulation()
    {
        int row;
        for (row = 0; row < ddlMultiColor.Items.Count - 1; row++)
        {
            ddlMultiColor.Items[row].Attributes.Add("style", "background-color:" + ddlMultiColor.Items[row].Value);
        }

        ddlMultiColor.BackColor = Color.FromName(ddlMultiColor.SelectedItem.Text);

    }


    private void populateDdlMultiColor()
    {
        ddlMultiColor.DataSource = finalColorList();
        ddlMultiColor.DataBind();

    }



    protected void ddlMultiColor_OnSelectedIndexChanged(object sender, EventArgs e)
    {
        ddlMultiColor.BackColor = Color.FromName(ddlMultiColor.SelectedItem.Text);
        colorManipulation();
        ddlMultiColor.Items.FindByValue(ddlMultiColor.SelectedValue).Selected = true;
        msgColor.Attributes.Add("style", "background:" + ddlMultiColor.SelectedItem.Value + ";width:30px;height:25px;");


    }

}





ถ้าใช้ code ตามนี้จะได้สีพื้นหลัง 256 สี แต่ถ้าอยากได้สีตามที่เรากำหนด ให้เอา populateDdlMultiColor() ออกจาก page load แล้ว value ให้ DropDownList  ใน CodeBehind.aspx ก็จะสีตามที่เราต้องการแล้ว

ความคิดเห็น

โพสต์ยอดนิยมจากบล็อกนี้

Simple markers Google Map API with C# .Net

Screen Sharing/Remote Control using MirrorOp:Android-PC