Partilhar via

Introdução ao trabalho com um banco de dados em sites de Páginas da Web do ASP.NET (Razor)

  • Artigo

por Tom FitzMacken

Este artigo descreve como usar as ferramentas do Microsoft WebMatrix para criar um banco de dados em um site do Páginas da Web do ASP.NET (Razor) e como criar páginas que permitem exibir, adicionar, editar e excluir dados.

O que você aprenderá:

  • Como criar um banco de dados.
  • Como se conectar a um banco de dados.
  • Como exibir dados em uma página da Web.
  • Como inserir, atualizar e excluir registros de banco de dados.

Estes são os recursos introduzidos no artigo:

  • Trabalhando com um banco de dados do Microsoft SQL Server Compact Edition.
  • Trabalhando com consultas SQL.
  • A classe Database.

Versões de software usadas no tutorial

  • Páginas da Web do ASP.NET (Razor) 2
  • WebMatrix 2

Este tutorial também funciona com o WebMatrix 3. Você pode usar Páginas da Web do ASP.NET 3 e Visual Studio 2013 (ou Visual Studio Express 2013 para Web); no entanto, a interface do usuário será diferente.

Introdução aos bancos de dados

Imagine um catálogo de endereços típico. Para cada entrada no catálogo de endereços (ou seja, para cada pessoa), você tem várias informações, como nome, sobrenome, endereço, endereço de email e número de telefone.

Uma maneira típica de imaginar dados como esse é como uma tabela com linhas e colunas. Em termos de banco de dados, cada linha geralmente é conhecida como um registro. Cada coluna (às vezes chamada de campos) contém um valor para cada tipo de dados: nome, sobrenome e assim por diante.

ID Nome Sobrenome Endereço Email Telefone
1 Jim Abrus 210 100th St SE Orcas WA 98031 jim@contoso.com 555 0100
2 Terry Adams 1234 Main St. Seattle WA 99011 terry@cohowinery.com 555 0101

Para a maioria das tabelas de banco de dados, a tabela precisa ter uma coluna que contenha um identificador exclusivo, como um número de cliente, número da conta etc. Isso é conhecido como a chave primária da tabela e você a usa para identificar cada linha na tabela. No exemplo, a coluna ID é a chave primária do catálogo de endereços.

Com essa compreensão básica dos bancos de dados, você está pronto para aprender a criar um banco de dados simples e executar operações como adicionar, modificar e excluir dados.

Dica

Bancos de dados relacionais

Você pode armazenar dados de várias maneiras, incluindo arquivos de texto e planilhas. Para a maioria dos usos empresariais, porém, os dados são armazenados em um banco de dados relacional.

Este artigo não entra muito profundamente em bancos de dados. No entanto, você pode achar útil entender um pouco sobre eles. Em um banco de dados relacional, as informações são divididas logicamente em tabelas separadas. Por exemplo, um banco de dados de uma escola pode conter tabelas separadas para alunos e para ofertas de classe. O software de banco de dados (como SQL Server) dá suporte a comandos avançados que permitem estabelecer dinamicamente relações entre as tabelas. Por exemplo, você pode usar o banco de dados relacional para estabelecer uma relação lógica entre alunos e classes para criar uma agenda. O armazenamento de dados em tabelas separadas reduz a complexidade da estrutura da tabela e reduz a necessidade de manter dados redundantes em tabelas.

Criar um banco de dados

Este procedimento mostra como criar um banco de dados chamado SmallBakery usando a ferramenta de design banco de dados SQL Server Compact incluída no WebMatrix. Embora você possa criar um banco de dados usando código, é mais comum criar o banco de dados e as tabelas de banco de dados usando uma ferramenta de design como o WebMatrix.

  1. Inicie o WebMatrix e, na página Início Rápido, clique em Site do Modelo.

  2. Selecione Site Vazio e, na caixa Nome do Site , insira "SmallBakery" e clique em OK. O site é criado e exibido no WebMatrix.

  3. No painel esquerdo, clique no workspace Bancos de Dados.

  4. Na faixa de opções, clique em Novo Banco de Dados. Um banco de dados vazio é criado com o mesmo nome que seu site.

  5. No painel esquerdo, expanda o nó SmallBakery.sdf e clique em Tabelas.

  6. Na faixa de opções, clique em Nova Tabela. WebMatrix abre o designer de tabela.

    [Captura de tela que mostra a Matriz da Web abrindo o designer de tabela.]

  7. Clique na coluna Nome e insira "Id".

  8. Na coluna Tipo de Dados , selecione int.

  9. Defina as opções É Chave Primária? e Identificar? como Sim.

    Como o nome sugere, Is Primary Key informa ao banco de dados que essa será a chave primária da tabela. É Identity informa ao banco de dados para criar automaticamente um número de ID para cada novo registro e atribuí-lo o próximo número sequencial (começando em 1).

  10. Clique na próxima linha. O editor inicia uma nova definição de coluna.

  11. Para o valor Nome, insira "Nome".

  12. Para Tipo de Dados, escolha "nvarchar" e defina o comprimento como 50. A parte var de informa ao banco de nvarchar dados que os dados dessa coluna serão uma cadeia de caracteres cujo tamanho pode variar de registro para registro. (O prefixo n representa nacional, indicando que o campo pode conter dados de caractere que representam qualquer alfabeto ou sistema de gravação , ou seja, que o campo contém dados Unicode.)

  13. Defina a opção Permitir Nulos como Não. Isso imporá que a coluna Nome não seja deixada em branco.

  14. Usando esse mesmo processo, crie uma coluna chamada Descrição. Defina Tipo de Dados como "nvarchar" e 50 para o comprimento e defina Permitir Nulos como false.

  15. Crie uma coluna chamada Price. Defina Tipo de Dados como "money" e defina Permitir Nulos como false.

  16. Na caixa na parte superior, nomeie a tabela como "Produto".

    Quando você terminar, a definição terá esta aparência:

    [Captura de tela mostra como será a definição quando terminar.]

  17. Pressione Ctrl+S para salvar a tabela.

Adicionando dados ao banco de dados

Agora você pode adicionar alguns dados de exemplo ao banco de dados com o qual trabalhará posteriormente no artigo.

  1. No painel esquerdo, expanda o nó SmallBakery.sdf e clique em Tabelas.

  2. Clique com o botão direito do mouse na tabela Produto e clique em Dados.

  3. No painel de edição, insira os seguintes registros:

    Nome Descrição Preço
    Pão Assado fresco todos os dias. 2,99
    Moranguinho Feito com morangos orgânicos do nosso jardim. 9,99
    Torta de Maçã O segundo é só a torta da sua mãe. 12.99
    Torta de Nozes Se você gosta de nozes, isso é para você. 10.99
    Torta de Limão Feito com os melhores limões do mundo. 11.99
    Cupcakes Seus filhos e o garoto em você vão adorar isso. 7,99

    Lembre-se de que você não precisa inserir nada para a coluna Id . Quando você criou a coluna Id , defina sua propriedade Is Identity como true, o que faz com que ela seja preenchida automaticamente.

    Quando você terminar de inserir os dados, o designer de tabela terá esta aparência:

    [A captura de tela mostra como será a aparência do designer de tabela quando os dados terminarem de ser inseridos.]

  4. Feche a guia que contém os dados do banco de dados.

Exibindo dados de um banco de dados

Depois de ter um banco de dados com dados nele, você poderá exibir os dados em uma página da Web ASP.NET. Para selecionar as linhas da tabela a serem exibidas, use uma instrução SQL, que é um comando que você passa para o banco de dados.

  1. No painel esquerdo, clique no workspace Arquivos .

  2. Na raiz do site, crie uma nova página CSHTML chamada ListProducts.cshtml.

  3. Substitua a marcação existente pelo seguinte:

    @{
    var db = Database.Open("SmallBakery");
    var selectQueryString = "SELECT * FROM Product ORDER BY Name";
 }
<!DOCTYPE html>
<html>
 <head>
   <title>Small Bakery Products</title>
   <style>
       table, th, td {
         border: solid 1px #bbbbbb;
         border-collapse: collapse;
         padding: 2px;
       }
    </style>
 </head>
 <body>
   <h1>Small Bakery Products</h1>
   <table>
       <thead>
           <tr>
               <th>Id</th>
               <th>Product</th>
               <th>Description</th>
       <th>Price</th>
           </tr>
       </thead>
       <tbody>
           @foreach(var row in db.Query(selectQueryString)){
            <tr>
               <td>@row.Id</td>
                   <td>@row.Name</td>
                   <td>@row.Description</td>
                   <td>@row.Price</td>
            </tr>
           }
       </tbody>
   </table>
 </body>
</html>

    No primeiro bloco de código, você abre o arquivo SmallBakery.sdf (banco de dados) criado anteriormente. O Database.Open método pressupõe que o arquivo .sdf esteja na pasta App_Data do seu site. (Observe que você não precisa especificar a extensão .sdf — na verdade, se você fizer isso, o Open método não funcionará.)

    Observação

    A pasta App_Data é uma pasta especial em ASP.NET usada para armazenar arquivos de dados. Para obter mais informações, consulte Conectando-se a um banco de dados mais adiante neste artigo.

    Em seguida, você faz uma solicitação para consultar o banco de dados usando a seguinte instrução SQL Select :

    SELECT * FROM Product ORDER BY Name

    Na instrução , Product identifica a tabela a ser consultada. O * caractere especifica que a consulta deve retornar todas as colunas da tabela. (Você também poderia listar colunas individualmente, separadas por vírgulas, se quisesse ver apenas algumas das colunas.) A Order By cláusula indica como os dados devem ser classificados — nesse caso, pela coluna Name . Isso significa que os dados são classificados em ordem alfabética com base no valor da coluna Name para cada linha.

    No corpo da página, a marcação cria uma tabela HTML que será usada para exibir os dados. Dentro do <tbody> elemento , você usa um foreach loop para obter individualmente cada linha de dados retornada pela consulta. Para cada linha de dados, você cria uma linha de tabela HTML (<tr> elemento). Em seguida, você cria células de tabela HTML (<td> elementos) para cada coluna. Cada vez que você passa pelo loop, a próxima linha disponível do banco de dados está na row variável (você configura isso na foreach instrução ). Para obter uma coluna individual da linha, você pode usar row.Name ou row.Description ou qualquer que seja o nome da coluna desejada.

  4. Execute a página em um navegador. (Verifique se a página está selecionada no workspace Arquivos antes de executá-la.) A página exibe uma lista como a seguinte:

    [Captura de tela que mostra a lista que a página exibirá no navegador.]

Dica

Linguagem SQL

SQL é uma linguagem usada na maioria dos bancos de dados relacionais para gerenciar dados em um banco de dados. Ele inclui comandos que permitem recuperar dados e atualizá-los e que permitem criar, modificar e gerenciar tabelas de banco de dados. O SQL é diferente de uma linguagem de programação (como a que você está usando no WebMatrix) porque, com o SQL, a ideia é que você diga ao banco de dados o que deseja e é trabalho do banco de dados descobrir como obter os dados ou executar a tarefa. Aqui estão exemplos de alguns comandos SQL e o que eles fazem:

SELECT Id, Name, Price FROM Product WHERE Price > 10.00 ORDER BY Name

Isso buscará as colunas ID, Nome e Preço dos registros na tabela Product se o valor de Price for maior que 10 e retornará os resultados em ordem alfabética com base nos valores da coluna Name . Esse comando retornará um conjunto de resultados que contém os registros que atendem aos critérios ou um conjunto vazio se nenhum registro corresponder.

INSERT INTO Product (Name, Description, Price) VALUES ("Croissant", "A flaky delight", 1.99)

Isso insere um novo registro na tabela Product , definindo a coluna Name como "Segmentação", a coluna Descrição como "Uma delícia esfarrapada" e o preço como 1,99.

DELETE FROM Product WHERE ExpirationDate < "01/01/2008"

Esse comando exclui registros na tabela Product cuja coluna de data de validade é anterior a 1º de janeiro de 2008. (Isso pressupõe que a tabela Product tenha essa coluna, é claro.) A data é inserida aqui no formato MM/DD/AAAA, mas deve ser inserida no formato usado para sua localidade.

Os Insert Into comandos e Delete não retornam conjuntos de resultados. Em vez disso, eles retornam um número que informa quantos registros foram afetados pelo comando.

Para algumas dessas operações (como inserir e excluir registros), o processo que está solicitando a operação precisa ter permissões apropriadas no banco de dados. É por isso que, para bancos de dados de produção, você geralmente precisa fornecer um nome de usuário e uma senha ao se conectar ao banco de dados.

Há dezenas de comandos SQL, mas todos seguem um padrão como este. Você pode usar comandos SQL para criar tabelas de banco de dados, contar o número de registros em uma tabela, calcular preços e executar muito mais operações.

Inserindo dados em um banco de dados

Esta seção mostra como criar uma página que permite que os usuários adicionem um novo produto à tabela Banco de dados de produtos . Depois que um novo registro de produto é inserido, a página exibe a tabela atualizada usando a página ListProducts.cshtml que você criou na seção anterior.

A página inclui validação para garantir que os dados inseridos pelo usuário sejam válidos para o banco de dados. Por exemplo, o código na página garante que um valor tenha sido inserido para todas as colunas necessárias.

  1. No site, crie um novo arquivo CSHTML chamado InsertProducts.cshtml.

  2. Substitua a marcação existente pelo seguinte:

    @{
    Validation.RequireField("Name", "Product name is required.");
    Validation.RequireField("Description", "Product description is required.");
    Validation.RequireField("Price", "Product price is required.");

    var db = Database.Open("SmallBakery");
    var Name = Request.Form["Name"];
    var Description = Request.Form["Description"];
    var Price = Request.Form["Price"];

    if (IsPost && Validation.IsValid()) {
        // Define the insert query. The values to assign to the
        // columns in the Product table are defined as parameters
        // with the VALUES keyword.
        if(ModelState.IsValid) {
            var insertQuery = "INSERT INTO Product (Name, Description, Price) " +
                "VALUES (@0, @1, @2)";
            db.Execute(insertQuery, Name, Description, Price);
            // Display the page that lists products.
            Response.Redirect("~/ListProducts");
        }
    }
}

<!DOCTYPE html>
<html>
<head>
 <title>Add Products</title>
 <style type="text/css">
    label {float:left; width: 8em; text-align: right;
           margin-right: 0.5em;}
    fieldset {padding: 1em; border: 1px solid; width: 50em;}
    legend {padding: 2px 4px; border: 1px solid; font-weight:bold;}
    .validation-summary-errors {font-weight:bold; color:red;
           font-size: 11pt;}
 </style>
</head>
<body>
 <h1>Add New Product</h1>

 @Html.ValidationSummary("Errors with your submission:")

 <form method="post" action="">
   <fieldset>
     <legend>Add Product</legend>
     <div>
       <label>Name:</label>
       <input name="Name" type="text" size="50" value="@Name" />
     </div>
     <div>
       <label>Description:</label>
       <input name="Description" type="text" size="50"
           value="@Description" />
     </div>
     <div>
       <label>Price:</label>
       <input name="Price" type="text" size="50" value="@Price" />
     </div>
     <div>
       <label>&nbsp;</label>
       <input type="submit" value="Insert" class="submit" />
     </div>
   </fieldset>
 </form>
</body>
</html>

    O corpo da página contém um formulário HTML com três caixas de texto que permitem que os usuários insiram um nome, uma descrição e um preço. Quando os usuários clicam no botão Inserir , o código na parte superior da página abre uma conexão com o banco de dados SmallBakery.sdf . Em seguida, você obtém os valores que o usuário enviou usando o Request objeto e atribui esses valores a variáveis locais.

    Para validar que o usuário inseriu um valor para cada coluna necessária, registre cada <input> elemento que deseja validar:

    Validation.RequireField("Name", "Product name is required.");
Validation.RequireField("Description", "Product description is required.");
Validation.RequireField("Price", "Product price is required.");

    O Validation auxiliar verifica se há um valor em cada um dos campos que você registrou. Você pode testar se todos os campos passaram na validação verificando Validation.IsValid(), o que você normalmente faz antes de processar as informações que obtém do usuário:

    if (IsPost && Validation.IsValid()) {
    // Process information here
}

    (O && operador significa AND — este teste será Se este for um envio de formulário E todos os campos tiverem passado pela validação.)

    Se todas as colunas validadas (nenhuma estiver vazia), você criará uma instrução SQL para inserir os dados e, em seguida, execute-os conforme mostrado a seguir:

    var insertQuery =
    "INSERT INTO Product (Name, Description, Price) VALUES (@0, @1, @2)";

    Para que os valores insiram, inclua espaços reservados de parâmetro (@0, @1, @2).

    Observação

    Como precaução de segurança, sempre passe valores para uma instrução SQL usando parâmetros, como você vê no exemplo anterior. Isso oferece a oportunidade de validar os dados do usuário, além de ajudar a proteger contra tentativas de enviar comandos mal-intencionados para o banco de dados (às vezes chamados de ataques de injeção de SQL).

    Para executar a consulta, use essa instrução, passando para ela as variáveis que contêm os valores a serem substituídos pelos espaços reservados:

    db.Execute(insertQuery, Name, Description, Price);

    Depois que a Insert Into instrução for executada, você enviará o usuário para a página que lista os produtos usando esta linha:

    Response.Redirect("~/ListProducts");

    Se a validação não tiver sido bem-sucedida, você ignorará a inserção. Em vez disso, você tem um auxiliar na página que pode exibir as mensagens de erro acumuladas (se houver):

    @Html.ValidationSummary("Errors with your submission:")

    Observe que o bloco de estilo na marcação inclui uma definição de classe CSS chamada .validation-summary-errors. Esse é o nome da classe CSS usada por padrão para o <div> elemento que contém erros de validação. Nesse caso, a classe CSS especifica que os erros de resumo de validação são exibidos em vermelho e em negrito, mas você pode definir a .validation-summary-errors classe para exibir qualquer formatação desejada.

Testando a página Inserir

  1. Exibir a página em um navegador. A página exibe um formulário semelhante ao mostrado na ilustração a seguir.

    [A captura de tela mostra um formulário que será exibido na página em um navegador.]

  2. Insira valores para todas as colunas, mas certifique-se de deixar a coluna Preço em branco.

  3. Clique em Inserir. A página exibe uma mensagem de erro, conforme mostrado na ilustração a seguir. (Nenhum novo registro é criado.)

    [Captura de tela que mostra uma mensagem de erro.]

  4. Preencha o formulário completamente e clique em Inserir. Desta vez, a página ListProducts.cshtml é exibida e mostra o novo registro.

Atualizando dados em um banco de dados

Depois que os dados forem inseridos em uma tabela, talvez seja necessário atualizá-los. Este procedimento mostra como criar duas páginas semelhantes às que você criou para a inserção de dados anteriormente. A primeira página exibe produtos e permite que os usuários selecionem um para alterar. A segunda página permite que os usuários realmente façam as edições e as salvem.

Observação

Importante Em um site de produção, você normalmente restringe quem tem permissão para fazer alterações nos dados. Para obter informações sobre como configurar a associação e sobre maneiras de autorizar os usuários a executar tarefas no site, consulte Adicionando segurança e associação a um site de Páginas da Web do ASP.NET.

  1. No site, crie um novo arquivo CSHTML chamado EditProducts.cshtml.

  2. Substitua a marcação existente no arquivo pelo seguinte:

    @{
    var db = Database.Open("SmallBakery");
    var selectQueryString = "SELECT * FROM Product ORDER BY Name";

}
<!DOCTYPE html>
<html>
<head>
    <title>Edit Products</title>
    <style type="text/css">
        table, th, td {
          border: solid 1px #bbbbbb;
          border-collapse: collapse;
          padding: 2px;
        }
    </style>
</head>
<body>
    <h1>Edit Small Bakery Products</h1>
    <table>
      <thead>
        <tr>
          <th>&nbsp;</th>
          <th>Name</th>
          <th>Description</th>
          <th>Price</th>
        </tr>
      </thead>
      <tbody>
        @foreach (var row in db.Query(selectQueryString)) {
          <tr>
            <td><a href="@Href("~/UpdateProducts", row.Id)">Edit</a></td>
            <td>@row.Name</td>
            <td>@row.Description</td>
            <td>@row.Price</td>
          </tr>
        }
      </tbody>
    </table>
</body>
</html>

    A única diferença entre essa página e a página ListProducts.cshtml anterior é que a tabela HTML nesta página inclui uma coluna extra que exibe um link Editar . Quando você clica nesse link, ele leva você para a página UpdateProducts.cshtml (que você criará em seguida), onde você pode editar o registro selecionado.

    Examine o código que cria o link Editar :

    <a href="@Href("~/UpdateProducts", row.Id)">Edit</a></td>

    Isso cria um elemento HTML <a> cujo href atributo é definido dinamicamente. O href atributo especifica a página a ser exibida quando o usuário clica no link. Ele também passa o Id valor da linha atual para o link. Quando a página é executada, a origem da página pode conter links como estes:

    <a href="UpdateProducts/1">Edit</a></td>
<a href="UpdateProducts/2">Edit</a></td>
<a href="UpdateProducts/3">Edit</a></td>

    Observe que o href atributo é definido UpdateProducts/ncomo , em que n é um número de produto. Quando um usuário clica em um desses links, a URL resultante terá esta aparência:

    http://localhost:18816/UpdateProducts/6

    Em outras palavras, o número do produto a ser editado será passado na URL.

  3. Exibir a página em um navegador. A página exibe os dados em um formato como este:

    [Captura de tela que mostra os dados exibidos na página no navegador.]

    Em seguida, você criará a página que permite que os usuários atualizem os dados. A página de atualização inclui validação para validar os dados inseridos pelo usuário. Por exemplo, o código na página garante que um valor tenha sido inserido para todas as colunas necessárias.

  4. No site, crie um novo arquivo CSHTML chamado UpdateProducts.cshtml.

  5. Substitua a marcação existente no arquivo pelo seguinte.

    @{
    Validation.RequireField("Name", "Product name is required.");
    Validation.RequireField("Description", "Product description is required.");
    Validation.RequireField("Price", "Product price is required.");

    var Name = "";
    var Description = "";
    var Price = Decimal.Zero;

    var ProductId  = UrlData[0];
    if (ProductId.IsEmpty()) {
         Response.Redirect("~/EditProducts");
    }

    var db = Database.Open("SmallBakery");

    if (IsPost && Validation.IsValid()) {
        var updateQueryString =
            "UPDATE Product SET Name=@0, Description=@1, Price=@2 WHERE Id=@3" ;
        Name = Request["Name"];
        Description = Request["Description"];
        Price = Request["Price"].AsDecimal();
        db.Execute(updateQueryString, Name, Description, Price, ProductId);
        Response.Redirect(@Href("~/EditProducts"));
    }
    else {
        var selectQueryString = "SELECT * FROM Product WHERE Id=@0";

        var row = db.QuerySingle(selectQueryString, ProductId);
        Name = row.Name;
        Description = row.Description;
        Price = row.Price;
    }

}

<!DOCTYPE html>
<html>
<head>
  <title>Add Products</title>
  <style type="text/css">
     label { float: left; width: 8em; text-align: right;
             margin-right: 0.5em;}
     fieldset { padding: 1em; border: 1px solid; width: 35em;}
     legend { padding: 2px 4px;  border: 1px solid; font-weight: bold;}
     .validation-summary-errors {font-weight:bold; color:red; font-size:11pt;}
  </style>
</head>
<body>
  <h1>Update Product</h1>
   @Html.ValidationSummary("Errors with your submission:")
   <form method="post" action="">
     <fieldset>
       <legend>Update Product</legend>
       <div>
         <label>Name:</label>
         <input name="Name" type="text" size="50" value="@Name" />
       </div>
       <div>
         <label>Description:</label>
         <input name="Description" type="text" size="50"
            value="@Description" />
       </div>
       <div>
          <label>Price:</label>
          <input name="Price" type="text" size="50" value="@Price" />
       </div>
       <div>
          <label>&nbsp;</label>
          <input type="submit" value="Update" class="submit" />
       </div>
    </fieldset>
  </form>
</body>
</html>

    O corpo da página contém um formulário HTML em que um produto é exibido e onde os usuários podem editá-lo. Para que o produto seja exibido, use esta instrução SQL:

    SELECT * FROM Product WHERE Id=@0

    Isso selecionará o produto cuja ID corresponde ao valor passado no @0 parâmetro . (Como a ID é a chave primária e, portanto, deve ser exclusiva, apenas um registro de produto pode ser selecionado dessa maneira.) Para obter o valor da ID a ser passado para essa Select instrução, você pode ler o valor passado para a página como parte da URL, usando a seguinte sintaxe:

    var ProductId  = UrlData[0];

    Para realmente buscar o registro do produto, use o QuerySingle método , que retornará apenas um registro:

    var row = db.QuerySingle(selectQueryString, ProductId);

    A única linha é retornada para a row variável . Você pode obter dados de cada coluna e atribuí-los a variáveis locais como esta:

    var Name = row.Name;
var Description = row.Description;
var Price = row.Price;

    Na marcação do formulário, esses valores são exibidos automaticamente em caixas de texto individuais usando código inserido como o seguinte:

    <input name="Name" type="text" size="50" value="@Name" />

    Essa parte do código exibe o registro do produto a ser atualizado. Depois que o registro for exibido, o usuário poderá editar colunas individuais.

    Quando o usuário envia o formulário clicando no botão Atualizar , o código no if(IsPost) bloco é executado. Isso obtém os valores do usuário do Request objeto , armazena os valores em variáveis e valida que cada coluna foi preenchida. Se a validação for aprovada, o código criará a seguinte instrução atualização do SQL:

    UPDATE Product SET Name=@0, Description=@1, Price=@2, WHERE ID=@3

    Em uma instrução SQL Update , você especifica cada coluna a ser atualizada e o valor para o qual defini-la. Nesse código, os valores são especificados usando os espaços reservados @0de parâmetro , @1, @2e assim por diante. (Conforme observado anteriormente, para segurança, você sempre deve passar valores para uma instrução SQL usando parâmetros.)

    Ao chamar o db.Execute método , você passa as variáveis que contêm os valores na ordem que corresponde aos parâmetros na instrução SQL:

    db.Execute(updateQueryString, Name, Description, Price, ProductId);

    Depois que a Update instrução tiver sido executada, você chamará o seguinte método para redirecionar o usuário de volta para a página de edição:

    Response.Redirect(@Href("~/EditProducts"));

    O efeito é que o usuário vê uma listagem atualizada dos dados no banco de dados e pode editar outro produto.

  6. Salve a página.

  7. Execute a página EditProducts.cshtml (não a página de atualização) e clique em Editar para selecionar um produto a ser editado. A página UpdateProducts.cshtml é exibida, mostrando o registro selecionado.

    [Captura de tela que mostra a página Atualizar Produtos, juntamente com o registro selecionado.]

  8. Faça uma alteração e clique em Atualizar. A lista de produtos é mostrada novamente com os dados atualizados.

Excluindo dados em um banco de dados

Esta seção mostra como permitir que os usuários excluam um produto da tabela Banco de dados de produtos . O exemplo consiste em duas páginas. Na primeira página, os usuários selecionam um registro a ser excluído. O registro a ser excluído é exibido em uma segunda página que permite confirmar que deseja excluir o registro.

Observação

Importante Em um site de produção, você normalmente restringe quem tem permissão para fazer alterações nos dados. Para obter informações sobre como configurar a associação e sobre maneiras de autorizar o usuário a executar tarefas no site, consulte Adicionando segurança e associação a um site do Páginas da Web do ASP.NET.

  1. No site, crie um novo arquivo CSHTML chamado ListProductsForDelete.cshtml.

  2. Substitua a marcação existente pelo seguinte:

    @{
  var db = Database.Open("SmallBakery");
  var selectQueryString = "SELECT * FROM Product ORDER BY Name";
}
<!DOCTYPE html>
<html>
<head>
    <title>Delete a Product</title>
    <style>
        table, th, td {
          border: solid 1px #bbbbbb;
          border-collapse: collapse;
          padding: 2px;
        }
     </style>
</head>
<body>
  <h1>Delete a Product</h1>
  <form method="post" action="" name="form">
    <table border="1">
      <thead>
        <tr>
          <th>&nbsp;</th>
          <th>Name</th>
          <th>Description</th>
          <th>Price</th>
        </tr>
      </thead>
      <tbody>
        @foreach (var row in db.Query(selectQueryString)) {
          <tr>
            <td><a href="@Href("~/DeleteProduct", row.Id)">Delete</a></td>
            <td>@row.Name</td>
            <td>@row.Description</td>
            <td>@row.Price</td>
          </tr>
        }
      </tbody>
    </table>
  </form>
</body>
</html>

    Esta página é semelhante à página EditProducts.cshtml de antes. No entanto, em vez de exibir um link Editar para cada produto, ele exibe um link Excluir . O link Excluir é criado usando o seguinte código inserido na marcação:

    <a href="@Href("~/DeleteProduct", row.Id)">Delete</a>

    Isso cria uma URL semelhante a esta quando os usuários clicam no link:

    http://<server>/DeleteProduct/4

    A URL chama uma página chamada DeleteProduct.cshtml (que você criará em seguida) e passa a ela a ID do produto a ser excluída (aqui, 4).

  3. Salve o arquivo, mas deixe-o aberto.

  4. Crie outro arquivo CHTML chamado DeleteProduct.cshtml. Substitua o conteúdo existente pelo seguinte:

    @{
  var db = Database.Open("SmallBakery");
  var ProductId = UrlData[0];
  if (ProductId.IsEmpty()) {
    Response.Redirect("~/ListProductsForDelete");
  }
  var prod = db.QuerySingle("SELECT * FROM PRODUCT WHERE ID = @0", ProductId);
  if( IsPost && !ProductId.IsEmpty()) {
    var deleteQueryString = "DELETE FROM Product WHERE Id=@0";
    db.Execute(deleteQueryString, ProductId);
    Response.Redirect("~/ListProductsForDelete");
  }
}

<!DOCTYPE html>
<html>
<head>
    <title>Delete Product</title>
</head>
<body>
  <h1>Delete Product - Confirmation</h1>
  <form method="post" action="" name="form">
    <p>Are you sure you want to delete the following product?</p>

    <p>Name: @prod.Name <br />
       Description: @prod.Description <br />
       Price: @prod.Price</p>
    <p><input type="submit" value="Delete" /></p>
  </form>
</body>
</html>

    Esta página é chamada por ListProductsForDelete.cshtml e permite que os usuários confirmem que desejam excluir um produto. Para listar o produto a ser excluído, você obtém a ID do produto a ser excluída da URL usando o seguinte código:

    var ProductId = UrlData[0];

    Em seguida, a página solicita que o usuário clique em um botão para realmente excluir o registro. Essa é uma medida de segurança importante: quando você executa operações confidenciais em seu site, como atualizar ou excluir dados, essas operações sempre devem ser feitas usando uma operação POST, não uma operação GET. Se o site estiver configurado para que uma operação de exclusão possa ser executada usando uma operação GET, qualquer pessoa poderá passar uma URL como http://<server>/DeleteProduct/4 e excluir tudo o que quiser do banco de dados. Ao adicionar a confirmação e codificar a página para que a exclusão possa ser executada somente usando um POST, você adiciona uma medida de segurança ao seu site.

    A operação de exclusão real é executada usando o seguinte código, que primeiro confirma que se trata de uma operação de postagem e que a ID não está vazia:

    if( IsPost && !ProductId.IsEmpty()) {
    var deleteQueryString = "DELETE FROM Product WHERE Id=@0";
    db.Execute(deleteQueryString, ProductId);
    Response.Redirect("~/ListProductsForDelete");
}

    O código executa uma instrução SQL que exclui o registro especificado e redireciona o usuário de volta para a página de listagem.

  5. Execute ListProductsForDelete.cshtml em um navegador.

    [Captura de tela que mostra a execução de produtos de lista para excluir ponto CSHTML no navegador.]

  6. Clique no link Excluir para um dos produtos. A página DeleteProduct.cshtml é exibida para confirmar que você deseja excluir esse registro.

  7. Clique no botão Excluir . O registro do produto é excluído e a página é atualizada com uma listagem de produtos atualizada.

Dica

Conectando a um banco de dados

Você pode se conectar a um banco de dados de duas maneiras. A primeira é usar o Database.Open método e especificar o nome do arquivo de banco de dados (menos a extensão .sdf ):

var db = Database.Open("SmallBakery");

O Open método pressupõe que o .O arquivo sdf está na pasta App_Data do site. Essa pasta foi projetada especificamente para armazenar dados. Por exemplo, ele tem permissões apropriadas para permitir que o site leia e escreva dados e, como medida de segurança, o WebMatrix não permite o acesso a arquivos dessa pasta.

A segunda maneira é usar uma cadeia de conexão. Uma cadeia de conexão contém informações sobre como conectar a um banco de dados. Isso pode incluir um caminho de arquivo ou pode incluir o nome de um banco de dados SQL Server em um servidor local ou remoto, juntamente com um nome de usuário e senha para se conectar a esse servidor. (Se você mantiver os dados em uma versão gerenciada centralmente do SQL Server, como no site de um provedor de hospedagem, sempre usará uma cadeia de conexão para especificar as informações de conexão de banco de dados.)

No WebMatrix, as cadeias de conexão geralmente são armazenadas em um arquivo XML chamado Web.config. Como o nome indica, você pode usar um arquivo Web.config na raiz do seu site para armazenar as informações de configuração do site, incluindo quaisquer cadeias de conexão que seu site possa exigir. Um exemplo de uma cadeia de conexão em um arquivo Web.config pode ser semelhante ao seguinte. Observação $CREDENTIAL_PLACEHOLDER$ é um espaço reservado para o par chave/valor da senha:

<?xml version="1.0" encoding="utf-8" ?>
<configuration>
  <connectionStrings>
   <add
     name="SQLServerConnectionString"
     connectionString= "server=myServer;database=myDatabase;uid=username;$CREDENTIAL_PLACEHOLDER$"
     providerName="System.Data.SqlClient" />
  </connectionStrings>
</configuration>

No exemplo, a cadeia de conexão aponta para um banco de dados em uma instância de SQL Server em execução em um servidor em algum lugar (em vez de um arquivo .sdf local). Você precisaria substituir os nomes apropriados para myServer e myDatabasee especificar SQL Server valores de logon para username e password. (Os valores de nome de usuário e senha não são necessariamente os mesmos que suas credenciais do Windows ou os valores que seu provedor de hospedagem lhe deu para fazer logon em seus servidores. Verifique com o administrador os valores exatos necessários.)

O Database.Open método é flexível, pois permite que você passe o nome de um arquivo .sdf do banco de dados ou o nome de uma cadeia de conexão armazenada no arquivo Web.config . O exemplo a seguir mostra como se conectar ao banco de dados usando a cadeia de conexão ilustrada no exemplo anterior:

@{
    var db = Database.Open("SQLServerConnectionString");
}

Conforme observado, o Database.Open método permite que você passe um nome de banco de dados ou uma cadeia de conexão e descobrirá qual usar. Isso é muito útil quando você implanta (publicar) seu site. Você pode usar um arquivo .sdf na pasta App_Data ao desenvolver e testar seu site. Em seguida, ao mover seu site para um servidor de produção, você pode usar uma cadeia de conexão no arquivo Web.config que tenha o mesmo nome que o arquivo .sdf , mas que aponta para o banco de dados do provedor de hospedagem , tudo sem precisar alterar seu código.

Por fim, se você quiser trabalhar diretamente com uma cadeia de conexão, poderá chamar o Database.OpenConnectionString método e passá-lo a cadeia de conexão real em vez de apenas o nome de um no arquivo Web.config . Isso pode ser útil em situações em que, por algum motivo, você não tem acesso à cadeia de conexão (ou valores nela, como o nome do arquivo .sdf ) até que a página esteja em execução. No entanto, para a maioria dos cenários, você pode usar Database.Open conforme descrito neste artigo.

Recursos adicionais