Entrar Ainda não tem acesso?
1
resposta

Após inclusão do onclick="onDelete('{{.Id}}')" pagina buga

Referente ao curso Go: crie uma aplicação web

por IGOR ESTEVAN JASINSKI
| 40.8k xp | 5 posts
Engenheiro de observabilidade

Pessoal, poderiam me ajuda, após eu incluir o onclick="onDelete('{{.Id}}')" para deletar a pagina buga e fica conforme e o print abaixo: Insira aqui a descrição dessa imagem para ajudar na acessibilidade

Se eu remove, monstra corretamente, mas ai logicamente que não funciona a função segue o meu html.

{{define "Index"}}

{{template "_head"}}
{{template "_menu"}}

<body>
    <div class="container">
        <section class="card">
            <div>
                <table class="table table-striped table-hover mb-0">
                    <thead>
                        <tr>
                            <th>Nome</th>
                            <th>Descrição</th>
                            <th>Preço</th>
                            <th>Quantidade</th>
                        </tr>
                    </thead>
                    <tbody>
                        {{range .}}
                        <tr>
                            <td>{{.Nome}}</td>
                            <td>{{.Descricao}}</td>
                            <td>{{.Preco}}</td>
                            <td>{{.Quantidade}}</td>
                            <td><button onclick="onDelete('{{.Id}}')" class="btn btn-info">Deletar</button></td>
                        </tr>
                        {{end}}
                    </tbody>onclick="onDelete('{{.Id}}')"
                </table>
            </div>
        </section>
        <div class="card-footer">
            <a href="/new" class="btn btn-primary mb-2">Criar novo produto</a>
        </div>
    </div>
</body>

<script>
    function onDelete(id){
        let resposta = confirm("Tem certeza que deseja deletar esse produto?")
        if (resposta){
            window.location = "/delete?id=" + id
        }
    }
</script>

</html>
{{end}}
1 resposta
por Matheus Brandino
| 4803.7k xp | 10196 posts
Alura Scuba Team Mobile Software Engineer

Olá, Igor!

Vamos tentar resolver essa situação juntos. Analisando o seu código, acredito que o problema possa estar relacionado com a forma como você está inserindo o id no onclick.

Neste trecho de código:

<td><button onclick="onDelete('{{.Id}}')" class="btn btn-info">Deletar</button></td>

Você está tentando passar o id do item para a função onDelete através do onclick. No entanto, parece que a página está quebrando quando você tenta fazer isso. Isso pode estar acontecendo porque o {{.Id}} não está sendo interpretado corretamente.

Uma alternativa seria tentar passar o id de outra forma. Um exemplo seria adicionar um atributo de data ao botão com o id do item e depois acessar esse atributo na função onDelete.

Veja como ficaria:

<td><button data-id="{{.Id}}" onclick="onDelete(this)" class="btn btn-info">Deletar</button></td>

E a função onDelete ficaria assim:

function onDelete(element){
    let id = element.getAttribute('data-id');
    let resposta = confirm("Tem certeza que deseja deletar esse produto?")
    if (resposta){
        window.location = "/delete?id=" + id
    }
}

Neste exemplo, o this passado para a função onDelete é o próprio elemento que disparou o evento (no caso, o botão). Então, dentro da função, você pode usar o método getAttribute para pegar o valor do atributo data-id, que é o id do item.

Espero que essa sugestão possa te ajudar a resolver o problema! Lembre-se de sempre testar as alterações em um ambiente seguro antes de aplicá-las em produção. Espero ter ajudado e bons estudos!