Contagem de elementos filhos retorna ‘Undefined’ no jQuery

Estou tentando fazer a contagem de elementos filhos de um elemento pai com jQuery no HTML que criei, mas está retornando o valor ‘Undefined’.

<div class='dataGrid'>     <div class='dataGrid-item'></div>     <div class='dataGrid-item'></div>     <div class='dataGrid-item'></div>     <div class='dataGrid-item'></div>     <div class='dataGrid-item'></div>     <div class='dataGrid-item'></div> </div> 

E o jQuery que incrementei foi.

<script>     $  (document).ready({         var qtdGrid = $  ('div.dataGrid div.dataGrid-item').lenght;         window.alert(qtdGrid);     }); </script> 

No console nenhum erro é retornado, somente no alert o ‘Undefined’.

inserir a descrição da imagem aqui

Elementos do Tema Mobile WordPress Desalinhado

Comprei um tema terrível para meu site e depois de um tempo a versão mobile além de apresentar problemas na logo header, que com muito trabalho eu consegui arrumar. Também desconfigurou todo o alinhamento das imagens, que antes eram centralizadas e no tamanho correto. O que pode ser e como posso arrumar? Desde já obrigado!

Exemplos: https://i.imgur.com/AakN8Hf.jpg https://i.imgur.com/dOjGGhf.jpg https://i.imgur.com/O72qlV1.jpg https://i.imgur.com/mAQR8rE.jpg

Não consigo realizar evento click em elementos que já sofreram eventos click

Olá. Estou com um problema com uns eventos que são não são disparados quando clico em um botão que já sofreu uma ação de um evento na página (sem refresh).

Tenho o sistema de gerenciamento de tarefas abaixo:

inserir a descrição da imagem aqui

Quando eu clico no botão dos status (Que fica na coluna STATUS), nós alteramos (Avançamos) o status daquela determinada atividade. Por exemplo, se ele está com o status “PENDENTE”, passa a ser “INICIADO”. Se está “INICIADO”, passa a ser “CONCLUIDO”. E assim vai com os 7 Tipos de Status que podemos ter.

Temos também aqueles botões da Coluna “REABRIR” e da coluna “STAND_BY”. O papel deles é o seguinte. O botão “REABRIR” retorna o status da atividade em um nível. Por exemplo: (Se estiver com o status de “CONCLUIDO” ela volta para o status de “INICIADO”. Se você estiver no STATUS de “INICIADO”, ele volta para o Status de “PENDENTE”. Sempre voltando uma passo.

E temos também o botão da coluna STAND_BY, que ao ser clicado, ele coloca o status de STAND_BY (Em espera) nas tarefas. E passa um comentário para a tarefa de “ATIVIDADE PARADA POR FALTA DE ARQUIVOS”. QUE é exibido na “OBSERVAÇÕES”.

PROBLEMA: Quando clico nos botões das atividades, eles avançam normalmente. Eles seguem a escala e passam para o status posterior. Porém se, depois de fazer isso, eu clicar no botão da coluna “REABRIR” ou da coluna “STAND BY”, os STATUS não mudam visualmente. Eles não mudam na hora. Só mudam depois que eu atualizar a página. Por exemplo, se o botão tiver com o STATUS de “CONCLUIDO” e eu clicar 2 vezes no botão “REABRIR”, ele não vai para o status de “PENDENTE” na hora. Porém, se eu atualizar a página e verificar a atividade, ela aparece lá como “PENDENTE”.

O mesmo acontece com o botão da coluna STAND BY. Se clicar no botão da coluna STAND BY duas vezes, as mensagens até duplicam.

Resumindo: Os eventos não são aplicados (Visualmente) nos elementos que sofreram eventos. Porém, ao atualizar a página, os eventos foram feitos, e os dados foram alterados no banco de dados.

Se puderem me ajudar, eu ficaria agradecido. Vou deixar o código abaixo:

$  (document).ready(function() {   //Chamando Função de Preencher Dashboard   update_dashboard();    //Aqui repitimos a cada 1 segundo      setInterval(function() {     update_dashboard();    }, 1 * 1000);     //CÓDIGO PARA PREENCHIMENTO DA LISTA COM OS DADOS DA PESQUISA     $  ('#formulario-consulta').submit(function(e) {     e.preventDefault();     $  ('#botao-click-dashboard').val("submit-vindo-do-formulario");     var formulario = $  (this);     var retorno = inserirFormulario(formulario);    });     //CÓDIGO PARA QUANDO CLICAR NO DASHBOARD "RESULTADOS-PENDENTES"    $  (document).on("click", "#resultados-pendentes", function(e) {     e.preventDefault();     $  ('#botao-click-dashboard').val("PENDENTE");     var formularioPendente = $  ("#formulario-consulta");      var retorno = inserirFormulario(formularioPendente);     });     //CÓDIGO PARA QUANDO CLICAR NO DASHBOARD "RESULTADOS-INICIADOS    $  (document).on("click", "#resultados-iniciados", function(e) {     e.preventDefault();     $  ('#botao-click-dashboard').val("INICIADO");     var formularioIniciado = $  ("#formulario-consulta");      var retorno = inserirFormulario(formularioIniciado);     });     //CÓDIGO PARA QUANDO CLICAR NO DASHBOARD "RESULTADOS-INICIADOS-VENCIDOS"    $  (document).on("click", "#resultados-iniciados-vencidos", function(e) {     e.preventDefault();     $  ('#botao-click-dashboard').val("INICIADO_VENCIDO");     var formularioIniciadoVencido = $  ("#formulario-consulta");      var retorno = inserirFormulario(formularioIniciadoVencido);     });      //CÓDIGO PARA QUANDO CLICAR NO DASHBOARD "RESULTADOS-VENCIDOS"    $  (document).on("click", "#resultados-vencidos", function(e) {     e.preventDefault();     $  ('#botao-click-dashboard').val("VENCIDO");     var formularioVencido = $  ("#formulario-consulta");      var retorno = inserirFormulario(formularioVencido);     });     //CÓDIGO PARA QUANDO CLICAR NO DASHBOARD "RESULTADOS-CONCLUIDOS"    $  (document).on("click", "#resultados-concluidos", function(e) {     e.preventDefault();     $  ('#botao-click-dashboard').val("CONCLUIDO");     var formularioConcluido = $  ("#formulario-consulta");      var retorno = inserirFormulario(formularioConcluido);     });      //CÓDIGO PARA QUANDO CLICAR NO DASHBOARD "RESULTADOS-CONCLUIDOS-VENCIDOS"    $  (document).on("click", "#resultados-concluidos-vencidos", function(e) {     e.preventDefault();     $  ('#botao-click-dashboard').val("CONCLUIDO_VENCIDO");     var formularioConcluidoVencido = $  ("#formulario-consulta");      var retorno = inserirFormulario(formularioConcluidoVencido);     });      function inserirFormulario(dados) {     $  .ajax({       //dataType: "json",       type: "POST",       data: dados.serialize(),       url: "banco/pagina-minhas-tarefas/interface-resultado-pesquisa.php",       cache: false,       }).done(function(data) {        var atividades = "";        $  .each($  .parseJSON(data), function(chave, valor) {          //FUNÇÃO PARA FORMATAR AS DATAS QUE VEM DO PHP         function dataAtualFormatada(parametro) {           if (parametro == null) {             parametro = "";             return parametro;           } else {             var data = new Date(parametro),               dia = data.getDate().toString(),               diaF = (dia.length == 1) ? '0' + dia : dia,               mes = (data.getMonth() + 1).toString(), //+1 pois no getMonth Janeiro começa com zero.               mesF = (mes.length == 1) ? '0' + mes : mes,               anoF = data.getFullYear();             return diaF + "/" + mesF + "/" + anoF;           }         }           var vencimento = dataAtualFormatada(valor.DT_VENCIMENTO);         var inicio = dataAtualFormatada(valor.DT_INICIO);         var fim = dataAtualFormatada(valor.DT_FIM);           //CRIANDO AS LINHAS COM OS TD DA TABELA QUE SÃO O RESULTADO NA CONSULTA AO BANCO           atividades += '<tr class="' + valor.codigo + '" name="' + valor.STATUS + '">';         //atividades += '<td>' + valor.codigo + '</td>';         atividades += '<td class="th-ocultar-responsivo-tbody">' + valor.COD + '</td>';         atividades += '<td>' + valor.EMPRESAS + '</td>';         atividades += '<td class="th-ocultar-responsivo-tbody">' + valor.TRIBUTACAO + '</td>';         atividades += '<td>' + valor.TIPO_ATIVIDADE + '</td>';         atividades += '<td>' + vencimento + '</td>';         atividades += '<td class="th-ocultar-responsivo-tbody">' + inicio + '</td>';         atividades += '<td class="th-ocultar-responsivo-tbody">' + fim + '</td>';           if (valor.STATUS == "INICIADO") {           atividades += '<td><button type="button" class="btn ' + valor.STATUS + ' reabriratividade  colocarstandby css-iniciado" value="' + valor.codigo + '">' + valor.STATUS + '</button></td>';         } else if (valor.STATUS == "CONCLUIDO") {           atividades += '<td><button type="button" class="btn ' + valor.STATUS + ' reabriratividade  colocarstandby css-concluido" value="' + valor.codigo + '">' + valor.STATUS + '</button></td>';         } else if (valor.STATUS == "CONCLUIDO_VENCIDO") {           atividades += '<td><button type="button" class="btn ' + valor.STATUS + ' reabriratividade  colocarstandby css-concluido-vencido" value="' + valor.codigo + '">' + valor.STATUS + '</button></td>';         } else if (valor.STATUS == "VENCIDO") {           atividades += '<td><button type="button" class="btn ' + valor.STATUS + ' reabriratividade  colocarstandby css-vencido" value="' + valor.codigo + '">' + valor.STATUS + '</button></td>';         } else if (valor.STATUS == "PENDENTE") {           atividades += '<td><button type="button" class="btn ' + valor.STATUS + ' reabriratividade  colocarstandby css-pendente" value="' + valor.codigo + '">' + valor.STATUS + '</button></td>';         } else if (valor.STATUS == "INICIADO_VENCIDO") {           atividades += '<td><button type="button" class="btn ' + valor.STATUS + ' reabriratividade colocarstandby css-iniciado-vencido" value="' + valor.codigo + '">' + valor.STATUS + '</button></td>';         }          //botão stand_by do status         else if (valor.STATUS == "STAND_BY") {           atividades += '<td><button type="button" class="btn ' + valor.STATUS + ' css-stand-by" value="' + valor.codigo + '">' + valor.STATUS + '</button></td>';         }          //botão reabrir atividade coluna         atividades += '<td class="th-ocultar-responsivo-tbody"><button type="button" class="btn css-reabrir REABRIRATIVIDADE data-toggle="tooltip" data-placement="bottom" title="Clique aqui caso tenha iniciado a atividade ou concluido indevidamente, reabrir a atividade não altera a duração de execução da atividade" " name="' + valor.STATUS + '" value="' + valor.codigo + '"><img src="_imagens/reabrir.png"></button></td>';          //botão stand by da coluna         atividades += '<td class="th-ocultar-responsivo-tbody"><button type="button" class="btn  btn-primary stand-by-coluna data-toggle="tooltip" data-placement="bottom" title="Clique aqui caso você tenha algum tipo de problema que impeça de iniciar ou concluir uma atividade, Exemplo: Não envio de documentação de um cliente"" id="' + valor.codigo + '"  value="' + valor.COD + '"><img src="_imagens/stand_by.png"></button></td>';          //botão inserir detalhes         atividades += '<td class="th-ocultar-responsivo-tbody"><button type="button" class="btn css-detalhes" <a class="" href="#" data-toggle="modal" data-target="#modal-observacoes"><img src="_imagens/historicotarefa.png"></a></button></td>';         //botão inserir detalhes         //atividades += '<td><a  class="btn btn-md btn-primary css-detalhes " href="#" data-toggle="modal" data-target="#modal-observacoes"><img src="_imagens/historicotarefa.png"></a></button></td>';           atividades += '</tr>';         });        $  ('#registros-atividades').html(atividades);       }).fail(function() {       }).always(function() {       });   }    //CÓDIGO PARA QUANDO CLICAR NA LINHA DA TABELA <TR> QUE ESTÁ DENTRO DA <TABLE>    $  (document).on("click", "#registros-atividades tr", function(e) {     e.preventDefault();      var botao = $  (this).attr('class');     $  ("input[name='codigo-modal-observacoes']").val(botao);      //Código para tirar e remover background no tr ao clicar nele     $  (this).siblings().removeClass('ativo');     $  (this).toggleClass('ativo');      var retorno = pesquisarDetalhes(botao);   });         //CÓDIGO PARA QUANDO CLICAR NOS BOTÕES, ELES ALTERAREM SUA COR, TEXTO E CONSULTA AO BANCO     //CÓDIGO PARA QUANDO CLICAR NO BOTÃO 'PENDENTE' ELE VIRAR 'INICIADO' (NO TEXTO, COR DO BOTAO E NO BANCO DE DADOS)'   $  (document).on("click", ".PENDENTE", function(e) {      $  (this).html('INICIADO');     //andrews//////////////////////////////     $  (this).css('background-color', 'rgb(236, 200, 70)');     $  (this).css('border', '1px solid gray');     $  (this).css('color', 'royalblue');     $  (this).css('font-weight', 'bold');     $  (this).css('border-radius', '5px');     //andrews//////////////////////////////     $  (this).attr('class', 'btn INICIADO');      var estate = "INICIADO";     var codigo = $  (this).val();     var antigoestado = "NAO_ERA_STAND_BY"; //ESSA VARIÁVEL FOI CRIADA SÓ PARA A FUNÇÃO DE MUDAR STANDY_BY PARA CONCLUÍDO FUNCIONAR. ELA NÃO TEM VALOR AQUI       var alterar = alterarStatus(estate, codigo, antigoestado);     });      //CÓDIGO PARA QUANDO CLICAR NO BOTÃO 'INICIADO' ELE VIRAR 'CONCLUIDO' (NO TEXTO, COR DO BOTAO E NO BANCO DE DADOS)'   $  (document).on("click", ".INICIADO", function(e) {       $  (this).html('CONCLUIDO');     //andrews//////////////////////////////     $  (this).css('background-color', 'rgb(86, 137, 73)');     $  (this).css('border', '1px solid gray');     $  (this).css('color', 'rgb(255, 255, 255)');     $  (this).css('font-weight', 'bold');     $  (this).css('border-radius', '5px');     //andrews//////////////////////////////     $  (this).attr('class', 'btn CONCLUIDO');      var estate = "CONCLUIDO";     var codigo = $  (this).val();     var antigoestado = "NAO_ERA_STAND_BY"; //ESSA VARIÁVEL FOI CRIADA SÓ PARA A FUNÇÃO DE MUDAR STANDY_BY PARA CONCLUÍDO FUNCIONAR. ELA NÃOO TEM VALOR AQUI        var criar = criarAtividade(codigo);     var alterar = alterarStatus(estate, codigo, antigoestado);    });       //CÓDIGO PARA QUANDO CLICAR NO BOTÃO 'VENCIDO' ELE VIRAR 'INICIADO/VENCIDO' (NO TEXTO, COR DO BOTAO E NO BANCO DE DADOS)'    $  (document).on("click", ".VENCIDO", function(e) {      $  (this).html('INICIADO_VENCIDO');     //andrews//////////////////////////////     $  (this).css('background-color', 'rgb(196, 95, 49)');     $  (this).css('border', '1px solid gray');     $  (this).css('color', 'white');     $  (this).css('font-weight', 'bold');     $  (this).css('border-radius', '5px');     //andrews//////////////////////////////     $  (this).attr('class', 'btn INICIADO_VENCIDO');      var estate = "INICIADO_VENCIDO";     var codigo = $  (this).val();     var antigoestado = "NAO_ERA_STAND_BY"; //ESSA VARIÁVEL FOI CRIADA SÓ PARA A FUNÇÃO DE MUDAR STANDY_BY PARA CONCLUÍDO FUNCIONAR. ELA NÃOO TEM VALOR AQUI       var alterar = alterarStatus(estate, codigo, antigoestado);     });      //CÓDIGO PARA QUANDO CLICAR NO BOTÃO 'INICIADO/VENCIDO' ELE VIRAR 'CONCLUIDO/VENCIDO' (NO TEXTO, COR DO BOTAO E NO BANCO DE DADOS)'    $  (document).on("click", ".INICIADO_VENCIDO", function(e) {      $  (this).html('CONCLUIDO_VENCIDO');     //andrews//////////////////////////////     $  (this).css('background-color', 'rgb(106, 83, 157)');     $  (this).css('border', '1px solid gray');     $  (this).css('color', 'white');     $  (this).css('font-weight', 'bold');     $  (this).css('border-radius', '5px');     //andrews//////////////////////////////     $  (this).attr('class', 'btn CONCLUIDO_VENCIDO');       var estate = "CONCLUIDO_VENCIDO";     var codigo = $  (this).val();     var antigoestado = "NAO_ERA_STAND_BY"; //ESSA VARIÁVEL FOI CRIADA SÓ PARA A FUNÇÃO DE MUDAR STANDY_BY PARA CONCLUÍDO FUNCIONAR. ELA NÃOO TEM VALOR AQUI       var criar = criarAtividade(codigo);     var alterar = alterarStatus(estate, codigo, antigoestado);     });       //CÓDIGO PARA QUANDO CLICAR NO BOTÃO 'STANDY BY DA COLUNA', ENTÃO ALTERAR O STATUS DA ATIVIDADE PARA STANDY_BY    $  (document).on("click", ".stand-by-coluna", function(e) {     e.preventDefault();      if (!$  (this).closest("tr").find(".STAND_BY").length) //Não vai executar a ação se número de classes STAND_BY na linha for maior que ZERO     {        var tipo_ativ = 'STAND_BY'; /*$  (this).attr('class')*/       //andrews//////////////////////////////       $  (this).css('background-color', '#424242');       $  (this).css('border', '1px solid gray');       $  (this).css('color', 'white');       $  (this).css('font-weight', 'bold');       $  (this).css('border-radius', '5px');       //andrews//////////////////////////////       var codigo_emp = $  (this).attr('id');       var cod_emp = $  (this).val();         $  ("tr." + codigo_emp + " button.colocarstandby").html("STAND_BY");       $  ("tr." + codigo_emp + " button.colocarstandby").css('background-color', 'black');       $  ("tr." + codigo_emp + " button.colocarstandby").attr('class', 'btn STAND_BY');         //CHAMANDO FUNÇÃO QUE UTILIZA O AJAX PARA ALTERAR O STATUS PARA STAND_BY NO BANCO DE DADOS        var alterarstandby = transformarStandBy(tipo_ativ, codigo_emp, cod_emp);        tipo_ativ = "";     }    });     //CÓDIGO PARA TRANSFORMAR O BOTÃO STAND BY EM CONCLUIDO    $  (document).on("click", ".STAND_BY", function(e) {     e.preventDefault();      $  (this).html('CONCLUIDO');     //andrews//////////////////////////////     $  (this).css('background-color', 'rgb(86, 137, 73)');     $  (this).css('border', '1px solid gray');     $  (this).css('color', 'rgb(255, 255, 255)');     $  (this).css('font-weight', 'bold');     $  (this).css('border-radius', '5px');     //andrews//////////////////////////////     $  (this).attr('class', 'btn CONCLUIDO');      var estate = "CONCLUIDO";     var codigo = $  (this).val();     var antigoestado = "STAND_BY";        var criar = criarAtividade(codigo);     var alterar = alterarStatus(estate, codigo, antigoestado);       });      //CÓDIGO PARA QUANDO CLICAR NO BOTÃO QUE ESTÁ DENTRO DO <TD> DA <TABLE>   /*   $  ('#registros-atividades tr td button').click(function(e)   {              	e.preventDefault();    	var botao = $  (this).attr('id');   				    });   */     //CÓDIGO PARA QUANDO CLICAR NO BOTÃO 'REABRIR ATIVIDADES', ENTÃO A ATIVIDADE SERÁ REABERTA    $  (document).on("click", ".REABRIRATIVIDADE", function(e) {     e.preventDefault();      var elemento = $  (this);     var sts = $  (this).attr('name');     var codigo_empr = $  (this).val();      //PASSAR BOTÃO DE CONCLUIDO PARA INICIADO				     if (sts == "CONCLUIDO") {       $  ("tr." + codigo_empr + " button.reabriratividade").html("INICIADO");       //andrews//////////////////////////////       $  ("tr." + codigo_empr + " button.reabriratividade").css('background-color', 'rgb(236, 200, 70)');       $  ("tr." + codigo_empr + " button.reabriratividade").css('border', '1px solid gray');       $  ("tr." + codigo_empr + " button.reabriratividade").css('color', 'royalblue');       $  ("tr." + codigo_empr + " button.reabriratividade").css('font-weight', 'bold');       $  ("tr." + codigo_empr + " button.reabriratividade").css('border-radius', '5px');       //andrews//////////////////////////////       $  ("tr." + codigo_empr + " button.reabriratividade").attr('class', 'btn INICIADO REABRIRATIVIDADE');        //Altera o atributo name do elemento       elemento.attr('name', 'INICIADO');        var novo_status = "INICIADO";       var reabrir = reabrirAtividade(sts, novo_status, codigo_empr);      }      //PASSAR BOTÃO DE CONCLUIDO_VENCIDO PARA INICIADO_VENCIDO	     else if (sts == "CONCLUIDO_VENCIDO") {       $  ("tr." + codigo_empr + " button.reabriratividade").html("INICIADO_VENCIDO");        //andrews//////////////////////////////       $  ("tr." + codigo_empr + " button.reabriratividade").css('background-color', 'rgb(196, 95, 49)');       $  ("tr." + codigo_empr + " button.reabriratividade").css('border', '1px solid gray');       $  ("tr." + codigo_empr + " button.reabriratividade").css('color', 'white');       $  ("tr." + codigo_empr + " button.reabriratividade").css('font-weight', 'bold');       $  ("tr." + codigo_empr + " button.reabriratividade").css('border-radius', '5px');       //andrews//////////////////////////////       $  ("tr." + codigo_empr + " button.reabriratividade").attr('class', 'btn INICIADO_VENCIDO REABRIRATIVIDADE');         //Altera o atributo name do elemento       elemento.attr('name', 'INICIADO_VENCIDO');         var novo_status = "INICIADO_VENCIDO";       var reabrir = reabrirAtividade(sts, novo_status, codigo_empr);      }      //PASSAR BOTÃO DE INICIADO PARA PENDENTE	     else if (sts == "INICIADO") {       $  ("tr." + codigo_empr + " button.reabriratividade").html("PENDENTE");       //andrews//////////////////////////////				       $  ("tr." + codigo_empr + " button.reabriratividade").css('background-color', 'RoyalBlue');       $  ("tr." + codigo_empr + " button.reabriratividade").css('border', '1px solid gray');       $  ("tr." + codigo_empr + " button.reabriratividade").css('color', 'white');       $  ("tr." + codigo_empr + " button.reabriratividade").css('font-weight', 'bold');       $  ("tr." + codigo_empr + " button.reabriratividade").css('border-radius', '5px');       //andrews//////////////////////////////					       $  ("tr#" + codigo_empr + " button.reabriratividade").attr('class', 'btn PENDENTE REABRIRATIVIDADE');        //Altera o atributo name do elemento       elemento.attr('name', 'PENDENTE');        var novo_status = "PENDENTE";       var reabrir = reabrirAtividade(sts, novo_status, codigo_empr);       }       //PASSAR BOTÃO DE INICIADO_VENCIDO PARA VENCIDO	     else if (sts == "INICIADO_VENCIDO") {       $  ("tr." + codigo_empr + " button.reabriratividade").html("VENCIDO");       //andrews//////////////////////////////					       $  ("tr." + codigo_empr + " button.reabriratividade").css('background-color', 'rgb(165, 42, 42)');       $  ("tr." + codigo_empr + " button.reabriratividade").css('border', 'px solid gray');       $  ("tr." + codigo_empr + " button.reabriratividade").css('color', 'white');       $  ("tr." + codigo_empr + " button.reabriratividade").css('font-weight: bold;', 'bold');       $  ("tr." + codigo_empr + " button.reabriratividade").css('border-radius', '5px');       //andrews//////////////////////////////							       $  ("tr." + codigo_empr + " button.reabriratividade").attr('class', 'btn VENCIDO REABRIRATIVIDADE');         //Altera o atributo name do elemento       elemento.attr('name', 'VENCIDO');        var novo_status = "VENCIDO";       var reabrir = reabrirAtividade(sts, novo_status, codigo_empr);       }     });        // ---------------------------------- FUNÇÕES -------------------------------------------------------//     //Criação da função que altera o dashboard   function update_dashboard() {     $  .ajax({       url: "banco/pagina-minhas-tarefas/prencher-dashboard.php",       type: "post",       dataType: "json"      }).done(function(retornodashboard) {       //Aqui atualizamos os H1 do Dashboard com os novos resultados:       $  ("h1#pendentes").html(retornodashboard.pendentes);       $  ("h1#iniciados").html(retornodashboard.iniciados);       $  ("h1#iniciados-vencidos").html(retornodashboard.iniciados_vencidos);       $  ("h1#vencidos").html(retornodashboard.vencidos);       $  ("h1#concluidos").html(retornodashboard.concluidos);       $  ("h1#concluidos-vencidos").html(retornodashboard.concluidos_vencidos);       }).fail(function() {       console.log("Erro ao atualizar");      }).always(function() {       });    }    // FUNÇÃO QUE FAZ O POST DE QUANDO CLICAR NO BOTÃO DE DETALHES, APARECER O DETALHE (do campo da tabela) na DIV id#espaco-detalhes  //    function pesquisarDetalhes(dados) {       $  .ajax({        type: "POST",       data: {         botao: dados       },       url: "banco/pagina-minhas-tarefas/interface-consulta-comentarios.php",       cache: false,       async: false      }).done(function(retornodobanco) {        var detalhes = "";       var feedback = "";         //Aqui abaixo, preenchemos as divs com os dados vindo da consulta ao arquivo php do AJAX        $  .each($  .parseJSON(retornodobanco), function(chave, valor) {         if (valor.DETALHES == null) {           info = "Não Possui Observações";           detalhes = "<p>" + info + "</p>";          } else {           detalhes = "<p>" + valor.DETALHES + "</p>";         }          if (valor.FEEDBACK == null) {           info2 = "Não Possui Feedback";           feedback = "<p>" + info2 + "</p>";         } else {           feedback = "<p>" + valor.FEEDBACK + "</p>";         }           });         $  ('#espaco-detalhes').html(detalhes);       $  ('#espaco-feedback').html(feedback);       }).fail(function() {       }).always(function() {       });    }     // --------- FUNÇÃO  PARA INSERIR OBSERVAÇÕES NO CAMPO DO BANCO DA RESPECTIVA ATIVIDADE SELECIONADA ------------------- //     function inserirDetalhes(parametro) {     $  .ajax({       data: parametro.serialize(),       url: "banco/pagina-minhas-tarefas/inserir-observacoes.php",       type: "POST",       cache: false,        }).done(function(data) {       alert(data);       }).fail(function() {       }).always(function() {       });    }     //FUNÇÃO PARA ALTERAR OS STATUS QUANDO CLICAR NOS BOTÕES "STATUS"    function alterarStatus(estate, codigo, antigoestado) {      $  .ajax({       url: "banco/pagina-minhas-tarefas/mudarstatus.php",       type: "POST",       data: {         estate: estate,         codigo: codigo,         antigoestado: antigoestado       },       async: false      }).done(function(data) {        }).fail(function() {       }).always(function() {       });    }      //FUNÇÃO PARA CRIAR ATIVIDADE QUANDO CLICAR NO BOTÃO STANDY BY E PASSAR PARA CONCLUÍDO    function criarAtividade(codigo) {      $  .ajax({       url: "banco/pagina-minhas-tarefas/criar-atividade.php",       type: "POST",       data: {         codigo: codigo       },       async: false      }).done(function(data) {        }).fail(function() {       }).always(function() {       });    }     //FUNÇÃO PARA A AÇÃO DE TRANSFORMAR O STATUS DA ATIVIDADE EM STAND BY    function transformarStandBy(tipo_ativ, codigo_emp, cod_emp) {      $  .ajax({       url: "banco/pagina-minhas-tarefas/tarefa-stand-by.php",       type: "POST",       data: {         tipoatividade: tipo_ativ,         codigo: codigo_emp,         cod: cod_emp       },       async: false      }).done(function(data) {        }).fail(function() {       }).always(function() {       });    }    //FUNÇÃO PARA A AÇÃO QUE OCORRE QUANDO CLICAMOS NO BOTÃO DE REABRIR A ATIVIDADE    function reabrirAtividade(sts, novo_status, codigo_empr) {      $  .ajax({       url: "banco/pagina-minhas-tarefas/reabrir-atividades.php",       type: "POST",       data: {         sts: sts,         novo_status: novo_status,         codigo_empr: codigo_empr       },       async: false      }).done(function(data) {        }).fail(function() {       }).always(function() {       });    }  });

Desde já, agradeço. Obrigado!

alinear elementos de sidenav al centro

tengo un sidenav utilizando materializecss. Necesito que los elementos que se encuentren en la sidenav estén alineados al centro y no arriba; he intentado utilizando los estilos con display:flex; align-items:center; y los alinea al centro pero todo junto y no separado con un salto de linea

$  (document).ready(function(){     $  ('.sidenav').sidenav();   });
.sidenav { display: flex;    align-items: center; }
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0/js/materialize.min.js"></script> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0/css/materialize.min.css">  <ul id="slide-out" class="sidenav">     <li>uno</li>     <li>dos</li>     <li>tres</li>     <li>cuatro</li>   </ul>   <a href="#" data-target="slide-out" class="sidenav-trigger">menu</a>

Organizar el ID de un conjunto de elementos añadidos dinámicamente al eliminar uno de ellos con Jquery / Javascript

necesito su ayuda, tengo la siguiente funcion que esta asociada a un boton que tiene onclick="addPageNew()" esta funcion crea elementos con su respectivo ID dinámicamente uno abajo del otro con Jquery, codigo:

function addPageNew(){  let idPageNew = generarID();  //aqui cuento la cantidad de elementos en el dom que tienen la clase '.page-edit' para poder crear un id consecutivo.  let contador = $  ('.page-edit').length + 1;  //template let newPageHTML = `  <div class="page-edit-full mb-4" id="$  {idPageNew}">      <div class="row mx-auto mb-2 mt-4 align-items-center page-tools-menu">          <div class="col">              <div class="page-number-label d-inline">Página $  {contador} - </div>             <p class="mb-0 d-inline page-titulo-label" contenteditable="true">Agregar título</p>          </div>          <div class="col text-right">              <a href="#!" onclick="deletePage('$  {idPageNew}');" class="btn-delete-page"><i class="far fa-trash-alt"></i></a>          </div>      </div>        <div data-page-num="$  {contador}" class="page-edit p-5" id="page$  {contador}">      </div>  </div>  `;    contentPageMain.append(newPageHTML);   } 

Y elimino esos elementos con la siguiente funcion:

function deletePage(idDeletePage){  let deletePage = $  ('#'+idDeletePage);   $  (deletePage).animate({      opacity: 0,   }, 'fast', 'linear', function() {     $  (this).remove();   });    } 

El problema es el siguiente:

Si agrego 3 elementos dinamicamente entonces pasaria esto:

elemento 1 con id: page1 y nombre pagina 1

elemento 2 con id: page2 y nombre pagina 2

elemento 3 con id: page3 y nombre pagina 3

Todo bien hasta ahi.

Pero:

Si elimino el segundo elemento con id: page2

entonces la secuencia de paginas quedaria de la siguiente manera:

elemento 1 con id: page1 y nombre pagina 1

elemento 3 con id: page3 y nombre pagina 3

Conclusion:

Como podria hacer yo para que cada que vez se elimine un elemento, la enumacion de id se vuelva a poner en un orden ascendente? 1, 2, 3, 4.

Ojala me puedan ayudar! gracias.

Como ordenar elementos de uma lista usando selection sort?

Implementei o selection sort para ordenar o texto de um .txt que transformei em lista. O problema é que ele só ordena o campo 1 e o campo 3, o campo 2 ele não ordenou, como visto no output: 10, 100, 2, 5. Onde estou errando? Obrigado desde já.

Como se trata de um trabalho de faculdade, não posso usar métodos como o sort().

import copy  def acharMenorValor(lista,a):   menor_valor = lista[0][a]   menor_index = 0   for i in range(0,len(lista)):     if lista[i][a] < menor_valor:       menor_valor = lista[i][a]       menor_index = i   return menor_index   def selectionSort(lista,a):   novaArray = []   novaLista = copy.deepcopy(lista)   for i in range(len(novaLista)):     menor = acharMenorValor(novaLista,a)     novaArray.append(tuple(novaLista.pop(menor)))   print(f"Listagem dos produtos pelo campo: {a+1}")   for i in range(len(novaArray)):       print(novaArray[i])   print("--------------------------------------")   if __name__ == "__main__":     lista = []     file = open('AD2-2.txt')      for i in range(4):         lista.append(file.readline().split())     print("Listagem de produtos lida do arquivo trabalho.txt")     for i in range(len(lista)):          print(tuple(lista[i]))      print("--------------------------------------")      #USANDO O SELECTION SORT     for i in range(len(lista)-1):         selectionSort(lista,i) 

Output:

Listagem de produtos lida do arquivo trabalho.txt ('beringela', '10', '1.99') ('arroz', '5', '4.99') ('peixe', '2', '9.99') ('abacaxi', '100', '3.99') -------------------------------------- Listagem ordenada dos produtos pelo campo: 1 ('abacaxi', '100', '3.99') ('arroz', '5', '4.99') ('beringela', '10', '1.99') ('peixe', '2', '9.99') -------------------------------------- Listagem ordenada dos produtos pelo campo: 2 ('beringela', '10', '1.99') ('abacaxi', '100', '3.99') ('peixe', '2', '9.99') ('arroz', '5', '4.99') -------------------------------------- Listagem ordenada dos produtos pelo campo: 3 ('beringela', '10', '1.99') ('abacaxi', '100', '3.99') ('arroz', '5', '4.99') ('peixe', '2', '9.99') -------------------------------------- 

Aplicar CSS usando ‘class’ dos elementos (JS)

[APENAS PARA ESTUDO]

Ao clicar em um botão, eu preciso fazer com que a função aplique um width nos elementos com a classe “border_title_result”.

function spanSize(){                 var div = document.getElementById('title_result');                 var size = 700 - div.offsetWidth;                 var f = size + "px";                 console.log(f);                  document.getElementsByClassName('border_title_result').style.width = f;             } 

O width é definido conforme o tamanho de uma div – 700px;

Eu já testei usando ‘getElementById’ para apenas um elemento, porém não sei como eu consigo aplicar esse mesmo css em vários elementos.

Os elementos são dinamicos, eles são escritos usando PHP, por isso não posso simplesmente fazer uma variavel para cada elemento id.

Isso é puramente para ESTUDO, quero apenas aprender a plicar js usando class.

Como saber si a un DIV ya no le caben más elementos dentro de él, teniendo en cuenta su altura?

Supongamos que tengo un div:

<div id="page1" class="contenedor-page" style="height: 1200px; width: 580px; overflow-y: hidden;"></div> 

Y dentro de ese div, voy añadiendo elementos, de la siguiente manera:

var templateText = `<div id="elemento-text1" class="elemento-editable">Marcador de texto</div>`;  $  ('#page1').append(templateText); 

Con el código de arriba voy añadiendo elementos dentro del DIV padre con la clase: 'contenedor-page', como utilizo la palabra reservada 'append' los elementos se van a ir agregando uno debajo del otro y así sucesivamente.

Tener en cuenta: Que el DIV padre con la clase 'contenedor-page' tiene una altura de 1200px, además de eso se le inhabilita el scroll Y, con el estilo: overflow-y: hidden.

Ahora: lo que quiero detectar, es que cuando ya no quepan más elementos dentro del DIV padre, es decir: como el DIV padre tiene 1200px altura y no tiene scroll, a medida de que yo vaya agregando elementos, pues estos se van a salir cuando alcancen la altura máxima del DIV padre, entonces quisiera saber cuando ya no quepan más elementos dentro de él, y pues hay mandar una alerta que diga que ya no caben mas elementos y que no permita agregarlos.

Solo quisiera saber como detectar cuando ya no quepan mas elementos dentro de un div padre, teniendo en cuenta su altura.

Espero me ayuden por favor, puede ser con Jquery o Javascript puro.

De antemano muchisimas gracias!