ASP.net DropDownList 값 선택하기, Select 선택값 변경시 함수 처리하기

웹에서 사용되는 <select> 요소의 기능들을

ASP.NET에서는 DropDownList 객체로 쉽게 처리할 수 있게 되어 있습니다.

쉽게 생각해서, C#에 <select>요소의 표준 객체가 DropDownList로 보면 됩니다.

 

표준 > DropDownList 컨트롤러

(참고: HTML에 select도 있긴합니다.)

여기서, 우리는 2가지를 이야기하려고 합니다.

 

(1) DropDownList 컨트롤러의 값 선택하기

(2) DropDownList 컨트롤러의 선택이 변경될 때 처리하기

 

기본적으로 웹에서는 이런 기능들을 html이벤트와 Javascript를 통해서 처리하지만,

ASP.NET 에서는 이벤트와 CodeBehind 소스를 통해서 처리합니다.

 

 

 

 

(1) DropDownList 컨트롤러에 값 선택하기

DropDownList 컨트롤에서 특정 값의 Item을 선택하게 하려면,

객체를 Item를 찾아서 value부분에 값을 넣으면 됩니다.

// Making sure the previous selection has been cleared
dropdownlist.ClearSelection(); 
dropdownlist.Items.FindByValue(value).Selected = true;

 

DropDownList에 [<]를 클릭해서,

"항목 편집..."를 선택하면 ListItem 컬렉션 편집기가 팝업 됩니다.

여기서, Text(표시되는 값), Value(아이템 값)을 입력해 줍니다.

 

DropDownList 컨트롤에 Value가 Coke의 모습

 

버튼을 누르면, Coke값인 Coca-Cola가 선택됩니다.

namespace testWeb
{
    public partial class WebForm1 : System.Web.UI.Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {
        }

        protected void Button2_Click(object sender, EventArgs e)
        {
            DropDownList1.ClearSelection();
            DropDownList1.Items.FindByValue("Coke").Selected = true;
        }
    }
}

 

참고: How to set a dropdownlist item as selected in ASP.NET?

 

 

 

 

 

(2) DropDownList 컨트롤러의 선택이 변경될 때 처리하기

(= AutoPostBack 속성 값을 True)

DropDownList 컨트롤을 더블클릭하면,

자동으로 이벤트 함수가 생성되고,

 

이벤트가에 대한 소스를 입력하는 부분으로 점프 이동합니다.

protected void DropDownList1_SelectedIndexChanged(object sender, EventArgs e)
{
	// DropDownBox가 변경될때 선택되는 명령
	Button2.Enabled = (DropDownList1.SelectedValue == "Coke") ? false : true;
}

 

DropDownList1을 더블클릭되었을 때,

속성의 Event(번개모양)에 SelectedIndexChanged 함수로 자동 생성됨을 확인할 수가 있습니다.

 

이렇게 생성된 함수(DropDownList1_SelectedIndexChanged)는

DropDownBox의 선택의 변경을 한다고,

해당 함수(DropDownList1_SelectedIndexChanged)가 바로 처리되지 않고,

페이지의 Submit이 일어날 때 처리가 됩니다.

 

해당 페이지의 Submit이 일어나지 않고, 

DropDownBox 선택한 값을 변경할 때 실행되길 원한다면, 

속성 값 AutoPostBack=True를 추가해 주면 됩니다.

AutoPostBack를 True로하면 Submit일어나기 전에도 실행이 됩니다.

 

<asp:DropDownList ID="DropDownList1" runat="server"
	AutoPostBack="True" 
    OnSelectedIndexChanged="DropDownList1_SelectedIndexChanged">
  <asp:ListItem>Select Soda..</asp:ListItem>
  <asp:ListItem Value="Coke">Coca-Cola</asp:ListItem>
  <asp:ListItem>Sprite</asp:ListItem>
  <asp:ListItem>Fanta</asp:ListItem>
</asp:DropDownList>

 

이렇게 AutoPostBack="True" 값을 주게 되면,

DropDownBox가 선택이 변경될 때마다,

DropDownList1_SelectedIndexChanged 함수가 실행됩니다.

 

참고: stackoverflow.com/questions/6415250/c-sharp-dropdownlist-change-event