Solucionado (ver solução)
Solucionado
(ver solução)
12
respostas

Alberto Souza me ajuda

Eu acabei o curso e até agora não consegui fazer a função editar.. bom na verdade consegui, o problema é deixar os dados persistidos no form! veja como eu fiz.

DAO

function ProdutosDAO(connection) {
    this._connection = connection;
}

ProdutosDAO.prototype

        .findAll = function (callback) {
    this._connection.query('SELECT * FROM produtos', callback);
};

ProdutosDAO.prototype
        .salva = function(produtos,callback) {
    this._connection.query('INSERT INTO produtos SET ?', produtos, callback);

};
ProdutosDAO.prototype

        .deletar = function(id,callback) {
    this._connection.query('DELETE FROM produtos WHERE id=?',[id] , callback);

};
ProdutosDAO.prototype

    .save_update = function(id, produtos, callback) {
    this._connection.query('UPDATE FROM produtos SET ? WHERE id=?',[id, produtos] , callback);

};

ProdutosDAO.prototype

        .findById = function(id,callback) {
    this._connection.query('SELECT * FROM produtos WHERE id=?', [id], callback);

};
module.exports = function () {
    return ProdutosDAO;
};

FORM

<html>
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<link href='https://fonts.googleapis.com/css?family=Raleway:800italic' rel='stylesheet' type='text/css'>
<link href='https://fonts.googleapis.com/css?family=Open+Sans+Condensed:300|Chewy' rel='stylesheet' type='text/css'>
<body background="http://static.tumblr.com/ibcdiqw/Ie9lvg8i2/15_-_degrad___verde.png">
<div class="errors">
    <% if(errs) { %>
    <ul>
        <% for(var i = 0; i < errs.length; i++) { %>
        <li><%= errs[i].param %> - <%= errs[i].msg %></li>
        <% } %>
    </ul>
    <% } %>
</div>
<div align="center">
    <h2 style="color: #3e8f3e; font-family: 'Chewy', cursive;">CADASTRAR LIVROS NO SISTEMA</h2>
</div>
<div align="center">
<form action="/produtos" method="post" class="form-inline">
    <div class="form-group" align="center">
        <br><br>
        <label for="nome">Título</label>
        <br>
        <input type="text" class="form-control" id="nome" value="<%=produtos.nome%>" name="nome" placeholder="Qual o título do livro?">
    </div>
    <br><br>
    <div class="form-group" align="center">

        <label for="preco">Preço</label>
        <br>
        <input type="text" class="form-control" id="preco" name="preco" value="<%=produtos.preco%>"  placeholder="Money, cash, facada">
    </div>
    <br><br>
    <div class="form-group" align="center">
        <label for="descricao">Descrição</label>
        <br>
        <textarea type="text" class="form-control" id="descricao" name="descricao"
                  placeholder="Como é o livro?"><%=produtos.descricao%></textarea>
    </div>
    <br><br>
    <div align="center">
        <input type="submit" class="btn btn-success" value="Guardar na Estante :)">
    </div>
</form>
</div>
</body>
</html>

ROTA GET

app.get('/produtos/:id', function (req, resp, next) {
        var connection = app.infra.connectionFactory();
        var produtosDAO = new app.infra.ProdutosDAO(connection);
        var produtos = req.body
        var id = req.params.id
        produtosDAO.findById(id, function (err, results) {
            if(err){
                return next(err);
            }
            resp.render('produtos/form', {
                errs: {},
                produtos: results
            });
        });
    });

LISTA

<html>
<head>
    <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
    <link href='https://fonts.googleapis.com/css?family=Raleway:800italic' rel='stylesheet' type='text/css'>
    <link href='https://fonts.googleapis.com/css?family=Open+Sans+Condensed:300|Chewy' rel='stylesheet' type='text/css'>
    <script>function confirmValidation() {
            return window.confirm('Tem certeza que deseja excluir esse produto?');
        }</script>
</head>
<body background="http://static.tumblr.com/ibcdiqw/Ie9lvg8i2/15_-_degrad___verde.png">
<div align="center">
    <h2 style=" font-family: 'Chewy', cursive; color: #3e8f3e">LISTA DE LIVROS CADASTRADOS</h2>
</div>
<div align="center">
    <tbody>
    <div>
        <table border="black" class="table table-bordered"
               style=" margin:auto; width: 800px; font-family: 'Chewy', cursive;color: #0f0f0f">
            <tr bgcolor="black" style="font-family: 'Chewy', cursive;color: white">

                <td align="center">ID</td>
                <td align="center">NOME</td>
                <td align="center">DESCRIÇÃO</td>
                <td align="center">PREÇO</td>
                <td align="center">ACÃO</td>
            </tr>
            <% for(var i = 0; i < lista.length; i++) { %>
            <tr>
                <td><%= lista[i].id %></td>
                <td><%= lista[i].nome %></td>
                <td><%= lista[i].descricao %></td>
                <td><%= lista[i].preco %></td>
                <td>
                    <a class="btn btn-danger" onclick="return confirmValidation()" role="button"
                       href="/produtos/delete/<%= lista[i].id %>"/>DELETAR<br></a>
                    <a class="btn btn-warning" role="button" href="/produtos/<%= lista[i].id %>"/>EDITAR</a>
                </td>
            </tr>
            <% } %>

        </table>
        <a style="font-family:'Chewy'" class="btn btn-success" role="button" href="/produtos/form"/>ADICIONAR <br></a>
    </div>
    </tbody>
</div>
</body>
</html>

quando clico em editar aparece o form vazio... pode me ajudar nisso? aliás parabéns pelas aulas vc explica mt bem!

12 respostas

Opa, olhando o código, ainda não vi o possível problema. Nos values dos inputs não aparece nada mesmo? A variável results, retornada pelo método que faz a query, ta preenchida mesmo? Tem algum detalhe aí no meio que a gente não ta vendo.

Reparei nisso aqui:

ProdutosDAO.prototype

    .save_update = function(id, produtos, callback) {
    this._connection.query('UPDATE FROM produtos SET ? WHERE id=?',[id, produtos] , callback);

};

Não manjo muito, mas parece que os parâmetros da query estão trocados, não? Não deveria ser [produtos, id]?

A variável results esta vindo preenchida sim, e sobre a ordem dos parametros eu n sei dizer pq eu nem consigo pegar o id p ele atualizar, pq oara isso eu orecisa da variavel results que contem o id..mas n consigo acessar nada dela.. ja coloquei um console.log p ver se esta preenchida e esta :(.. quando dou produtos.nome da undefined e somento produtos da object.. e no metodo GET aparece certinho os dados da query no results

E não tem o from no update.. Além dos parâmetros trocados sim. No console.log, dentro da função, usa a variável results e não produtos. Ainda to olhando.. Esse código ta no github?

https://github.com/GustavoRoss/crudnode

Ta aki sim... entao devo alterar a ordem dos parametros e colocar no console.log a variavel results, dentro da funcao GET? Bom pode atebdar certo p salvar, mas oq eu mais queria tb eh os dados no form kkk

Opa, não :). Sugeri simplesmente colocar um console.log no get que recebe o id, para ver o find ta retornando certo :).

dentor da variavel results esta o objeto encontrado ao clicar em editar:

[ RowDataPacket {
    id: 32,
    nome: 'Livro de JAVA 8',
    descricao: 'Muito Eficiente!',
    preco: 121 } ]

e dps de clicar em editar, renderiza a pagina de formulário, e ao inves de substituir, ele cria um novo...

esse codigo que ta no git ta antigo, vou mandar link do atual, um momento

pronto fiz um commit la :D

https://github.com/GustavoRoss/crudnode

Alguem??

solução!

O retorno da consulta do banco traz um array, é por isso que vc não consegue acessar com results.nome. O que vc precisa fazer é passar para a view justamente o objeto da primeira posição do array, já que ele só deve ter uma posição, dado que é uma busca por id.

            resp.render('produtos/form', {
                errs: {},
                produtos: results[0]
            });

Em relação a ele sempre inserir, é pq a action do seu form aponta para a rota de adição.

<form action="/produtos" method="post" class="form-inline">

Você precisa mudar isso.. ou faz um if aí, ou cria uma outra página.

AMÉMMMMMMMMMMMMMMMMMMM OBRIGADO DEU CERTO

Quer mergulhar em tecnologia e aprendizagem?

Receba a newsletter que o nosso CEO escreve pessoalmente, com insights do mercado de trabalho, ciência e desenvolvimento de software