luiz monteiro
Members-
Total de itens
35 -
Registro em
-
Última visita
Reputação
0 ComumSobre luiz monteiro
- Data de Nascimento 01/01/1980
Informações Pessoais
-
Sexo
Masculino
-
Localização
sampa
-
Interesses
tirar dúvidas e ajudar outras pessoas.
Últimos Visitantes
O bloco dos últimos visitantes está desativado e não está sendo visualizado por outros usuários.
-
Submeter formulario ao clicar em um button fora do form
luiz monteiro respondeu ao tópico de luiz monteiro em Javascript
Boa tarde. Tanto com javascript "formulario.submit()... e tanto com "<button type="submit" form="form1" value="Submit">Submit</button>", deu certo. Mas optei pelo javascript por insegurança com incompatibilidades de navegadores caso poderia acontecer. Eu testei em diferentes dispositivos mas prevaleceu a insegurança. Estarei em um novo projeto amanhã, e vou implementar o esse button. Não conhecia e nem imaginava isso. Resolvido meu problema. Obrigado pela ajuda de todos. -
Submeter formulario ao clicar em um button fora do form
luiz monteiro postou um tópico no fórum Javascript
Bom dia! A questão é a seguinte, tenho o seguinte form <form onsubmit="return false;" action="./busca.php" method="post" name="buscar" id="buscar"> <input type="text" name="texto"> <button>Executa</button> </form> Que está funcionando perfeitamente com a seguinte estrutura do script abaixo var form = document.getElementById('buscar'); form.addEventListener('submit', function(e) { e.preventDefault(); }); O que preciso, é saber como submeter esse mesmo formulário ao clicar em button fora do form sem modificar esse script? <button id="fora_do_form">Submeter o form</button> Agradeço desde já! -
Boa tarde! Tinha uma url de image ./imagem.extensão, alterei para https://dominio/imagem.extensão e voltou ao normal. O estranho era de que no wampserver estava tudo ok! Obrigado.
-
Boa tarde! Estou tentando criar uma url amigável, porem o htaccess não reconhece o arquivo sem a extensão. O objetivo é deixar a url assim: https://dominio.com.br/arquivo/id Estou usando essa regra no HTACCESS RewriteEngine On RewriteCond %{SCRIPT_FILENAME} !-f RewriteCond %{SCRIPT_FILENAME} !-d RewriteRule ^(.*)$ index.php [NC,L] No wampserver local funciona, porem no servidor online não. No online só aceita dessa maneira https://dominio.com.br/arquivo.php/id Sem a extensão não aceita. Tentei assim também RewriteEngine On RewriteCond %{REQUEST_FILENAME} !-f RewriteCond %{REQUEST_FILENAME} !-d RewriteRule ^(.*)$ index.php [NC,L] No wampserver local ok, porem no online não. Estou recuperando a id com o filter_input(INPUT_SERVER, 'REQUEST_URI') que no wampserver tudo ok, apenas no online não Agradeço desde já.
-
luiz monteiro começou a seguir Reorganizar thumbs do preview com javascript puro
-
Reorganizar thumbs do preview com javascript puro
luiz monteiro respondeu ao tópico de luiz monteiro em Javascript
Boa tarde! Tive que adaptar esses script jquery que peguei no stackoverflow. window.AddConteudo = function() { var texto = $('#texto').val(); $('#texto').val(''); $('#ConteudoMateria').append('<div class="DivPadrao">' + texto + '<br><a href="#" class="MoveUp">Mover p/ cima</a> | <a href="#" class="MoveDown">Mover p/ baixo</a></div>'); } function MoverBlocoConteudo(index, moveUp) { var itemlist = $('#ConteudoMateria'); var len = $(itemlist).children().length; var thisElement = jQuery($(itemlist).children().eq(index)); var nextPosition = (moveUp) ? index - 1 : index + 1; if (moveUp) { jQuery($(itemlist).children().eq(nextPosition)).before(thisElement); } else if (!moveUp) { jQuery($(itemlist).children().eq(nextPosition)).after(thisElement); } } $(document).ready(function() { $("#ConteudoMateria").on('click', '.MoveUp, .MoveDown', function(e) { e.preventDefault(); var index = $(this).parents('.DivPadrao').index(); var isMoveUp = $(this).hasClass('MoveUp'); MoverBlocoConteudo(index, isMoveUp) }); }); //]]></script> <script> // tell the embed parent frame the height of the content if (window.parent && window.parent.parent){ window.parent.parent.postMessage(["resultsFrame", { height: document.body.getBoundingClientRect().height, slug: "5w7svk02" }], "*") } // always overwrite window.name, in case users try to set it manually window.name = "result" </script> <script> let allLines = [] window.addEventListener("message", (message) => { if (message.data.console){ let insert = document.querySelector("#insert") allLines.push(message.data.console.payload) insert.innerHTML = allLines.join(";\r") let result = eval.call(null, message.data.console.payload) if (result !== undefined){ console.log(result) } } }) Obrigado pela ajuda galera. E espero que isso ajude mais alguem. -
Reorganizar thumbs do preview com javascript puro
luiz monteiro respondeu ao tópico de luiz monteiro em Javascript
Bom dia! A minha maior dificuldade está em manipular o files, tipo como pegar cada arquivo selecionado e adicionar em um novo input files com um botão delete para cada um deles. Tentei com o FileReader como no for mostrado acima, mas sem sucesso. Eu imagino que seja algo parecido com isso. let inputFile = document.querySelector("#imput_file"); const file = inputTarget.files; if (file) { const reader = new FileReader(); for (let i = 0; i < file.length; i++) { reader.addEventListener("load", function (e) { const readerTarget = e.target; const inputFile = document.createElement('input'); inputFile.type = "file"; inputFile.value = "como passo o valor? É assim mesmo, inputFile.value?"; inputFile.name = "preciso ter um diferente nome para cada um?"; document.document.querySelector('#div_recebe_botao_input').appendChild(inputFile); const botaoDelete = document.createElement("button"); botaoDelete.value = "como passo o valor? É assim mesmo, botaoDelete.value"; botaoDelete.name = "preciso ter um diferente nome para cada um?"; botaoDelete.innerHTML = 'Excluir'; document.document.querySelector('#div_recebe_botao_delete').appendChild(botaoDelete); o_que_preciso_aqui.appendChild(o que vai aqui?); }); o_que_preciso_aqui.readAsDataURL(o que vai aqui?); } } Imagino que minha ideia esteja certa, porem na prática nada acontece. Grato pela atenção. -
Reorganizar thumbs do preview com javascript puro
luiz monteiro respondeu ao tópico de luiz monteiro em Javascript
Eu estou tentando adaptar esse que encontrei na net e modifiquei. Aqui ele adiciona os thumbs de um em um, porem o php só recebe o último arquivo inserido. Tentei fazer o for porem nada deu certo. const file = inputTarget.files; if (file) { const reader = new FileReader(); for (let i = 0; i < file.length; i++) { reader.addEventListener("load", function (e) { const readerTarget = e.target; const img = document.createElement("img"); img.src = readerTarget.result; thumbs.appendChild(img); }); reader.readAsDataURL(file); console.log(inputFile.files); } Nada deu certo.................. O script que estou usando é o seguinte. <style type="text/css"> #imput_file { display: none; } .area_input { width: 400px; aspect-ratio: 16/9; background: #ddd; display: flex; align-items: center; justify-content: center; color: #aaa; border: 2px dashed currentcolor; cursor: pointer; font-family: sans-serif; transition: color 100ms ease-in-out, background 100ms ease-in-out; outline: none; margin: auto; margin-top: 30px; } .area_input:hover { color: #777; background: #999; } .area_input:active { border-color: turquoise; color: turquoise; background: #eee; } .area_input:focus { color: #777; background: #ccc; box-shadow: 0 0 10px rgba(0, 0, 0, 0.3); } .area_input__img { width: 100%; max-width: 150px; height: 100%; max-width: 150px; } .box { width: 100%; margin: auto; margin-top: 100px; } #recebe_thumb { display: flex; justify-content: center; column-gap: 10px; grid-row-gap: 10px; flex-wrap: wrap; width: 100%; max-width: 600px; height: 100%; max-height: 600px; } #recebe_thumb img { width: 100%; max-width: 100px; height: 100%; max-height: 100px; } </style> <form method="POST" action="#" enctype="multipart/form-data"> <label class="area_input" for="imput_file" tabIndex="0" id="drop"> <input type="file" name="imput_file[]" id="imput_file" multiple> <span id="texto"></span> </label> <br> <button>test</button> </form> <div class="box"> <div id="recebe_thumb" draggable="true"></div> </div> <script type="text/javascript"> let inputFile = document.querySelector("#imput_file"); let thumbs = document.querySelector("#recebe_thumb"); let areaDrop = document.querySelector("#drop"); let text_shwoed = "Click ou solte as imagens aqui"; let text = document.querySelector("#texto"); text.innerHTML = text_shwoed; inputFile.addEventListener("change", function (e) { const inputTarget = e.target; const file = inputTarget.files[0]; if (file) { const reader = new FileReader(); reader.addEventListener("load", function (e) { const readerTarget = e.target; const img = document.createElement("img"); img.src = readerTarget.result; thumbs.appendChild(img); }); reader.readAsDataURL(file); } else { text.innerHTML = text_shwoed; } }); Preciso mostrar os thumbs quando forem inseridos vários de uma única vez e/ou de um em um. Também preciso adicionar no files para que o PHP capture, mesmo quando adicionado de um em um. Grato por enquanto. -
Reorganizar thumbs do preview com javascript puro
luiz monteiro postou um tópico no fórum Javascript
Boa noite! Minha questão de hoje é de que o cliente quer arrastar imagem por imagem no drag an drop. Com o que com consegui na internet é possível arrastar todas em uma única vez, se arrastar novamente atualiza os thumbs pelo mais recente. Além disso, ele quer arrastar os thumbs para que o upload tenha aquela sequencia, ou seja, os thumbs tem que ter um drag para organizar na sequencia que ele precisa. A questão principal é como criar esse drag nos thumbs para organizar os mesmos e como modificar o input files para seguir essa sequencia? Agradeço desde já. -
Bom dia. Eu uso evento onchange no select dos estados para fazer uma chamada a uma função AJAX para retornar as cidades correspondentes. O que acontece muito, são erros na execução no PHP. Abre o console do navegador e verifica se esta retornando algum erro. Precisa debugar e postar aqui.
-
Bom dia. Mesmo assim muito obrigado. Eu li bastante no https://developer.mozilla.org/ mas mesmo assim não consegui resolver outros problemas semelhantes ao que você passou a solução. Vou abrir outros posts para aperfeiçoar minhas necessidades com javascript. Obrigado.
-
-
Boa noite. Legal. Obrigado. Eu preciso de algumas coisas especificas sobre esse assunto. Fiquei algum tempo parado cuidando da minha falecida mãe.... Você tem whatsapp para passar para que possamos combinar uma aula ou mais dentro da minha necessidade?
-
Boa noite! Estou desenvolvendo um sistema de cadastro de produtos, no qual é anexado várias imagens, porem as vezes o cliente seleciona uma ou mais imagens "erradas". Preciso entender como remover do input file a imagem quando é clicado no ícone de lixeira correspondente a imagem em javascript puro, sem framesworks, etc. Agradeço desde já!
-
Olá, tudo bem? Estou tentando colocar um evento dropdown em um template.js mas sem sucesso. O script é o seguinte const template = ` <nav id="sidebar"> <ul class="list-unstyled menu"> <li> <a href="#"> <span class="glyphicon glyphicon-home" aria-hidden="true"></span> Home </a> </li> <li> <a href="#"> <span class="glyphicon glyphicon-signal" aria-hidden="true"></span> Analytics </a> </li> <li> <a href="#"> <span class="glyphicon glyphicon-tasks" aria-hidden="true"></span> Ações </a> </li> <li> <a href="#"> <span class="glyphicon glyphicon-cog" aria-hidden="true"></span> Controles </a> </li> <li> <a href="#"> <span class="glyphicon glyphicon-user" aria-hidden="true"></span> Configurações </a> </li> </ul> </nav> ` export default { name: "Sidebar", template, delimiters: ["#{", "}#"] } ============Preciso colocar um dropdown na opção Ações, algo assim <li v-for="item in items"> <a :href="item.url" v-if="!item.children"> </a> <span v-else v-on:mouseover="mouseover" v-on:mouseleave="mouseleave"> {{ item.name }} <ul class=" dropdown" :class="{ isOpen }"> <li v-for="child in item.children"> <a :href="child.url"> {{ child.name }} </a> </li> </ul> </span> </li> var nav = new Vue({ el: '#nav', data: { isOpen: false, items: [ { url: '#acoes', name: 'Ações', children: [ { url: '#link1', name: 'Opção 1' }, { url: '#link2', name: 'Opção 2' }, { url: '#link3', name: 'Opção 3' }, ] } ] }, methods: { mouseover: function () { this.isOpen = true; }, mouseleave: function () { this.isOpen = false; } } }); Quando coloco a programação no sidebar.js, não é exibido nada na tela nem mesmo retorna erro. =============No index os imports estão assim <script type="importmap"> { "imports": { "vue": "https://unpkg.com/vue@3/dist/vue.esm-browser.js" } } </script> <script type="module"> import { createApp } from "vue"; import Sidebar from "/components/sidebar.js"; import Welcome from "/components/welcome.js"; const app = createApp({ delimiters: ["#{", "}#"], components: { Welcome, Sidebar }, data() { return {} }, methods: { } }).mount("#wrapper"); </script> </body> Agradeço desde já.
-
Duvida sobre estrutura de return function
luiz monteiro respondeu ao tópico de luiz monteiro em Javascript
Boa noite. Muito obrigado. Na primeira parte já deu para entender. Mas valeu pelo seu esforço em detalhar mais. Abraço. -
Bom dia. Estava lendo alguns artigos sobre javascript e me deparei com essa estrutura const debounce = function(func, wait, immediate) { let timeout; return function(...args) { const context = this; const later = function() { timeout = null; if (!immediate) func.apply(context, args); }; const callNow = immediate && !timeout; clearTimeout(timeout); timeout = setTimeout(later, wait); if (callNow) func.apply(context, args); }; }; Minha duvida é nesse ponto return function(...args), o que significa e qual a finalidade dos três pontos antes do args? Agradeço desde já.