TransWikia.com

Problema ao validar input

Stack Overflow em Português Asked by André Cabral on September 26, 2021

Estou com um código onde o usuário insere o ID do aluno e assim ele é redirecionado para uma pagina com somente as presenças do aluno, mas se o usuário não inserir nenhum dado no input ele exibe todas as presenças, oque eu posso estar fazendo para consertar? obs: ja tentei diversos modos mas nenhum deu certo, creio que a logica esteja um pouco torta, mas sou novato e to tentando ir aos poucos e ver oque consigo, queria saber oque fazer para isso funcionar corretamente

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="card">
    <div class="card-body">
            
            <h3>Coloque a matricula de seu filho </h3>
            <input type="text" name="nome" class="form-control" id="campoInput" placeholder="Digite o número da matricula"> 
            <button type="submit"  id="btnInput" class="btn btn-success mt-2" >Pesquisar</button>

    </div>
</div>


<script>

    $("#btnInput").on("click",function(e){
    var urlFixa = "localhost:8081/exibir/";
    var valorInput = $("#campoInput").val();
    var urlFinal = urlFixa + valorInput + "";
    $("#campoInput").attr("src",urlFinal);
    $("#srcImg").html(urlFinal);
    
    window.location.href = 'exibir/'+valorInput;
})

</script>


Edit 1:

Código do filtro que feito com node.js e sequelize:

  app.get('/exibir/:id', function (req, res) {
    Aluno.findAll({ order: [['idAluno', 'DESC']]}).then(function (alunos) {
        const alunosdb = alunos
        Post.findAll({
          where:{ conteudo: {[Op.substring]: req.params.id }},
          order: [['id', 'DESC']]}).then(function (posts) {
            res.render('frequencia', { posts: posts, alunos: alunosdb })
        })
    })
})

One Answer

Então amigo, você quer ser redirecionado a uma pagina com as presenças dos usuarios, primeiro: onde você vai guardar as informações da presença de cada aluno?

Você precisa de um backend para processar a informação desse input e te retornar a correspondente pagina, existem N formas de fazer isso, eu recomendo você usar o PHP pois é vastamente usada pela internet e relativamente fácil de ser entendida.

Existem diversas soluçoes, você pode criar uma pagina php onde a informação seriam mandada por uma request AJAX, processada e retornada via a mesma request, isso se você quiser fazer todo o processo sem sair da mesma pagina.

Você pode criar a mesma pagina mas passar os dados pelo GET/POST ja embutido no html/php.

Nesse exemplo criei um arquivo chamado exibir.php e nele botei:

if (!empty($_GET["nome"])) { //Checa se a variavel GET tem o index nome
    echo "Você esta na pagina do aluno ".strval($_GET["nome"]);
}

No JS, pra manter o que você fez eu só mudei algumas coisas:

    $("#btnInput").on("click",function(e){
        var urlFixa = "localhost:8081/exibir/";
        var valorInput = $("#campoInput").val();
        var urlFinal = urlFixa + valorInput + "";
        $("#campoInput").attr("src",urlFinal);
        $("#srcImg").html(urlFinal);
        
        window.location.href = 'exibir.php?nome='+valorInput;
    })

Para entender o que esta acontencendo você deve aprender sobre as diferenças entre metodo GET e POST Diferença entre POST e GET, mas abreviando, no metodo GET(que eu utilizei) as informações são passadas pela URL, tudo depois do "?" na url são informações passadas para o site pelo GET. No seu código:

$("#btnInput").on("click",function(e){
    var urlFixa = "localhost:8081/exibir/";
    var valorInput = $("#campoInput").val();
    var urlFinal = urlFixa + valorInput + "";
    $("#campoInput").attr("src",urlFinal);
    $("#srcImg").html(urlFinal);
    
    window.location.href = 'exibir/'+valorInput;
})

Você esta tentando acessar um arquivo da pasta exibir que possui o mesmo valor do input. Exemplo:".../exibir/Joao" provavelmente o diretório "exibir" não possui um arquivo chamado "Joao".

Caso a intenção é guardar informação dos alunos em pastas, essa ideia seria perda de tempo pois você iria criar uma pagina para cada aluno de forma manual.

Tentei explicar da melhor forma o possivel, espero que tenha ajudado, se tiver duvidas sobre qualquer coisa estarei aqui.

Answered by Ricardo Cenci Fabris on September 26, 2021

Add your own answers!

Ask a Question

Get help from others!

© 2024 TransWikia.com. All rights reserved. Sites we Love: PCI Database, UKBizDB, Menu Kuliner, Sharing RPP