Search the Community

Bom noite a todos, tenho um formulário onde os campos estão dividido por <div>, também tenho um select com várias opções de estado civil. até aqui tudo bem, conforme seleciono "Solteiro" por exemplo todos os campos ficam com o style "none", se seleciono Casado, oculta alguns campos e exibe outros, e assim por diante. só que quando coloco mais de 11 para ficar com o style none já não funciona. Assim funciona: //Recebe o estado civil do falecido const adms_est_civil = document.getElementById('adms_ec_conjuge_id') const divEstCivil = document.getElementById('genero_conjuge') const divDadosCasamento = document.getElementById('casamento') const divDadosDivorcio = document.getElementById('divorcio') const divDadosViuvez = document.getElementById('viuvez') const divNomeConjuge = document.getElementById('nome_conjuge') const divMoradaConjuge = document.getElementById('morada_conjuge') const divLocalidadeConjuge = document.getElementById('localidade_conjuge') const divAutarquiasConjuge = document.getElementById('autarquiasconjuge') const labelAutarquias = document.getElementById('autarquiasconjugelabel') const labelAutarquiasNascConjuge = document.getElementById('autarquias_nascconjuge') adms_est_civil.addEventListener('change', function (e) { switch (e.target.value) { // O PRIMEIRO CASE FUNCIONA // case '1': divEstCivil.style.display = 'none' divDadosCasamento.style.display = 'none' divDadosDivorcio.style.display = 'none' divDadosViuvez.style.display = 'none' divNomeConjuge.style.display = 'none' divMoradaConjuge.style.display = 'none' divLocalidadeConjuge.style.display = 'none' divAutarquiasConjuge.style.display = 'none' labelAutarquias.style.display = 'none' divAutarquiasNascConjuge.style.display = 'none' break // O SEGUNDO POR TER 11 JÁ NÃO // case '2': divEstCivil.style.display = 'none' divDadosCasamento.style.display = 'none' divDadosDivorcio.style.display = 'none' divDadosViuvez.style.display = 'none' divNomeConjuge.style.display = 'none' divMoradaConjuge.style.display = 'none' divLocalidadeConjuge.style.display = 'none' divAutarquiasConjuge.style.display = 'none' labelAutarquias.style.display = 'none' divAutarquiasNascConjuge.style.display = 'none' labelAutarquiasNascConjuge.style.display = 'none' break } Já removi uma linha do meio do segundo e assim já funciona, como resolvo, existe um limite?

Boa tarde, Tenho o códigos abaixo que esta a funcionar. Ele é da seguinte forma, se selecionar Portugal, aparece três campos select para selecionar o distrito, concelho e freguesia, caso escolha outra País esses campos ficam ocultos. <!-- Campo select Pais --> <div class="column"> <label for="adms_pais_id" class="title-input">País:<span class="text-danger">*</span> </label> <select class="input-adm" name="adms_pais_id" id="adms_pais_id"> <option value="">Selecione</option> <?php foreach ($this->data['pais']['pais'] as $pais) { extract($pais); if ((isset($valorForm['adms_pais_id'])) and ($valorForm['adms_pais_id'] == $id)) { echo "<option value='$id' selected>$name_pais</option>"; } else { echo "<option value='$id'>$name_pais</option>"; } } ?> </select> </div> <!-- Campos Selects de Distrito, Concelho e Freguesia --> <label for="localidade" class="title-input">Autarquivas ou Localidade do Nascimento:</label> <div class="row-input" id="divLocalidade"> <div class="column"> <?php $localidade_nascimento = ''; if (isset($valorForm['localidade_nascimento'])) { $localidade_nascimento = $valorForm['localidade_nascimento']; } ?> <label for="localidade_nascimento" class="title-input">Localidade do Nascimento:<span class="text-danger">*</span></label> <input type="text" name="localidade_nascimento" id="localidade_nascimento" class="input-adm" placeholder="Digite a localidade do nascimento" autocomplete="off" value="<?php echo $localidade_nascimento; ?>"> </div> </div> <div class="row-input" id="divAutarquias"> <div class="column"> <label for="adms_dist_nasc_id" class="title-input">Distrito:</label> <select class="input-adm" name="adms_dist_nasc_id" id="adms_distrito_id2" onchange="selectConcelho(2)"> <option value="">Selecione</option> <?php foreach ($this->data['distritonasc']['distnasc'] as $distnasc) { extract($distnasc); if ((isset($valorForm['adms_dist_nasc_id'])) and ($valorForm['adms_dist_nasc_id'] == $id_distnasc)) { echo "<option value='$id_distnasc' selected>$name_distrito</option>"; } else { echo "<option value='$id_distnasc'>$name_distrito</option>"; } } ?> </select> </div> <div class="column"> <label for="adms_conc_nasc_id" class="title-input">Concelho:</label> <select class="input-adm" name="adms_conc_nasc_id" id="adms_concelho_id2" onchange="selectFreguesia(2)"> <option value="">Selecione</option> <?php foreach ($this->data['concelhonasc']['concnasc'] as $concnasc) { extract($concnasc); if ((isset($valorForm['adms_conc_nasc_id'])) and ($valorForm['adms_conc_nasc_id'] == $id_concnasc)) { echo "<option value='$id_concnasc' selected>$name_concelho</option>"; } else { echo "<option value='$id_concnasc'>$name_concelho</option>"; } } ?> </select> </div> <div class="column"> <label for="adms_freg_nasc_id" class="title-input">Freguesia:</label> <select class="input-adm" name="adms_freg_nasc_id" id="adms_freguesia_id2"> <option value="">Selecione</option> <?php foreach ($this->data['freguesianasc']['fregnasc'] as $fregnasc) { extract($fregnasc); if ((isset($valorForm['adms_freg_nasc_id'])) and ($valorForm['adms_freg_nasc_id'] == $id_fregnasc)) { echo "<option value='$id_fregnasc' selected>$name_freguesia</option>"; } else { echo "<option value='$id_fregnasc'>$name_freguesia</option>"; } } ?> </select> </div> </div> //Ativa/oculta campos do Formulário de Processo de Funerais // Receber o pais da nacionlidade do falecido para exibir ou ocultar a autrarquias const adms_pais_nasc_falecido = document.getElementById('adms_pais_id') const divLocalidade = document.getElementById('divLocalidade') const divAutarquias = document.getElementById('divAutarquias') adms_pais_nasc_falecido.addEventListener('change', function (event) { if (event.target.value == '1') { divLocalidade.style.display = 'grid' divAutarquias.style.display = 'grid' } else { divLocalidade.style.display = 'grid' divAutarquias.style.display = 'none' } }) O meu problema é o seguinte: Fiz o mesmo para outros campos mas não funciona e não consigo achar o erro, se alguém conseguir ajudar fico muito grato. <div class="row-input"> <div class="column"> <label for="adms_estado_civil_id" class="title-input">Estado Civil:</label> <select class="input-adm" name="adms_estado_civil_id" id="adms_estado_civil_id"> <option value="">Selecione</option> <?php foreach ($this->data['estadocivil']['estado'] as $estado) {extract($estado); if ((isset($valorForm['adms_estado_civil_id'])) and ($valorForm['adms_estado_civil_id'] == $id)) { echo "<option value='$id' selected>$name_estado</option>"; } else { echo "<option value='$id'>$name_estado</option>"; } } ?> </select> </div> <div class="column" id="genero_conjuge"> <label for="adms_gen_conjuge_id" class="title-input">Gênero:<span class="text-danger">*</span> </label> <select class="input-adm" name="adms_gen_conjuge_id" id="adms_gen_conjuge_id"> <option value="">Selecione</option> <?php foreach ($this->data['genero']['gen'] as $genero) { extract($genero); if ((isset($valorForm['adms_gen_conjuge_id'])) and ($valorForm['adms_gen_conjuge_id'] == $id)) { echo "<option value='$id' selected>$name_genero</option>"; } else { echo "<option value='$id'>$name_genero</option>"; } }?> </select> </div> </div> //Recebe o estado civil do conjuge const adms_est_civil = document.getElementById('adms_estado_civil_id') const divEstCivil = document.getElementById('genero_conjuge') adms_est_civil.addEventListener('change', function (e) { if (e.target.value == '2') { divEstCivil.style.visibility = 'hidden' } else { divEstCivil.style.visibility = 'visible' } }) lembrando que já coloquei "divEstCivil.style.visibility = 'hidden'" e "divEstCivil.style.display = 'none'"

Olá, tudo bem? Esse é meu primeiro post aqui, então não sei como postar o código. Vou tentar explicar. Eu tenho vários input files em uma página de projeto de upload de imagens. O objetivo é redimensionar a imagem para 800 por 600 antes do upload. Isso já está ok. Agora preciso atualizar o src do input file clicado (target.src) com essas dimensões para enviar para o recebe.php. Agradeço desde já <form action="./recebe.php" method="post" id="form" enctype="multipart/form-data"> <input type="file" accept="image/*" id="image1" name="img1[]"> <br><br> <input type="file" accept="image/*" id="image2" name="img1[]"> <br><br> <input type="file" accept="image/*" id="image3" name="img2[]"> <br><br> <input type="file" accept="image/*" id="image4" name="img2[]"> <br><br> <button> Enviar </button> </form> <script type="text/javascript"> let form = document.querySelector("#form"); form .addEventListener("change", (e)=>{ e.preventDefault(); var file = e.target.files[0];//input clicado const reader = new FileReader(); reader.readAsDataURL(file); reader.name = file.name; reader.size = file.size; reader.onload = function (event) { var img = new Image(); img.src = event.target.result; img.onload = function (el) { var elem = document.createElement('canvas'); elem.width = 800; elem.height = 600; var ctx = elem.getContext('2d'); ctx.drawImage(el.target, 0, 0, elem.width, elem.height); var srcEncoded = ctx.canvas.toDataURL('image/jpeg', 0.5); console.log(srcEncoded);//Aqui está okay e.target.src = srcEncoded; //Estou aqui. Mas não deu certo, o recebe.php faz upload da imagem original. //Preciso atualizar o próprio input file clicado para enviar essa imagem com essas dimensões 800x600 //Com o mesmo input file que é clicado //Issoctx.canvas.toDataURL('image/jpeg', 0.5); retorna obase64, não sei se é isso mesmo. } } }); </script> ==============Arquivo recebe.php <?php //Aqui como eu faço para ele fazer o upload // O $_FILES['img1']['tmp_name'][0] , por exemplo, recebera o data:image/jpeg;base64,.... //Como converto ele para imagem jpeg move_uploaded_file($_FILES['img1']['tmp_name'][0], $_FILES['img1']['name'][0]); move_uploaded_file($_FILES['img1']['tmp_name'][1], $_FILES['img1']['name'][1]); move_uploaded_file($_FILES['img2']['tmp_name'][0], $_FILES['img2']['name'][0]); move_uploaded_file($_FILES['img2']['tmp_name'][1], $_FILES['img2']['name'][0]); ?>

Boa noite pessoal, tenho o código abaixo em javascript a funcionar perfeitamente, mas para não ter que duplicando o código toda vez que eu criar um select novo como faço para resumir os três em um só ou criar um genérico que de para todos os select? async function selecionarConcelhos() { // Receber a marca selecionada pelo usuario var adms_distrito = document.getElementById('adms_distrito_id').value // Chamar o endereço externo com JavaScript, mas pode ser jQuery, etc. var dados = await fetch(urlAdm + 'add-tecnico/index?distrito=' + adms_distrito) // Ler os dados retornado do PHP var resposta = await dados.json() if (resposta['status']) { var opcoesCampoSelect = "<option value=''>Selecione</option>" // Ler o um Array await resposta['data'].forEach(function (item) { // Usar template strings para colocar variável internamente opcoesCampoSelect += `<option value='${item['id']}'>${item['name_concelho']}</option>` }) // Enviar as opções do campo listar_usuarios para o HTML document.getElementById('adms_concelho_id').innerHTML = opcoesCampoSelect document.getElementById('adms_freguesia_id').innerHTML = `<option value=''>Selecione</option>` } else { document.getElementById( 'adms_concelho_id' ).innerHTML = `<option value=''>${resposta['msg']}</option>` document.getElementById('adms_freguesia_id').innerHTML = `<option value=''>Selecione</option>` } } async function selectConcelhosConjuge() { // Receber a marca selecionada pelo usuario var adms_distrito = document.getElementById('adms_distr_conj_id').value // Chamar o endereço externo com JavaScript, mas pode ser jQuery, etc. var dados = await fetch(urlAdm + 'add-tecnico/index?distrito=' + adms_distrito) // Ler os dados retornado do PHP var resposta = await dados.json() if (resposta['status']) { var opcoesCampoSelect = "<option value=''>Selecione</option>" // Ler o um Array await resposta['data'].forEach(function (item) { // Usar template strings para colocar variável internamente opcoesCampoSelect += `<option value='${item['id']}'>${item['name_concelho']}</option>` }) // Enviar as opções do campo listar_usuarios para o HTML document.getElementById('adms_conc_conj_id').innerHTML = opcoesCampoSelect document.getElementById('adms_freg_conj_id').innerHTML = `<option value=''>Selecione</option>` } else { document.getElementById( 'adms_conc_conj_id' ).innerHTML = `<option value=''>${resposta['msg']}</option>` document.getElementById('adms_freg_conj_id').innerHTML = `<option value=''>Selecione</option>` } } async function selectConcelhos() { // Receber a marca selecionada pelo usuario var adms_distrito_nasc = document.getElementById('adms_dist_nasc_id').value // Chamar o endereço externo com JavaScript, mas pode ser jQuery, etc. var dados = await fetch(urlAdm + 'add-tecnico/index?distrito=' + adms_distrito_nasc) // Ler os dados retornado do PHP var resposta = await dados.json() if (resposta['status']) { var opcoesCamposSelect = "<option value=''>Selecione</option>" // Ler o um Array await resposta['data'].forEach(function (item) { // Usar template strings para colocar variável internamente opcoesCamposSelect += `<option value='${item['id']}'>${item['name_concelho']}</option>` }) // Enviar as opções do campo listar_usuarios para o HTML document.getElementById('adms_conc_nasc_id').innerHTML = opcoesCamposSelect document.getElementById('adms_freg_nasc_id').innerHTML = `<option value=''>Selecione</option>` } else { document.getElementById( 'adms_conc_nasc_id' ).innerHTML = `<option value=''>${resposta['msg']}</option>` document.getElementById('adms_freg_nasc_id').innerHTML = `<option value=''>Selecione</option>` } }

Olá a todos, Estou a tentar melhorar uma página desenvolvida em Laravel e o que quero fazer é o seguinte: Tenho um select option "Cliente" que mostra os clientes da base de dados, mas depois quero que mostre os campos preenchidos do email e telefone preenchidos quando seleciono um. <select class="form-select" id="empresa" onchange="myFunction(event)" aria-label="Default select example"> <option disabled selected>Selecionar Cliente</option> @foreach($itens2 as $iten2) <option class="form-control" value="{{$iten2->id}}"> {{$iten2->nome}}</option> @endforeach </select> <div class="form-group"> <label>Nome</label> <input type="text" class="form-control" id="nome" name="nome" placeholder="Nome" aria-label="Username" aria-describedby="basic-addon1" > </div> <!-- /.form-group --> <div class="form-group"> <label>Email</label> <input type="text" class="form-control" name="email" id="email" placeholder="Email" aria-label="Username" aria-describedby="basic-addon1"> </div> tentei fazer da seguinte forma : function myFunction(e) { document.getElementById("nome").value = e.target.value } </script> Mas só consigo ir buscar o ID e não o nome. Está função não serve para o que pretendo ?

adaptei o projeto abaixo em meu projeto: https://youtu.be/m49I783h_9s?si=xmEknj6biQexrGJh só que devolve seguinte erro, penso que o erro esteja no javascript: Uncaught (in promise) SyntaxError: Unexpected token '<', " <!DOCTYPE "... is not valid JSON await (assíncrono) onkeyup @ index:215 meu java esta assim: async function searchProdutos(registo){ // Receber a URL do HTML const urlAdm = document.getElementById('url-adm').getAttribute('data-url-adm'); //recebe o valor que o usuário digitar const codigoBarras = document.querySelector('#codigo_barras'+registo); //Recebe o value da const codigoBarras const valueCodigoBarras = codigoBarras.value; // Verificar se o campo tem 7 digitos if (valueCodigoBarras.length == 7) { //faz a requisição ao file add-receber-encomenda.php const response = await fetch(urlAdm + 'add-receber-encomenda/index?searchCodigo=' + valueCodigoBarras); //Ler os dados retornado do PHP const data = await response.json(); if(data['erro']) { document.getElementById('adms_produto_id').innerHTML = data['msg']; }else{ document.getElementById("adms_produto_id").innerHTML = ""; document.getElementById("adms_produto_id").value = data['response'].produto; } } } na controler tenho: //Receber o codigo de barras do produto $searchCodigo = filter_input(INPUT_GET, "searchCodigo", FILTER_SANITIZE_NUMBER_INT); if (!empty($searchCodigo)) { $listProduct = new \App\adms\Models\stock\AdmsAddReceberEnc(); $listProduct->searchProduto($searchCodigo); $retorna = ['erro' => false, 'dados' => $listProduct]; } else { $retorna = ['erro' => true, 'msg' => "<div class='alert alert-danger'>Nenhum Produto encontrado!</div>"]; } na model tenho: public function searchProduto($codigoBarras = null) { $this->data['codigo_barras'] = $codigoBarras; $listProduto = new \App\adms\helpers\AdmsRead(); $listProduto->fullRead("SELECT id, produto, codigo_barras, venda, stock FROM adms_produtos WHERE codigo_barras =:codigo_barras LIMIT :limit", "codigo_barras={$this->data['codigo_barras']}&limit=1"); $this->resultBd = $listProduto->getResult(); if ($this->resultBd) { $retorna = ['erro' => false, 'dados' => $this->resultBd]; } else { $retorna = ['erro' => true, 'msg' => "<p style='color: #f00'>Erro: Nenhum Produto encontrado!</p>"]; } }

Boa tarde a todos, tenho em meu formulário o seguinte input <input type="text" name="codigo_barras[]" id="codigo_barras" onkeyup="searchProdutos(1)" class="input-adm sizefour" autocomplete="on" required> no meu javascript tenho o seguinte: function searchProdutos(registo){ //recebe o valor que o usuário digitar const codigoBarras = document.querySelector('#codigo_barras'+registo); const valueCodigoBarras = codigoBarras.value; } Conforme começo a digitar no campo ocorre o seguinte erro: custom_adms.js:1014 Uncaught TypeError: Cannot read properties of null (reading 'value') at searchProdutos (custom_adms.js:1014:42) at HTMLInputElement.onkeyup (index:215:163) Já alterei o name e id de "código_barras" para "codigoBarras" ou "codigobarras" e continua o mesmo.

Boa noite a todos, tenho um formulário como se fosse um carrinho de compras. no form tenho a tabela da seguinte forma: <input type="button" name="addProduto" id="addProduto" class="input-adm btn-warning" value="Incluir"> <table class="table-list"> <thead class="list-head"> <tr> <th class="list-head-content sizeone table-md-none">Código Barras</th> <th class="list-head-content sizefive table-md-none">ID</th> <th class="list-head-content sizetwo">Nome do produto</th> <th class="list-head-content sizethree">Quantidade</th> <th class="list-head-content sizefour">Ações</th> </tr> </thead> <tbody class="list-body"> </tbody> </table> Em javascript adiciono os produtos a tabela, o adicionar está funcionando, mas o remover não funciona, o que errei? //Adicionar Produtos ao carrinho document.getElementById('addProduto').addEventListener('click', incluirProduto) //Remover Produtos ao carrinho document.getElementById('.remove').addEventListener('click', removerProduto) function incluirProduto(){ const selectProduct = document.getElementById('adms_produto_id') const optionText = selectProduct.options[selectProduct.selectedIndex].text const id = selectProduct.options[selectProduct.selectedIndex].value const barcode = selectProduct.options[selectProduct.selectedIndex].getAttribute('data-barcode') const qtde = document.getElementById('qtde').value const html = `<tr><td class="list-body-content table-md-none sizeone"><input type="text" name="codigo_barras[]" id="codigo_barras" class="input-adm" placeholder="Código Barras" autocomplete="on" required value="${barcode}"></td><td class="list-body-content table-md-none sizefive" name="id[]">${id}</td><td class="list-body-content sizetwo">${optionText}</td><td class="list-body-content sizethree"><input type="number" name="qtde[]" id="qtde" class="input-adm" placeholder="Qtde" autocomplete="off" required value="${qtde}"></td><td><input type="button" class="input-adm btn-danger" name="remove" id="remove" value="Remover"></td></tr>`; const x = 1; document.querySelector('tbody.list-body').innerHTML += html } function removerProduto(){ document.querySelector('tbody.list-body').closest('tr').remove(); }

Bom dia a todos, Estou recebendo os dados através do json e enviando para a model da seguinte forma: //Recebo os dados $receiveData = file_get_contents('php://input'); $data = json_decode($receiveData, true); //Adiciono a posição do usuário atraves da sessão $data['adms_user_id'] = $_SESSION['user_id']; //Envia os dados para a model $createEncomenda = new \App\adms\Models\encomenda\AdmsAdd(); $createEncomenda->create($data); Na controle recebo da seguinte forma: public function create(array $data = null) { // Recebo os dados que vieram da controler $this->data = $data; Só que ao dar o var_dump em $this->data ou em $data me devolve o array da seguinte forma: $data: Array ( [0] => Array ( [name_encomenda] => Pedido de Material [adms_fornecedor_id] => 1 [adms_produto_id] => 1 [qtde] => 3 [observacoes] => [barcode] => 560010001 [productName] => Bisturi ) [1] => Array ( [name_encomenda] => Pedido de Material [adms_fornecedor_id] => 1 [adms_produto_id] => 4 [qtde] => 4 [observacoes] => [barcode] => 560000023 [productName] => Pinça ) [adms_user_id] => 1 ) mas gostaria e preciso receber da seguinte forma: $this->data: Array ( [name_encomenda] => Pedido de Material [adms_fornecedor_id] => 1 [adms_produto_id] => Array ( [0] => 1 [1] => 4 [2] => 2 ) [qtde] => Array ( [0] => 3 [1] => 4 [2] => 1 ) [observacoes] => [codigo_barras] => Array ( [0] => 560010001 [1] => 560000023 [2] => 560000021 ) [adms_user_id] => 1 ) Agora a pergunta, como faço isso?

Bom dia a todos. já fiz várias pesquisas mas infelizmente não consegui encontrar nada, ou minha pesquisa não esta sendo feita da forma correcta. quero alimentar um select com 3 tipos de dados, até aqui tudo bem, pois fiz da seguinte forma: <select name="select"> <option value="valor1" barcode="560001">Valor 1</option> <option value="valor2" barcode="560002">Valor 2</option> <option value="valor3" barcode="560003">Valor 3</option> </select> <button type="submit" onclick="receberValores">Enviar</button> até aqui tudo a funcionar. O que gostaria é de receber todos os valores no javascript Já criei um botão para chamar uma função js e receber os valores, mas não sei como receber o barcode, alguém pode ajudar-me? function receberValores(){ const select = document.getElementById('select').value const opcaoTexto = select.options[select.selectedIndex].text; const opcaoValor = select.options[select.selectedIndex].value; }

Boa noite, cá estou eu novamente a necessitar de vossa ajuda. Vi o video seguinte do professor Celke a fazer um preview de imagens. https://youtu.be/sWzW4TJ4ta4?si=i88K8iUSPFhGolSy Na video aula existe o seguinte código: <!DOCTYPE html> <html lang="pt-br"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Celke - Preview de Múltiplas Imagens</title> </head> <body> <h2>Preview de Múltiplas Imagens</h2> <!-- Inicio do formulário --> <form> <!-- Campo para selecionar as imagens --> <input type="file" name="inputImagens" id="inputImagens" multiple accept="image/*"><br><br> <!--<input type="file" name="inputImagens" id="inputImagens" multiple>--> </form> <!-- Fim do formulário --> <!-- Receber o preview das imagens --> <span id="previewImagem"></span> <script> // Receber o seletor do campo com as imagens const inputImagens = document.getElementById("inputImagens"); // Receber o seletor para enviar o preview das imagens const previewImagem = document.getElementById("previewImagem"); // Aguardar alteração no campo de imagens inputImagens.addEventListener("change", function (e) { // Limpar o seletor que recebe o preview das imagens previewImagem.innerHTML = ""; // Percorrer a lista de arquivos selecionados for (const arquivo of e.target.files) { console.log(arquivo); // Criar a TAG <img>, no atributo src atribuir a imagem e no atributo alt o nome const imagemHTML = `<img src="${URL.createObjectURL(arquivo)}" alt="${arquivo.name}" style="max-width: 200px; margin: 10px;">`; // Enviar para o HTML a imagem, beforeend - adicionar a image no final previewImagem.insertAdjacentHTML("beforeend", imagemHTML); } }); </script> </body> </html> gostaria de chamar o script através de uma função em um arquivo javascript O modelo da Celke funciona, mas no meu não aparece me o seguinte erro: Uncaught TypeError: Cannot set properties of null (setting 'innerHTML') at reader.onload (custom_adms.js) meu código: <input type="file" class="input-adm" name="new_image[]" id="new_image" onchange="previewImg()" multiple="multiple" accept="image/*" /> <span id="previewImage"></span> //preview multiplas imagens function previewImg() { // Receber o seletor do campo com as imagens const new_imageMultiple = document.getElementById("new_image"); // Receber o seletor para enviar o preview das imagens const previewImage = document.getElementById("previewImage"); // Aguardar alteração no campo de imagens new_imageMultiple.addEventListener("change", function (e) { // Limpar o seletor que recebe o preview das imagens previewImage.innerHTML = ""; // Percorrer a lista de arquivos selecionados for (const arquivo of e.target.files) { // Criar a TAG <img>, no atributo src atribuir a imagem e no atributo alt o nome const imagemHTML = `<img src="${URL.createObjectURL(arquivo)}" alt="${arquivo.name}" style="max-width: 200px; margin: 10px;">`; // Enviar para o HTML a imagem, beforeend - adicionar a image no final previewImage.insertAdjacentHTML("beforeend", imagemHTML); } }); }

Tenho o código abaixo em javascript para configurar os formatos do campo: data, telefone, celular, etc que esta funcionando perfeitamente, feitos por este video: https://youtu.be/r-8isv_TnVA?si=GWCLT-xY58QsWmay No formulário em html basta adicionar na tag input (ex. data-js="tel") Criar um arquivo js e adicionar o código abaixo. const masks = { date(value) { return value .replace(/\D+/g, '') .replace(/(\d{2})(\d)/, '$1-$2') .replace(/(-\d{2})(\d)/, '$1-$2') .replace(/(-\d{4})\d+?$/, '$1') }, tel(value) { return value .replace(/\D+/g, '') .replace(/(\d{3})(\d)/, '(+$1) $2') .replace(/(\d{3})(\d)/, '$1 $2') .replace(/(\d{3})(\d)/, '$1 $2') .replace(/( \d{3})\d+?$/, '$1') }, tlm(value) { return value .replace(/\D+/g, '') .replace(/(\d{3})(\d)/, '(+$1) $2') .replace(/(\d{3})(\d)/, '$1 $2') .replace(/(\d{3})(\d)/, '$1 $2') .replace(/( \d{3})\d+?$/, '$1') }, nif(value) { return value .replace(/\D+/g, '') .replace(/(\d{3})(\d)/, '$1.$2') .replace(/(\d{3})(\d)/, '$1.$2') .replace(/(.\d{3})\d+?$/, '$1') }, cnp(value) { return value .replace(/\D+/g, '') .replace(/(\d{3})(\d)/, '$1.$2') .replace(/(\d{3})(\d)/, '$1.$2') .replace(/(\d{3})(\d)/, '$1-$2') .replace(/(-\d{2})\d+?$/, '$1') }, postal(value) { return value .replace(/\D+/g, '') .replace(/(\d{4})(\d)/, '$1-$2') .replace(/(-\d{3})\d+?$/, '$1') } } document.querySelectorAll('input').forEach(($input) => { const field = $input.dataset.js $input.addEventListener( 'input', (e) => { e.target.value = masks[field](e.target.value) }, false ) }) Mas se existir algum campo que não entra na validação Ex. nome, data, cidade entre outros, da o seguinte erro: Uncaught TypeError: masks[field] is not a function at HTMLInputElement.<anonymous> (custom_adms.js:730:36) Erro esse que não influencia na funcionalidade, mas gostaria de resolver.

Bem cá estou eu outra vez. Tenho um campo para o NIF português, mas o que pode acontecer é de ter que inserir o NIF de outro pais. Até aqui tudo bem, pois tenho uma função em javascript que verifica se o NIF esta correcto e se é português ou não, neste post: https://www.portugal-a-programar.pt/forums/topic/80088-validação-nif/#comment-632350 O NIF português neste momento é composto por 9 dígitos e costumamos separar por pontos a cada 3 dígitos. Ex. 123.456.789 Tenho o campo da seguinte forma: <input type="text" name="numero_nif" id="numero_nif" data-js="nif" maxlength="11" class="input-adm" placeholder="###.###.###" value="<?php echo $numero_nif; ?>"> E esta sendo validade por javascript da seguinte forma: const masks = { nif(value) { return value .replace(/\D+/g, '') .replace(/(\d{3})(\d)/, '$1.$2') .replace(/(\d{3})(\d)/, '$1.$2') .replace(/(.\d{3})\d+?$/, '$1') }, } document.querySelectorAll('input').forEach(($input) => { const field = $input.dataset.js $input.addEventListener( 'input', (e) => { e.target.value = masks[field](e.target.value) }, false ) }) O que necessito é o seguinte, tenho um campo onde digito as iniciais do pais do NIF ex. "PT" ou "BR" caso fosse digitado PT ele fazia as configurações acima, no caso de digitar BR ou outro pais ficasse livre. Penso que tera que ser em javascript também porque terá que ser verificado no ato de digitar o pais.

Boas malta, estou a desenvolver um site em react, que tem como backend PHP e a base de dados tou a utilizar MySQL, e está me aparecer este erro quando tento adicionar os dados de uns inputs na base de dados: ERROR Network Error AxiosError: Network Error at XMLHttpRequest.handleError (http://localhost:3000/static/js/bundle.js:96826:14) Alguem me consegue ajudar?

Gerar mapa a partir de um endereço.

Boa noite, se chamo uma função em uma tag <button> funciona correctamente. Mas se colocar dentro de uma tag <a> no href não funciona, como faço? Neste momento esta desta forma: <a href="<?php echo URL; ?>add-freguesia/index" onclick="return abrirModal('modal')" class="btn-success">Cadastrar</a>

Boa noite pessoal, uma pessoa amiga ajudou me a preencher os campos selects conforme precisava, e os louvores são dele e não meu. Mas preciso da vossa ajuda para o seguinte: Conforme clico no botão cadastrar e é encontrado algum erro ou falta algum campo obrigatório, nos campos selects não recupera os dados que selecionei e nos outros campos sim. Espero que alguém possa me ajudar. Criamos uma view da seguinte forma: <div class="column"> <label for="adms_distrito_id" class="title-input">Distrito:<span class="text-danger">*</span> </label> <select class="input-adm" name="adms_distrito_id" id="adms_distrito_id" data-autofill data-target='#adms_concelho_id' data-href='load-concelhos/index'> <option value="">Carregando...</option> </select> <div class="content-adm-alert"></div> </div> <div class="column"> <label for="adms_concelho_id" class="title-input">Concelho:<span class="text-danger">*</span> </label> <select class="input-adm" name="adms_concelho_id" id="adms_concelho_id" data-target='#adms_freguesia_id' data-href='load-freguesias/index'> <option value="">Selecione um Distrito</option> </select> </div> <div class="column"> <label for="adms_freguesia_id" class="title-input">Freguesia:<span class="text-danger">*</span> </label> <select class="input-adm" name="adms_freguesia_id" id="adms_freguesia_id"> <option value="">Selecione um Concelho</option> </select> </div> e um arquivo js da seguinte forma: const loadJson = async (url, method = 'get') => { const headers = { method } const retorno = { statusCode: 200, body: [] } const request = await fetch(url, headers) if (request.headers.get('content-type').includes('json')) { const data = await request.json() retorno.body = data } else { adms_distrito_id.nextElementSibling.innerHTML = await request.text() } return retorno } const fillSelect = (selector, data, callback) => { // define se select element to be feed const selectToFill = document.querySelector(selector) const selectOptions = [] selectToFill.innerHTML = '<option value="">loading data...</option>' selectToFill.classList.remove('is-invalid') for (const obj of data) { const [key, val] = Object.keys(obj) selectOptions.push(`<option value="${obj[key]}">${obj[val]}</option>`) } if (selectOptions.length) { selectToFill.innerHTML = selectOptions.join() selectToFill.disabled = false } else { selectToFill.classList.add('is-invalid') selectToFill.disabled = true selectToFill.innerHTML = '<option value="">No registers found.</option>' } callback(selectToFill) } loadJson('/load-distritos/index').then((obj) => { for (const select of document.querySelectorAll('select[data-autofill]')) { fillSelect('#' + select.id, obj.body, (e) => { e.dispatchEvent(new Event('change')) }) } }) // Listen the changeEvent for all selects with [data-target][data-href] const selectsToFillAnother = document.querySelectorAll('select[data-target][data-href]') for (const select of selectsToFillAnother) { select.onchange = async ({ target }) => { const id = target.value const href = target.dataset.href const targetSelect = target.dataset.target const nextElement = targetSelect document.querySelector(targetSelect).innerHTML = '<option value="">loading data...</option>' let body = [{ id: '', value: 'Selecione um concelho' }] if (id) { body = await loadJson(`/${href}/${id}`).then(({ body }) => body) } fillSelect(targetSelect, body, (e) => { e.dispatchEvent(new Event('change')) }) } }

Boa tarde a todos, Tenho um formulário com 3 campos selects, consoante o que selecionar no primeiro gostaria que fosse feito uma pesquisa e preenchido o segundo e assim sucessivamente. fiz da seguinte forma, mas não resultou. Alias até funciona se eu digitar directamente na url o seguinte caminho: "http://projecto/load-concelho/index?distrito=2" no console me devolve correctamente, mas quando tento manipular o select não resulta. Na linha 6 já tentei: fetch("LoadConcelhos.php/index?distrito=" + adms_distrito_id) fetch("LoadConcelhos/index?distrito=" + adms_distrito_id) fetch("../LoadConcelhos.php/index?distrito=" + adms_distrito_id) fetch("http://projecto/LoadConcelhos.php/index?distrito=" + adms_distrito_id) fetch("load-concelhos.php/index?distrito=" + adms_distrito_id) fetch("../Controllers/LoadConcelhos.php/index?distrito=" + adms_distrito_id) LoadConcelho.php (2º select) <?php namespace App\adms\Controllers; use PDO; class LoadConcelhos { public function index() { $adms_distrito_id = $_GET['distrito']; $listConcelhos = new \App\adms\helpers\AdmsRead(); $listConcelhos->fullRead("SELECT id, name_concelho FROM adms_concelhos WHERE adms_distrito_id=:adms_distrito_id ORDER BY name_concelho ASC", "adms_distrito_id={$adms_distrito_id}"); $registry = $listConcelhos->getResult(); foreach ($registry as $concelhos) { ?> <option value="<?php echo $concelhos['id'] ?>" <?php echo $concelhos['name_concelho'] ?>></option> <?php } } } concelho.js 1 const selectDistrito = document.getElementById('adms_distrito_id') 2 selectDistrito.onchange = () => { 3 const selectConcelho = document.getElementById('adms_concelho_id') 4 const adms_distrito_id = selectDistrito.value; 5 console.log(adms_distrito_id); 6 fetch("LoadConcelhos.php/index?distrito=" + adms_distrito_id) 7 .then(response => { 8 return response.concelhos(); 9 }) 10 .then(bodyContent => { 11 selectConcelho.innerHTML = bodyContent; 12 }); 13 }

Boa noite, fiz a mascara para 3 campos de datas conforme abaixo, mas infelizmente não esta a funcionar o que fiz de errado? //mascara para datas const maskdata = document.querySelectorAll('#data_emissao, #data_validade, #data_nasc') maskdata.addEventListener('keypress', () => { let inputLength = maskdata.value.length // MAX LENGHT 14 cnp if (inputLength == 2 || inputLength == 5) { maskdata.value += '/' } })

Olá precisava de ajuda please!! tenho aqui um exercício para resolver, mas não estou a conseguir. A resolução do mesmo é uma das etapas para entrar num Bootcamp. Já pesquisei, já refiz mas não estou a chegar lá , neste exercício não posso usar métodos regex porque ainda não foram dados aqui na plataforma. Deixo aqui o ex e a minha tentativa de solução. Se me puderem ajudar fico grata. obrigada 🙂 Create a function named extractPassword which takes an array of characters (which includes some trash characters) and returns a string with only valid characters (a - z, A - Z, 0 - 9). Here's an example: extractPassword(['a', '-', '~', '1', 'a', '/']); // should return the string 'a1a' extractPassword(['~', 'A', '7', '/', 'C']); // should return the string 'A7C' o meu código: var extractPassword = (['a', '-', '~', '1', 'a', '/', '~', 'A', '7', '/', 'C']);{ var newPass = []; for (var i = 0; i < extractpassword.length; i++);{ var j = password[i]; if ( ('a'<=j && j <= 'z') || ('A'<=j && j<='Z') || ('0'<= j && j<='9')){ newPass.push(j); } } return newPass.join['']; } ahh o meu output é illegal return statement:(

I have difficulties with this problem that asks me to try to add a maximum number of tries to guess the target number. You have five tries, but if you guess it first, print a message and break out of the loop. Previous this is what I have goten so far var target = Math.ceil(Math.random() * 10); var guess = Math.ceil(Math.random() * 10); var tries = 5; console.log('target'+target); while (tries>0) { guess = Math.ceil(Math.random() * 10); tries--; console.log(guess); }

Criei um script para ir buscar um valor e carregar um conjunto de dados. O formato correto é: 0000-000 Mas quando faço a pesquisa em json só permite que seja neste formato : 0000000 , ou seja, sem o traço. var input = document.querySelector("#CP"); input atual: 1234-567 e agora quero que seja removido o traço . Já tentei desta forma e não funcionou. var CP_semtraco = input.replace(/[-]/g,""); Obrigado pelas dicas!

Boas a todos, A função window.print() que uso para imprimir a partir do browser não está a funcionar em Android. Alguém sabe como resolver/contornar o problema? Obrigado

Caríssimos, será possível ler para um formulário HTML um Código de Barras ou um QR Code lido pelo telemóvel? obrigado,

Depois de instalar o @ionic/storage-angular , adicionei o modulo "IonicStorageModule" no app.module.ts. A seguir criem um serviço "StorageService", o problema está quando eu chamo o serviço numa outra pagina apresenta o erro a seguir "TypeError: Illegal constructor". Será que alguém me consegue ajudar? Desde já Agradeço! 😀