Depois de ver em muitos fóruns dúvidas de como popular um "DropDownList" por código (sem utilizar o assistente do Visual Studio) resolvi criar um post mostrando o passo a passo para carregar os dados de um banco de dados, como definir o valor inicial, e pegar o valor posteriormente.
Primeiro crie um projeto no Visual Studio do tipo "Empty ASP Net Web Application". Adicione um WebForm e insira um componente "DropDownList", e nomeie-o como "ddl". Adicione também um botão e nomeie-o como "btValor".
O seu código deverá ficar assim:
Agora já vamos definir o valor inicial do DropDownList. Isso é bem simples, basta adicionar o seguinte código dentro da tag. Teste no navegador.
Agora vamos popular o DropDownList com valores de um banco de dados SQL Server. Não vou entrar no mérito das classes de acesso à dados, pois o post é sobre "DropDownList" e não Banco de Dados.
Pressione o botão F7 para acessarmos o Code-Behind da página.
Na aba Solution Explorer adicione um banco de dados SQL e nomeie-o como "data.mdf". Crie uma tabela com o nome de "valor" e insira dois campos:
id - Int (define com identity e chave primária)
descricao - varchar(50)
Agora na aba Server Explorer, Data Connections, clique com o botão direito do mouse na tabela que acabamos de criar (valor), e vamos inserir manualmente alguns valores nessa tabela. Selecione a opção "Show Table Data". Vou colocar: Celular, Mouse, Teclado, e Notebook. Como defini como identidade (identity) os seus códigos serão 1, 2, 3, e 4 respectivamente.
Depois disso vamos popular esses dados que acabamos de inserir no DropDownList. Para isso, no Code-Behind da página vamos criar 2 métodos e chamar um deles no PageLoad.
Primeiro método que vamos criar é o de acesso ao banco de dados para recuperarmos os dados em um DataTable. Para isso importe as classes Data e Data.SqlClient.
Agora vamos criar o método que vai popular o DropDownList.
Agora temos que chamar esse metódo (PopularDropDownList()) no evento PageLoad da página, para que toda vez que iniciarmos a página ele seja carregado.
Agora compile o seu código e teste no navegador. Os dados já devem ser exibidos no DropDownList, porém ainda falta codificarmos o botão para verificar o valor do DropDownList.
Vamos inserir um objeto Literal, para exibirmos o valor do item selecionado.
E vamos codificar o botão "btValor", inserindo o seguinte código:
Pronto. Agora compile o seu projeto e pode fazer o teste. Selecione um objeto no DropDownList e clique no botão "Valor do DropDown". O valor selecionado deverá aparecer ao lado do botão, conforme a imagem a seguir:
Agora já temos a nossa solução finalizada, pegando os valores do DropDownList e exibindo na tela, valores esse que foram obtidos através do Banco de Dados, tudo de forma manual, sem utilizar nenhum assistente do Visual Studio.
Primeiro crie um projeto no Visual Studio do tipo "Empty ASP Net Web Application". Adicione um WebForm e insira um componente "DropDownList", e nomeie-o como "ddl". Adicione também um botão e nomeie-o como "btValor".
O seu código deverá ficar assim:
1
2
3
4
5
6
7
| <form id="form1" runat="server"><div><asp:dropdownlist appenddatabounditems="true" autopostback="false" id="ddl" runat="server" width="300px"> </asp:dropdownlist> <asp:button id="btValor" runat="server" text="Valor do DropDown"> </asp:button></div></form> |
Agora já vamos definir o valor inicial do DropDownList. Isso é bem simples, basta adicionar o seguinte código dentro da tag
1
| <asp:listitem text="Selecione"></asp:listitem> |
Agora vamos popular o DropDownList com valores de um banco de dados SQL Server. Não vou entrar no mérito das classes de acesso à dados, pois o post é sobre "DropDownList" e não Banco de Dados.
Pressione o botão F7 para acessarmos o Code-Behind da página.
Na aba Solution Explorer adicione um banco de dados SQL e nomeie-o como "data.mdf". Crie uma tabela com o nome de "valor" e insira dois campos:
id - Int (define com identity e chave primária)
descricao - varchar(50)
Agora na aba Server Explorer, Data Connections, clique com o botão direito do mouse na tabela que acabamos de criar (valor), e vamos inserir manualmente alguns valores nessa tabela. Selecione a opção "Show Table Data". Vou colocar: Celular, Mouse, Teclado, e Notebook. Como defini como identidade (identity) os seus códigos serão 1, 2, 3, e 4 respectivamente.
Depois disso vamos popular esses dados que acabamos de inserir no DropDownList. Para isso, no Code-Behind da página vamos criar 2 métodos e chamar um deles no PageLoad.
Primeiro método que vamos criar é o de acesso ao banco de dados para recuperarmos os dados em um DataTable. Para isso importe as classes Data e Data.SqlClient.
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
| private DataTable MontarDataTable(string sql) { //Definir a ConnectionString string connectionString = @"Data Source=.\SQLEXPRESS;AttachDbFilename=|DataDirectory|\data.mdf;Integrated Security=True;User Instance=True"; //Iniciar o processo de Conexão ao Banco de Dados SqlConnection conn = new SqlConnection(connectionString); conn.Open(); //Instanciando o DataAdapter para popular um DataTable SqlDataAdapter da = new SqlDataAdapter(sql, conn); DataTable dt = new DataTable(); da.Fill(dt); return dt; } |
Agora vamos criar o método que vai popular o DropDownList.
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
| private void PopularDropDownList() { //Query que irá retornar os valores do banco de dados string sql = "SELECT * FROM valor"; //DataTable que será populado DataTable dt = new DataTable(); //Populando o DataTable chamando a Função que criamos de acesso à dados dt = MontarDataTable(sql); //Populando e definindo o DropDownList ddl.DataSource = dt; ddl.DataTextField = "descricao"; ddl.DataValueField = "id"; ddl.DataBind(); } |
Agora temos que chamar esse metódo (PopularDropDownList()) no evento PageLoad da página, para que toda vez que iniciarmos a página ele seja carregado.
1
2
3
4
5
| protected void Page_Load(object sender, EventArgs e){ if (!Page.IsPostBack) PopularDropDownList();} |
Agora compile o seu código e teste no navegador. Os dados já devem ser exibidos no DropDownList, porém ainda falta codificarmos o botão para verificar o valor do DropDownList.
 |
| Valores Carregados no DropDownList |
1
| <asp:literal id="lblValorSelecionado" runat="server"></asp:literal> |
E vamos codificar o botão "btValor", inserindo o seguinte código:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
| protected void btValor_Click(object sender, EventArgs e){ //Pegar o valor do item do DropDownList string valor = ddl.SelectedValue.ToString(); //Verificar se o item selecionado não foi o item "Selecione" if (valor == "Selecione") { lblValorSelecionado.Text = "Nenhum valor foi selecionado"; return; } lblValorSelecionado.Text = valor;} |
Pronto. Agora compile o seu projeto e pode fazer o teste. Selecione um objeto no DropDownList e clique no botão "Valor do DropDown". O valor selecionado deverá aparecer ao lado do botão, conforme a imagem a seguir:
 |
| Valor selecionado no DropDownList |
Você pode baixar os arquivos desse projeto clicando aqui.
Espero que tenham gostado. Até a próxima.
0 comentários:
Postar um comentário