WebMatrix -  Consultando, Inserindo , Excluindo e atualizando dados - III


Se você esta chegando agora deve saber que...

  1. Na primeira parte deste artigo abordamos os conceitos sobre banco de dados relacionais e criamos o banco de dados Padaria.sdf e a tabela Produtos no  SQL Server Compact.
  2. Na segunda parte do artigo mostrei como podemos inserir usando o WebMatrix com Razor para criar uma página para incluir novos registros no banco de dados SQL Server Compact usado na aplicação;

Abaixo vemos o resultado do nosso trabalho : a página InserirProdutos.cshtml com os valores incluídos.

Criando as páginas para  selecionar o produto e atualizar os dados

Nossa próxima tarefa é criar a página que permite atualizar o banco de dados Padaria.sdf.

Depois que os dados foram inseridos em uma tabela, talvez seja necessário atualizá-los. Neste artigo eu mostro como criar duas páginas que são semelhantes às que você criou para incluir dados.

Obs: Em um outro artigo irei mostrar como podemos implementar a segurança.

a-) Criando a página para selecionar o produto

Abra  o WebMatrix e na janela principal clique no ícone My Sites;

A seguir selecione o site Padaria que criamos no primeiro artigo;

Na próxima janela clique no menu Files; Observe os arquivos que já criamos para o site;

Vamos criar um novo arquivo CSHTML chamado EditarProdutos.cshtml selecionando a opção New -> New File;

Na janela seguinte selecione o tipo CSHTML, informe o nome EditarProdutos.cshtml e clique no botão OK;

Em seguida digite o código abaixo substituindo o código inicial da página EditarProdutos.cshtml conforme o da figura abaixo:

A única diferença entre essa página e a página de ListarProdutos.cshtml é que a tabela HTML nesta página inclui uma coluna extra que exibe o link Editar. Quando você clica neste link, você será levado para a página AtualizaProdutos.cshtml (que iremos criar em seguida), onde você pode editar o registro selecionado.

O trecho de código abaixo mostra a utilização da linha de código  <a href="@Href("~/AtualizaProdutos",row.Codigo)" que chama a página AtualizaProdutos.cshtml e passa o código do produto;

      <tbody>
        @foreach (var row in db.Query(selectQueryString)) {
          <tr>
            <td><a href="@Href("~/AtualizaProdutos", row.Codigo)">Editar</a></td>
            <td>@row.Nome</td>
            <td>@row.Descricao</td>
            <td>@row.Preco</td>

          </tr>
        }
      </tbody>

O código cria uma âncora HTML (um elemento <a>), cujo atributo href é definido dinamicamente. O atributo href especifica a página para exibir quando o usuário clica no link. Ele também passa o valor do Codigo da linha atual para o link.

Vamos visualizar a página executando-a. Para isso , selecione o arquivo EditarProdutos.cshtml e clicando o botão direito do mouse selecione a opção Launch in browser;

Você deverá obter a página exibida na figura abaixo, onde vemos os produtos e o link editar que deverá chamar a página AtualizaProdutos.cshtm passando o código do produto;

Nossa próxima tarefa será então criar a página para atualizar o produto selecionado e salvar as alterações no banco de dados.

b-) Criando a página para atualizar e salvar as alterações

Vamos repetir os procedimento do item para criar a página AtualizaProdutos.cshtml;

-  Selecione a opção New -> New File do menu;
Na janela seguinte selecione o tipo CSHTML, informe o nome AtualizaProdutos.cshtml e clique no botão OK;

Em seguida digite o código abaixo substituindo o código inicial da página AtualizaProdutos.cshtml conforme o da figura abaixo:

@{
    var db = Database.Open("Padaria");
    var selectQueryString = "SELECT * FROM Produtos WHERE Codigo=@0";
    var CodigoProduto  = UrlData[0];
    if (CodigoProduto.IsEmpty()) {
         Response.Redirect(@Href("~/EditarProdutos"));
     }
    var row = db.QuerySingle(selectQueryString, CodigoProduto);
    var Nome = row.Nome;
    var Descricao = row.Descricao;
    var Preco = row.Preco;
    if (IsPost) {
         Nome = Request["Nome"];
         if (String.IsNullOrEmpty(Nome)) {
           ModelState.AddError("Nome", "O Nome do produto é obrigatório.");
         }
        Descricao = Request["Descricao"];
        if (String.IsNullOrEmpty(Descricao)) {
          ModelState.AddError("Descricao", "A descrição do Produto é obrigatória.");
        }
        Preco = Request["Preco"];
        if (String.IsNullOrEmpty(Preco)) {
          ModelState.AddError("Preco", "O Preço do Produto é obrigatório.");
        }
        if(ModelState.IsValid) {
            var updateQueryString =
              "UPDATE Produtos SET Nome=@0, Descricao=@1, Preco=@2 WHERE Codigo=@3" ;
            db.Execute(updateQueryString, Nome, Descricao, Preco, CodigoProduto);
            Response.Redirect(@Href("~/EditarProdutos"));
        }
    }
}
<!DOCTYPE html>
<html>
<head>
    <title>Atualizar Produtos</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>Atualizar Produto</h1>
    @Html.ValidationSummary("Ocorreram erros na sua submissão :")
    <form method="post" action="">
        <fieldset>
            <legend>Atualiza Produto</legend>
            <div>
                <label>Nome:</label>
                <input name="Nome" type="text" size="50" value="@Nome" />
            </div>
            <div>
                <label>Descrição:</label>
                <input name="Descricao" type="text" size="50" value="@Descricao" />
            </div>
            <div>
                <label>Preço:</label>
                <input name="Preco" type="text" size="50" value="@Preco" />
            </div>
            <div>
                <label>&nbsp;</label>
                <input type="submit" value="Atualizar" class="submit" />
            </div>
        </fieldset>
    </form>
</body>
</html>

No corpo da página temos um formulário HTML onde um produto é exibido e onde os usuários podem editá-lo. Para obter o produto a ser exibido, primeiro abrimos o banco de dados e a seguir  usamos uma instrução SQL:

    var db = Database.Open("Padaria");
    var selectQueryString = "SELECT * FROM Produtos WHERE Codigo=@0";

A instrução SQL vai selecionar o produto cuja identificação corresponde ao valor que é passado no parâmetro @0, pois como o Codigo é chave primária, teremos sempre somente um produto selecionado. Para obter o valor do Codigo para passar para a instrução SELECT podemos ler o valor passado para a página como parte da URL usando a seguinte sintaxe:

     var CodigoProduto  = UrlData[0];

Para obter o registro do produto com o código informado , usamos o  método QuerySingle, passando a string SQL e o código do produto lido da URL, que retorna apenas um único registro:

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

O registro obtido é retornado na variável row e assim podemos obter o valor de cada coluna e atribuí-los a variáveis locais conforme abaixo:

    var Nome = row.Nome;
    var Descricao = row.Descricao;
    var Preco = row.Preco;

No formuilário HTML as tags exibem os valores em caixas de textos individuais usando o código a seguir:

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

Temos assim o registro exibido e pronto para ser editado conforme mostra a figura abaixo.

O usuário pode fazer as alterações e enviar o formulário clicando no botão Atualizar. Ao fazer isso o código no bloco If(isPost) é executado fazendo o seguinte:

1 - obtêm os valores do usuário via objeto Request (Ex:Request["Nome"])
2 - armazena os valores em variáveis (Ex:Nome,Descricao,Preco) locais;
3 - valida cada coluna que foi preenchida;

Se a validação não acusar nenhum erro será criada a seguinte instrução SQL:

       var updateQueryString ="UPDATE Produtos SET Nome=@0, Descricao=@1, Preco=@2 WHERE Codigo=@3" ;

Nesta instrução Update definimos cada coluna que deve ser atualizada e o valor que será atribuído a ela. No código do nosso exemplo os valores são especificados usando a notação do parâmetros:  @0, @1 e @2.

A seguir chamamos o método db.Execute que passa as variáveis contendo os valores na ordem aos parâmetros da instrução SQL:

      db.Execute(updateQueryString, Nome, Descricao, Preco, CodigoProduto);

Depois que a instrução SQL foi executada retornamos o usuário de volta a página de edição usando o seguinte comando:

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

Abaixo podemos ver página de edição exibida com a alteração :

Dessa forma o usuário visualiza a página com a alteração feita e pode realizar outras alterações.

Muito simples , não é mesmo ????

Estamos quase terminando, só falta mostrar a parte de exclusão dos produtos...

Aguarde que na continuação deste artigo vou mostrar como deletar dados na tabela Produtos usando o WebMatriz e o Razor.

WebMatrix -  Consultando, Inserindo , Excluindo e atualizando dados - IV

Eu sei é apenas WebMatrix, mas eu gosto...

"E Jesus lhes disse: Eu sou o pão da vida: aquele que vem a mim não terá fome; e quem crê em mim nunca terá sede." (João 6:35)

Referências:

José Carlos Macoratti