Frank K Hosaka Postado Abril 15, 2022 Denunciar Share Postado Abril 15, 2022 Eu não sei como criar um <input> pelo Ajax, mas eu sei como criar um <input> pelo PHP. O código que segue é completamente inútil, mas estou contente por conseguir fazer funcionar. Se você manja de Java, gostaria que você traduzisse o código Ajax em "Java puro". _3.php <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script> <script> $(document).ready(function(){ $("li").click(function(){ alert("olá mundo"); $(this).html("olá mundo"); $("div#div1").html("<?php echo '<input>'; ?>"); }); }); </script> <?php echo "<div id='div1'></div>"; for ($i=1;$i<=10;$i++) { echo "<li>item $i </li>";} ?> Citar Link para o comentário Compartilhar em outros sites More sharing options...
1 wash Postado Abril 15, 2022 Denunciar Share Postado Abril 15, 2022 Olá! Acredito que não há nada de ajax aí. o AJ do ajax = Asynchronous Javascript E no trecho acima não há nadinha de assíncrono. Não entendi muito bem o que o sr. quis fazer. Uma vez que todos esses elementos poderiam ter sido criados diretamente no html. Mas se precisar criar/mover elementos via javascript, segue um exemplo/sugestão: <!doctype html> <html lang='en'> <head> <meta charset='UTF-8'> <meta name='viewport' content='width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0'> <meta http-equiv='X-UA-Compatible' content='ie=edge'> <title>Javascript</title> <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-1BmE4kWBq78iYhFldvKuhfTAU6auU8tT94WrHftjDbrCEXSU1oBoqyl2QvZ6jIW3" crossorigin="anonymous"> </head> <body> <div class='container'> <div class='row justify-content-center'> <div class='col-md-6'> <h1 class='fw-light'>Javascript</h1> <div id='app'></div> </div> </div> </div> <script> // define qual é o elemento que vai conter a aplicação const myApp = document.getElementById('app') // cria um um novo input const myInput = document.createElement('input') // adiciona class myInput.classList.add('form-control') // cria uma div, que vai conter os list items const lisContainer = document.createElement('div') // cria um elemento de lista não ordenada const myUl = document.createElement('ul') // adiciona class myUl.classList.add('list-group') // cria um elemento li const myLi = document.createElement('li') for (let i = 1; i < 11; i++){ // faz uma cópia de myLi const newLi = myLi.cloneNode(true); // adiciona class newLi.classList.add('list-group-item') // alimenta a cópia com texto e número newLi.innerHTML = `<a href='#'>List Item #${i}</a>` // adiciona um listener à newLi para que, quando clicado, mova o myInput para dentro newLi.querySelector('a').addEventListener('click', (e)=>{ e.target.innerText = `Fui Clicado #${i}` newLi.append(myInput) newLi.classList.add('bg-light') }) // coloca a newLi dentro de myUl myUl.append(newLi) } // coloca myUl dentro de lisContainer lisContainer.append(myUl) // colona lisContainer dentro de myApp myApp.append(lisContainer) </script> </body> </html> Preencha o input, e depois clique em outra li qualquer. Perceba que o input foi movido pra outra li, não copiado. Ah! E Java é uma linguagem server side E Javascript é client side Ou seja Java é completamente diferente de Javascript Citar Link para o comentário Compartilhar em outros sites More sharing options...
0 Frank K Hosaka Postado Abril 16, 2022 Autor Denunciar Share Postado Abril 16, 2022 (editado) Obrigado pela resposta. Faz muito tempo que venho apanhando com o que eu chamava de Java, agora estou sabendo que existe Java e Javascript. Ainda não tenho a menor ideia de como separar os dois, e talvez isso explique porque as minhas tentativas trazem resultados inesperados. No seu código não há nenhuma menção a uma biblioteca como é o caso do Ajax, isso é o que eu chamava de "Java puro". Eu gastei um tempo enorme para estudar a variavel no Java(script?), e não consegui resolver o problema. Eu tinha coisa do tipo _2.php <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script> <script> $(document).ready(function(){ $("li").click(function(){ omega = $(this).text(); alert(omega); $("div#div1").html("<form id='alpha' action='_2.php' method='post'><input type='submit' name='prod' value=" + omega + "></form>"); }); }); </script> <style>li { list-style-type: none; }</style> <?php if (isset($_POST['prod'])){echo $_POST['prod'];} echo "<div id='div1'></div>"; for ($i=1;$i<=10;$i++) { echo "<li>item $i </li>";} Nesse caso, eu selecionava "item 4", e o Ajax confirmava "item 4" pelo alert, mas na hora de criar o input, ele gravou como "item" e não como "item 4". Mas eu fui além, eu criei um formulário. Eu usei o comando inspeção do navegador, e não encontrei o elemento formulário. Isso significa que eu não tenho como submeter o formulário pelo Javascript, uma vez que ele só existe na tela do navegador, ou seja, o formulário só pode ser submetido com a ajuda do usuário. Eu queria muito desistir de usar o método POST, pois apresenta mais problema que solução. E também queria desistir do Java(script?) pelo mesmo motivo. Assim decidi valorizar mais o PHP e o método GET. O método POST trava o navegador, ou seja, não posso usar o botão atualizar pois o navegador alerta que todo o processo pode ser repetido com todos os dados que já foram passados anteriormente, e isso dificulta bastante a lógica do que eu esperava fazer. O meu código PHP tem um monte de limitações. Eu posso executar no Notebook ou no celular, mas não ao mesmo tempo. É um aplicativo monousuário. O método POST é uma especie de solicitação que precisa ser resolvida com muito mais lógica que eu não disponho. O método PUT e GET é bem mais tipo mensageiro, que usa a barra de endereços, o desenvolvedor só precisa ter o cuidado com a lógica, sabendo que tem um monte de informação na barra de endereço que pode comprometer todas as rotinas, se o usuário apertar o botão atualizar. Quanto a segurança, sem dúvida que não existe nenhuma. Eu sou apenas um desenvolvedor que caiu de paraquedas. Graças a Deus, eu não preciso disso para comprar o pão de cada dia. Se dependesse disso, estaria morto de fome. O que motiva o meu estudo nessa área é que consigo fazer alguns códigos funcionarem, e mesmo com 63 anos vou aprendendo que a informação é importante, mais ainda se for legível para um maior número de pessoas. Editado Abril 16, 2022 por Frank K Hosaka Citar Link para o comentário Compartilhar em outros sites More sharing options...
Pergunta
Frank K Hosaka
Eu não sei como criar um <input> pelo Ajax, mas eu sei como criar um <input> pelo PHP.
O código que segue é completamente inútil, mas estou contente por conseguir fazer funcionar.
Se você manja de Java, gostaria que você traduzisse o código Ajax em "Java puro".
Link para o comentário
Compartilhar em outros sites
2 respostass a esta questão
Posts Recomendados
Participe da discussão
Você pode postar agora e se registrar depois. Se você já tem uma conta, acesse agora para postar com sua conta.