Partilhar via

Explicação passo a passo: Acesso básico a dados em páginas da Web

  • Artigo

Este passo-a-passo mostra como como criar uma página simples com dados vinculados usando controles que são especialmente criados para acesso a dados.

Durante esta explicação passo a passo, você aprenderá a fazer o seguinte:

  • Conectar-se a um banco de dados do Microsoft SQL Server na ferramenta de desenvolvimento da web, o Microsoft Visual Web Developer.

  • Usar edição arrastar-e-soltar para criar elementos de acesso a dados que podem ser usados na página sem código.

  • Use o SqlDataSource Controle para gerenciar Acesso a Dados e vinculação.

  • Exibir dados com o GridView o controle.

  • Configurar a GridView Controle para permitir a classificação e paginação.

  • Criar uma consulta filtrada que exibe somente registros selecionados.

Pré-requisitos

Para concluir esta explicação passo a passo, será necessário o seguinte:

  • Acesso ao banco de dados do SQL Server Northwind.Para obter informações sobre pressionada Carregando e instalação do SQL Server banco de dados de exemplo Northwind, consulte Instalar bancos de dados de exemplo No site da Microsoft SQL Server.

    Observação:

    Se você precisa de informações sobre como efetuar o logon para o computador que está executando o SQL Server, contate o administrador do servidor.

  • Microsoft Data Access Components (MDAC) versão 2.7 ou posterior.

    Se você está usando o Microsoft Windows XP ou o Windows Server 2003, você já tem MDAC 2.7.Entretanto, se você estiver usando o Microsoft Windows 2000, você pode atualizar o MDAC que já está instalado no o computador.Para Baixar a versão atual MDAC, consulte Centro de Desenvolvimento de Acesso e Armazenamento de Dados.

Criando o Site Web

Se você já tiver Criado um site da Web em Visual Web Developer, completando Demonstra Passo a passo: Criando uma página da Web básica no Visual Web DeveloperVocê pode usar esse site e Ir para a Avançar seção.Caso contrário, crie um site e uma página novos, seguindo estas etapas.

Para criar um site do sistema de arquivos

  1. Abra o Visual Web Developer.

  2. Sobre o File Menu, clique em NovoSite.

    O Novo Site da Web caixa de diálogo é exibida.

  3. Em Modelos Visual Studio instaladoClique em Web Site ASP.NET.

  4. No mais Direito. Local Digite o nome da pasta onde você deseja manter as páginas do site da Web.

    Por exemplo, digite o nome da pasta C:\WebSites.

  5. Na Linguagem lista, clique no linguagem de programação que você prefere trabalhar no.

  6. Clique em OK.

    Visual Web Developer cria a pasta e uma nova página chamada Default.aspx.

Adicionando um Controle GridView para Exibir Dados

Para exibir dados em uma página da Web do ASP.NET, será necessário:

  • Uma conexão com uma fonte de dados (como um banco de dados).

    No procedimento a seguir, você criará uma conexão com o banco de dados Northwind do SQL Server.

  • Um controle da fonte de dados na página, que executa consultas e gerencia os resultados de consultas.

  • Um controle na página para exibir os dados realmente.

    No procedimento a seguir, você exibirá dados em um GridView o controle.O GridView controle receberá os dados a partir de SqlDataSource o controle.

Você pode adicionar esses elementos para o site separadamente.No entanto, é mais fácil iniciar por visualizar os dados Exibir usando GridView o controle e em seguida, usando assistentes para criar a conexão e controle da Origem de dados.O procedimento a seguir explica como criar todos os três elementos que você deve ter para exibir dados na página.

Para adicionar e configurar um controle GridView para exibir dados

  1. Em Visual Web Developer, Switch para Design Exiba.

  2. A partir de Dados Pasta a ToolboxArraste um GridView controlar até a página.

  3. Se a Tarefas GridExibir Atalho menu não aparecer, clique com o botão direito do mouse o GridView Controlar e em seguida, clique em Mostrar marcas inteligentes.

  4. Sobre o Tarefas GridExibir Menu, in a Escolher Fonte de Dados ListaClique em < novo Origem de dados >.

    O Configuração de fonte de dados caixa de diálogo é exibida.

  5. Clique em Banco de dados.

    Isso especifica que você deseja obter dados de um banco de dados que suporte instruções SQL.Isso inclui o SQL Server e outros OLE-DB – bancos de dados compatíveis.

    Na Especificar uma identificação para o fonte de dados a caixa, um nome padrão controle da fonte de dados aparece (SqlDataSource1).Você pode deixar esse nome.

  6. Clique em OK.

    O Wizard Configure Data Source aparecerá, exibindo uma página na qual você pode escolher uma conexão.

  7. Clique em Nova conexão.

  8. Na Escolher fonte de dados caixa de diálogo, em Fonte de DadosClique em Microsoft SQL Servere em seguida, clique em Continue.

    O Adicionar conexão caixa de diálogo é exibida.

  9. Na Nome do servidor caixa, Enter o nome de SQL Servidor que você deseja usar.

  10. Para as credenciais de login, selecione a opção que seja apropriada para acessar o banco de dados do SQL Server (segurança integrada ou ID específico e senha) e se for necessário, digite um nome de usuário e senha.

  11. Clique em Selecione ou digite um nome de banco de dadose em seguida, digite Northwind.

  12. Clique em Teste de conexãoe quando tiver certeza que ele funciona, clique em OK.

    O Configurar Fonte de Dados - < DataSourceName > Assistente for exibido e as informações de conexão são preenchidas.

  13. Clique em Next.

    O assistente aparecerá, exibindo uma página onde você pode escolher armazenar a seqüência de conexão no arquivo de configuração.Armazenar a seqüência de conexão no arquivo de configuração possui duas vantagens:

    1. É mais seguro do que armazenar a seqüência de conexão na página.

    2. Você pode reutilizar a mesma seqüência de conexão em várias páginas.

  14. Certifique-se que o Sim, salvar esta conexão como Caixa de seleção está selecionada e em seguida, clique em Next.(Você pode deixar o nome do padrão Cadeia de Caracteres da Conexão NorthwindConnectionString.)

    O assistente aparecerá, exibindo uma página na qual você pode especificar os dados que você deseja buscar do banco de dados.

  15. Em Especificar colunas de uma tabela ou modo de exibiçãoin a Name (Nome) lista, clique em Os clientes.

  16. Em ColunasSelecionar o CustomerID, CompanyNamee Cidade Marcar caixas.

    O assistente aparecerá, exibindo a Instrução SQL que você está criando em uma caixa na parte inferior da página.

    Observação:

    O assistente permite que você especifique critérios de seleção (uma cláusula WHERE) e outras opções de consulta SQL.Para esta parte do passo-a-passo, você vai criar uma declaração simples sem seleção ou opções de classificação.

  17. Clique em Next.

  18. Clique em Teste de consulta Para certificar-se que você está buscando os dados que você deseja.

  19. Clique em Finish.

    O assitente fecha e você retornado para a página.Executar o assistente realizou duas tarefas:

    • O assistente criado e configurado um SqlDataSource Controle (chamado SqlDataSource1, que incorpora as informações de conexão e de consulta que você especificou.

    • O assistente Ligado a GridView Controle para o SqlDataSource.Portanto, o GridView o controle exibirá dados retornados pelo SqlDataSource o controle.

    Se você exibir as propriedades para o SqlDataSource o controle, você pode ver que o assistente tem Criado valores para o ConnectionString() e SelectQuery Propriedades.

    Observação:

    Você pode alterar facilmente o eis OK das GridView o controle.Em Design Exibir, clique com o botão direito do mouse o GridView Controlar e em seguida, clique em Mostrar marcas inteligentes.Sobre o Tarefas GridExibir Menu, clique em Formatarar automático, e, em seguida, Aplicar um esquema.

Testando a Página

Agora você pode executar a página.

Para testar a página

  1. Pressione CTRL+F5 para executar a página.

    A página aparece no navegador.O GridView o controle exibe todas as linhas de dados da tabela Customers.

  2. Feche o navegador.

Adicionando Classificação e Paginação

Você pode adicionar a classificação e paginação para a GridView Controle sem escrever qualquer código.

Para adicionar classificação e paginação

  1. Em Design Exibir, clique com o botão direito do mouse o GridView Controlar e em seguida, clique em Mostrar marcas inteligentes.

  2. Sobre o Tarefas GridExibir menu de atalho, selecione o Habilitar classificação Marcar caixa.

    Os títulos de colunas na GridView Controle Alterar para links.

  3. Sobre o Tarefas GridExibir menu, selecione o Habilitar paginação caixa de seleção.

    Um rodapé é adicionado à GridView Controle com links de número de página.

  4. Opcionalmente, usar Propriedades Para alterar o valor da PageSize Propriedade de 10 para um menor Tamanho da Página.

  5. Pressione CTRL+F5 para executar a página.

    Será possível clicar em uma coluna título para classificar pelos conteúdos dessa coluna.Se há mais registros de fonte de dados que o tamanho da página a GridView o controle, você poderá usar os links de navegação de página na parte inferior das GridView controle para mover entre páginas.

  6. Feche o navegador.

Adicionando filtragem

Com freqüência você deseja exibir somente dados selecionados na página.Nesta parte da explicação passo a passo, você modificará a consulta para o SqlDataSource Controle para que usuários podem selecionar registros de clientes para uma cidade específica.

Primeiro, você usará um TextBox controle para criar um caixa de texto no qual os usuários poderão digitar o nome de uma cidade.Em seguida, alterará a consulta para incluir um filtro parametrizado (cláusula WHERE).Como parte do processo, você criará um elemento de parâmetro para o SqlDataSource o controle.O elemento de parâmetro estabelece como o SqlDataSource Controle obterá o valor de sua consulta com parâmetros — ou seja, a partir de caixa de texto.

Quando você terminar com essa parte da explicação passo a passo, a página pode ser semelhante ao seguinte no Design Exiba.

Para adicionar a caixa de texto para especificar uma cidade

  1. A partir de Padrão Agrupar in a ToolboxArraste um TextBox Controle e um Button controlar até a página.

    O Button o controle é usado somente para publicar a página para o servidor.Você não precisará escrever qualquer código para ele.

  2. Em Propriedades, para o TextBox o controle, definir ID Para textCity.

  3. Se você desejar, digite City ou texto semelhante antes da caixa de texto atuar como uma legenda.

  4. Em Propriedades Para o Button o controle, definir Texto Para enviar.

Agora você pode modificar a consulta para incluir um filtro.

Para modificar a consulta com um filtro parametrizados

  1. Clique com o botão direito do mouse o SqlDataSource Controlar e em seguida, clique em Mostrar marcas inteligentes.

  2. Sobre o Tarefas SqlDataSource Menu, clique em Configurar fonte de dados.

    O Configurar Fonte de Dados - <DataSourceName> assistente é exibido.

  3. Clique em Next.

    O assistente exibe o comando SQL que está atualmente configurado para o SqlDataSource o controle.

  4. Clique em WHERE.

    O Adicionar onde cláusula a página é exibida.

  5. Na Coluna lista, clique em Cidade.

  6. Na Operador lista, clique em =.

  7. Na Origem lista, clique em Controle.

  8. Em Propriedades de Parâmetroin a Control ID (Identificação do controle) lista, clique em TextCity.

    As etapas anteriores cinco especificar que a consulta obterá o valor de Pesquisar Cidade a partir de TextBox controle que você Adicionado no procedimento anterior.

  9. Clique em Somar

    A cláusula WHERE que você criou aparecerá em uma caixa na parte inferior da página.

  10. Clique em OK Para fechar a Adicionar onde cláusula a página.

  11. Na Configurar Fonte de Dados - <DataSourceName> Assistente, clique em Next.

  12. Sobre o Teste de consulta Página, clique em Teste de consulta.

    O assistente for exibido, exibindo o Editor de Valores de parâmetro Página, que solicita que você um valor a ser usado na cláusula WHERE.

  13. Na Value (Valor) caixa, digite Londone em seguida, clique em OK.

    Os registros de clientes de London aparecem.

  14. Clique em Finish Para fechar o assistente.

Agora você pode testar a filtragem.

Para testar a filtragem

  1. Pressione CTRL+F5 para executar a página.

  2. No caixa de texto, digite London e em seguida, clique em Enviar.

    Uma lista de clientes da cidade de London aparece na GridView o controle.

  3. Tente outras cidades, como Buenos Aires e Berlin.

Próximas etapas

Acesso a dados é uma parte importante em vários aplicativos da web, este passo-a-passo forneceu somente uma amostra do que você pode fazer com dados em páginas da web.Você pode testar outros recursos adicionais do acesso a dados.Por exemplo, você pode querer fazer o seguinte:

Consulte também

Conceitos

Visão geral sobre controles fonte de dados