Entrar Ainda não tem acesso?
Solucionado (ver solução)
Solucionado
(ver solução)
4
respostas

Tentando criar calendario de estudos!

por Bernardo Santos
| 289.5k xp | 47 posts
Desenvolvedor Front-End

Eu estava lendo o blog aqui da Alura, quando me deparei com o seguinte texto: http://blog.alura.com.br/o-dia-a-dia-de-um-profissional-que-aprende-o-calendario-de-estudo/

E foi quando pensei "Preciso melhorar como programador, e ganhar experiencia, então ao invés de comprar uma agenda, vou criar uma" E comecei a trabalhar nela, a ideia é bem simples, ter uma textarea para cada dia da semana, e após preencher cada uma, criar um <td> contendo o que foi digitado em cada textarea.

E quando estiver pronto, estou pensando até em adicionar linhas para que o usuário possa fazer um "chek" para acompanhar as datas que conseguiu estudar consecutivamente, e ver se ele quebrou essa ""corrente de estudo"".

Acontece que não estou conseguindo gerar as novas linhas, e como já tentei de um tudo e nada me vem a mente, segue o código.

var campo = $(".btn"); // btn foi a classe usada no botão que deveria atualizar//
campo.on("click", function() {
    alert("Teste19"); // esse alert é para que eu possa ter certeza que a pag atualizou normalmente, em um dos primeiros testes tive problemas e não atualizou de fato a pag, e o numero como eu garanto que de fato ocorreu essa atualização//
    console.log(inserir());
});

function inserir () {
    var coproTabela = $(".listaCurso").find(tbody);
    var seg = $(".seg");
    var ter = $(".ter");
    var quar = $(".quar");
    var quin = $("quin");
    var sex = $(".sex");
    var sab = $(".sab");
    var dom = $(".dom");

    var linha = novaLinha(s1, t, q1, q2, s2, s3, d);

    coproTabela.append(linha)
};

function novaLinha(s1, t, q1, q2, s2, s3, d){
    var linha = $("<tr>");
    var colunaS1 = $("<td>").text(s1);
    var colunaT = $("<td>").text(t);
    var colunaQ1 = $("<td>").text(q1);
    var colunaQ2 = $("<td>").text(q2);
    var colunaS2 = $("<td>").text(s2);
    var colunaS3 = $("<td>").text(s3);
    var colunaD = $("<td>").text(d);

    linha.append(colunaS1);
    linha.append(colunaT);
    linha.append(colunaQ1);
    linha.append(colunaQ2);
    linha.append(colunaS2);
    linha.append(colunaS3);
    linha.append(colunaD);

    return linha;
};
4 respostas
por Sérgio Lopes
| 604.1k xp | 913 posts
Instrutor CTO na Alura

Nessa parte aqui:

    var seg = $(".seg");
    var ter = $(".ter");
    var quar = $(".quar");
    var quin = $("quin");
    var sex = $(".sex");
    var sab = $(".sab");
    var dom = $(".dom");

    var linha = novaLinha(s1, t, q1, q2, s2, s3, d);

Vc esta selecionando os elementos de cada dia da semana e colocando nas variaveis. Ai chama o novaLinha passando variaveis que nao existem (repara que o nome ta diferente das variaveis declaradas).

Mesmo assim, na novaLinha: 

function novaLinha(s1, t, q1, q2, s2, s3, d){
    var linha = $("<tr>");
    var colunaS1 = $("<td>").text(s1);
    var colunaT = $("<td>").text(t);
    var colunaQ1 = $("<td>").text(q1);
    var colunaQ2 = $("<td>").text(q2);
    var colunaS2 = $("<td>").text(s2);
    var colunaS3 = $("<td>").text(s3);
    var colunaD = $("<td>").text(d);

Nao entendi direito o que seriam esses parametros s1,t,q1 etc. É pra ser o nome do dia da semana? Um texto, certo? Porque vc passa ele pra funcao .text() que recebe um texto.

Entao precisa ver no inserir(), onde vc chama esse novaLinha pra passar o texto, nao o elemento inteiro que foi selecionado.

por Bernardo Santos
| 289.5k xp | 47 posts
Desenvolvedor Front-End

A ideia era pegar o que fosse digitado no textarea de cada dia da semana, passar para as variaveis de cada dia, E então gerar a nova linha.

solução!
por Daniel Omnion
| 1014.4k xp | 1150 posts

Se os elementos com as classes ".seg", ".ter" ... são os textareas que você está utilizando, o seu código precisaria das seguintes alterações:


var campo = $(".btn"); // btn foi a classe usada no botão que deveria atualizar//
campo.on("click", function() {
    alert("Teste19"); // esse alert é para que eu possa ter certeza que a pag atualizou normalmente, em um dos primeiros testes tive problemas e não atualizou de fato a pag, e o numero como eu garanto que de fato ocorreu essa atualização//
    console.log(inserir());
});


function inserir () {
    var corpoTabela = $(".listaCurso").find("tbody");
    var seg = $(".seg").val();
    var ter = $(".ter").val();
    var quar = $(".quar").val();
    var quin = $("quin").val();
    var sex = $(".sex").val();
    var sab = $(".sab").val();
    var dom = $(".dom").val();

    var linha = novaLinha(seg, ter, quar, quin, sex, sab, dom);

    corpoTabela.append(linha)
};

function novaLinha(s1, t, q1, q2, s2, s3, d){
    var linha = $("<tr>");
    $("<td>").text(s1).appendTo(linha);
    $("<td>").text(t).appendTo(linha);
    $("<td>").text(q1).appendTo(linha);
    $("<td>").text(q2).appendTo(linha);
    $("<td>").text(s2).appendTo(linha);
    $("<td>").text(s3).appendTo(linha);
    $("<td>").text(d).appendTo(linha);
    return linha;
};
por Bernardo Santos
| 289.5k xp | 47 posts
Desenvolvedor Front-End

Muito obrigado, eu tinha conseguido resolver a parte de pegar os valores, mas não estava achando uma forma de fazer essa inclusão na tabela, e por isso estava limitado a fazer impressões no console.