Lightbox PHP MySQL Ajax
Bom dia a todos, tudo bem? Olha eu aqui novamente com um problema, dessa vez é sério pois não conheço nada de Ajax. Estou desenvolvendo uma pequena agenda em PHP com Mysql, já consegui realizar algumas partes porém estou com problemas, abaixo vou postar o código, e logo em seguida tenho algumas perguntas, espero que todos possam me ajudar. Sou iniciante mas tenho muita vontade de aprender por isso eu sempre venho a este fórum.
<?php require('conexaol.php').?><!DOCTYPE html>
<html lang="en">
<head> <meta charset="UTF-8"> <title>Agenda de Contatos</title> <link rel="stylesheet" type="text/css" href="style.css"> <script src="accordion.js" type="text/javascript" charset="utf-8" async defer></script> <script> function showUser(str) { if (str == "") { document.getElementById("txtHint").innerHTML = "". return. } else { if (window.XMLHttpRequest) { // code for IE7+, Firefox, Chrome, Opera, Safari xmlhttp = new XMLHttpRequest(). } else { // code for IE6, IE5 xmlhttp = new ActiveXObject("Microsoft.XMLHTTP"). } xmlhttp.onreadystatechange = function() { if (this.readyState == 4 && this.status == 200) { document.getElementById("txtHint").innerHTML = this.responseText. } }. xmlhttp.open("GET","filtrar.php?q="+str,true). xmlhttp.send(). } } </script> </head>
<body> <header> <h1>Agenda de Contatos</h1> <img src="brandcompany.png" alt="Brandcompany"> </header> <div class="subheader"> <form id="frmfiltragem" name="filtragem" action="filtrar.php" method="post"> <label>FILTROS</label> <select name="categoria" onchange="showUser(this.value)"> <option value="4">Ativo</option> <option value="5">Inativo</option> <option value="2">Clientes e Contatos</option> <option value="1">Fornecedores</option> <option value="3">Construtoras e Incorporadoras</option> </select> <select name="Ordenar"> <option value="">Ordene os dados</option> <option value="">Empresa</option> <option value="">Empresa</option> </select> <input type="submit" name="enviar" value="OK" id="btnok" style="margin-left: 0.5%"> </form> <form id="frmsearch" action="resultado.php" method="post"> <input name="buscar" type="text" id="txtsearch"> <input name="search" type="submit" value="OK" id="btnsok"> <a href="#" id="myBtnU" title="Adicionar"><img src="plus.png" width="42px" height="42px" id="btnadd"></a> <a href="#" title="Sair"><img src="exit.png" alt="" id="btnexit" width="42px" height="42px"></a> </form> </div> <div id="txtHint" class="main"> <div class="titulos"> <div class="titempresa"> <h2>EMPRESA</h2> </div> <div class="titcontato"> <h2>CONTATO</h2> </div> <div class="titemail"> <h2>E-MAIL</h2> </div> <div class="titphone"> <h2>TELEFONE</h2> </div> <div class="titsmartphone"> <h2>CELULAR</h2> </div> <div class="titactions"></div> <?php $sql = "SELECT * FROM cadastro". $result = mysqli_query($conn, $sql). if (mysqli_num_rows($result) > 0) { while($row = mysqli_fetch_assoc($result)) { echo " <button class='accordion'> <div class='titempresa'> <p>".$row["cadastro_empresa"]."</p> </div> <div class='titcontato'> <p>".$row["cadastro_contato"]."</p> </div> <div class='titemail'> <p>".$row["cadastro_email1"]."</p> </div> <div class='titphone'> <p>".$row["cadastro_telefone1"]."</p> </div> <div class='titsmartphone'> <p>".$row["cadastro_celular1"]."</p> </div> <div class='titactions'> <a href='#' title='Editar' id='myBtnU'><img src='edit.png' alt='Editar' id='btnedit' width='24px' height='24px'></a> <a href='delete.php?identifica=".$row["cadastro_id"]."' title='Excluir' id=''><img src='delete.png' alt='delete' id='btndelete' width='24px' height='24px'></a> </div> </button> <div class='panel'> <div class='titcontato'> <p><strong>CONTATO</strong></p> <p>".$row["cadastro_contato2"]."</p> <p>".$row["cadastro_contato3"]."</p> <p>".$row["cadastro_contato4"]."</p> <p>".$row["cadastro_contato5"]."</p> <p>".$row["cadastro_contato6"]."</p> <p>".$row["cadastro_contato7"]."</p> <p>".$row["cadastro_contato8"]."</p> <p>".$row["cadastro_contato9"]."</p> <p>".$row["cadastro_contato10"]."</p> </div> <div class='titemail'> <p><strong>E-MAIL</strong></p> <p>".$row["cadastro_email2"]."</p> <p>".$row["cadastro_email3"]."</p> <p>".$row["cadastro_email4"]."</p> <p>".$row["cadastro_email5"]."</p> <p>".$row["cadastro_email6"]."</p> <p>".$row["cadastro_email7"]."</p> <p>".$row["cadastro_email8"]."</p> <p>".$row["cadastro_email9"]."</p> <p>".$row["cadastro_email10"]."</p> </div> <div class='titphone'> <p><strong>TELEFONE</strong></p> <p>".$row["cadastro_telefone2"]."</p> <p>".$row["cadastro_telefone3"]."</p> <p>".$row["cadastro_telefone4"]."</p> <p>".$row["cadastro_telefone5"]."</p> <p>".$row["cadastro_telefone6"]."</p> <p>".$row["cadastro_telefone7"]."</p> <p>".$row["cadastro_telefone8"]."</p> <p>".$row["cadastro_telefone9"]."</p> <p>".$row["cadastro_telefone10"]."</p> </div> <div class='titsmartphone'> <p><strong>CELULAR</strong></p> <p>".$row["cadastro_celular2"]."</p> <p>".$row["cadastro_celular3"]."</p> <p>".$row["cadastro_celular4"]."</p> <p>".$row["cadastro_celular5"]."</p> <p>".$row["cadastro_celular6"]."</p> <p>".$row["cadastro_celular7"]."</p> <p>".$row["cadastro_celular8"]."</p> <p>".$row["cadastro_celular9"]."</p> <p>".$row["cadastro_celular10"]."</p> </div> <div class='titsmartphone' style='width:35%. float:left'> <p><strong>ENDEREÇO FÍSICO</strong></p> <p>".$row["cadastro_endereco"]."</p> <p> </p> <p> </p> <p><strong>ENDEREÇO DIGITAIS</strong></p> <p>".$row["cadastro_enderecos_digitais"]."</p> </div> </div>". } }else { echo "". } mysqli_close($conn).?> <div id="myModal" class="modal"> <div class="modal-content"> <span class="close">×</span> <form name="cadastro" method="post" action="insert.php" id="frmcadastro" class="frms"> <div id="elastico"> <h1>Inserir dados</h1> <div class="cols"> <img src="imagens/dados-pessoais.gif" alt="" /> <div class="alinha"> <p> <label>Categoria</label> <select name="categoria" id="categoria" class="categoria"> <option value="2">Clientes e Contatos</option> <option value="3">Construtoras e Incorporadoras</option> <option value="1">Fornecedores</option> </select> </p> <p> <label>Segmento</label> <input type="text" name="seguimento" id="seguimento" /> </p> <p> <label>Empresa</label> <input type="text" name="empresa" id="txtempresa" /> </p> <p> <label>Dados da Empresa</label> <textarea name="dados_empresa" id="dateEmpresa" style="height:56px. "></textarea> </p> </div> </div> <div class="cols"> <div class="alinha"> <p> <label>Endereço</label> <textarea name="cadastro_endereco" id="txtendereco"></textarea> </p> <p> <label>Endereços digitais </label> <textarea name="cadastro_enderecos_digitais" id="digitais"></textarea> </p> <p> <label style="width:auto. margin-left: 20%">Ativo<input type="radio" name="Ativo" value="Ativo" style="margin:6px 0 0"></label> <label style="width:auto. margin-left: 20%">Inativo<input type="radio" name="Ativo" value="Inativo" style="margin:6px 0 0"></label> </p> </div> </div> <div class="members"> <div class="titles"> <label id="tlnome">Nome</label> <label id="tlemail">E-mail</label> <label id="tltelefone">Telefone</label> <label id="tlcelular">Celular</label> </div> <div class="titles"> <input type="text" name="cadastro_contato" id="contato" class="cnomes" /> <input type="text" name="cadastro_email1" id="email" class="cemails" /> <input type="text" name="cadastro_telefone1" id="telefone" class="ctelefones" /> <input type="text" name="cadastro_celular1" id="celular" class="ccelulares" /> </div> <div class="titles"> <input type="text" name="cadastro_contato2" id="cadastro_contato2" class="cnomes" /> <input type="text" name="cadastro_email2" id="cadastro_email2" class="cemails" /> <input type="text" name="cadastro_telefone2" id="cadastro_telefone2" class="ctelefones" /> <input type="text" name="cadastro_celular2" id="cadastro_celular2" class="ccelulares" /> </div> <div class="titles"> <input type="text" name="cadastro_contato3" id="cadastro_contato3" class="cnomes" /> <input type="text" name="cadastro_email3" id="cadastro_email3" class="cemails" /> <input type="text" name="cadastro_telefone3" id="cadastro_telefone3" class="ctelefones" /> <input type="text" name="cadastro_celular3" id="cadastro_celular3" class="ccelulares" /> </div> <div class="titles"> <input type="text" name="cadastro_contato4" id="cadastro_contato4" class="cnomes" /> <input type="text" name="cadastro_email4" id="cadastro_email14" class="cemails" /> <input type="text" name="cadastro_telefone4" id="cadastro_telefone4" class="ctelefones" /> <input type="text" name="cadastro_celular4" id="cadastro_celular4" class="ccelulares" /> </div> <div class="titles"> <input type="text" name="cadastro_contato5" id="cadastro_contato5" class="cnomes" /> <input type="text" name="cadastro_email5" id="cadastro_email15" class="cemails" /> <input type="text" name="cadastro_telefone5" id="cadastro_telefone5" class="ctelefones" /> <input type="text" name="cadastro_celular5" id="cadastro_celular5" class="ccelulares" /> </div> <div class="titles"> <input type="text" name="cadastro_contato6" id="cadastro_contato6" class="cnomes" /> <input type="text" name="cadastro_email6" id="cadastro_email16" class="cemails" /> <input type="text" name="cadastro_telefone6" id="cadastro_telefone6" class="ctelefones" /> <input type="text" name="cadastro_celular6" id="cadastro_celular6" class="ccelulares" /> </div> <div class="titles"> <input type="text" name="cadastro_contato7" id="cadastro_contato7" class="cnomes" /> <input type="text" name="cadastro_email7" id="cadastro_email17" class="cemails" /> <input type="text" name="cadastro_telefone7" id="cadastro_telefone7" class="ctelefones" /> <input type="text" name="cadastro_celular7" id="cadastro_celular7" class="ccelulares" /> </div> <div class="titles"> <input type="text" name="cadastro_contato8" id="cadastro_contato8" class="cnomes" /> <input type="text" name="cadastro_email8" id="cadastro_email18" class="cemails" /> <input type="text" name="cadastro_telefone8" id="cadastro_telefone8" class="ctelefones" /> <input type="text" name="cadastro_celular8" id="cadastro_celular8" class="ccelulares" /> </div> <div class="titles"> <input type="text" name="cadastro_contato9" id="cadastro_contato9" class="cnomes" /> <input type="text" name="cadastro_email9" id="cadastro_email19" class="cemails" /> <input type="text" name="cadastro_telefone9" id="cadastro_telefone9" class="ctelefones" /> <input type="text" name="cadastro_celular9" id="cadastro_celular9" class="ccelulares" /> </div> <div class="titles"> <input type="text" name="cadastro_contato10" id="cadastro_contato10" class="cnomes" /> <input type="text" name="cadastro_email10" id="cadastro_email10" class="cemails" /> <input type="text" name="cadastro_telefone10" id="cadastro_telefone10" class="ctelefones" /> <input type="text" name="cadastro_celular10" id="cadastro_celular10" class="ccelulares" /> </div> </div> <input name="enviar" id="btnsalvar" value="salvar" type="submit" title="Salvar registro" style="margin-right:40px" /> </div> </form> </div> </div> <div id="myModalU" class="modal"> <div class="modal-content"> <span class="close">×</span> <form name="cadastro" method="post" action="insert.php"> <div id="elastico"> <h1>DADOS</h1> <div class="cols"> <img src="imagens/dados-pessoais.gif" alt="" /> <div class="alinha"> <p> <label>Categoria</label> <select name="categoria" id="categoria" class="categoria"> <option value="2">Clientes e Contatos</option> <option value="3">Construtoras e Incorporadoras</option> <option value="1">Fornecedores</option> </select> </p> <p> <label>Segmento</label> <input type="text" name="seguimento" id="seguimento" value="<?php $_REQUEST['cadastro_seguimento']?>" /> </p> <p> <label>Empresa</label> <input type="text" name="empresa" id="empresa" value="<?php $_REQUEST['cadastro_empresa']?>" /> </p> <p> <label>Dados da Empresa</label> <textarea name="dados_empresa" id="digitais" style="height:96px. " value="<?php $_REQUEST['cadastro_dados_empresa']?>"></textarea> </p> </div> <div class="cols"> <img src="imagens/endereco.gif" alt="" /> <div class="alinha"> <p> <label>Endereço</label> <textarea name="cadastro_endereco" id="digitais" value="<?php $_REQUEST['cadastro_endereco']?>"></textarea> </p> <p> <label>Endereços digitais </label> <textarea name="cadastro_enderecos_digitais" id="digitais" value="<?php $_REQUEST['cadastro_enderecos_digitais']?>"></textarea> </p> </div> </div> <img src="imagens/filete.png" alt="" name="filete" width="918" height="2" id="filete" /> <div class="members"> <div class="titles"> <label id="tlnome">Nome</label> <label id="tlemail">E-mail</label> <label id="tltelefone">Telefone</label> <label id="tlcelular">Celular</label> </div> <div class="title"> <input type="text" name="cadastro_contato" id="contato" class="cnomes" value="<?php $_REQUEST['cadastro_contato']?>" /> <input type="text" name="cadastro_email1" id="email" class="cemails" value="<?php $_REQUEST['cadastro_email1']?>" /> <input type="text" name="cadastro_telefone1" id="telefone" class="ctelefones" value="<?php $_REQUEST['cadastro_telefone1']?>" /> <input type="text" name="cadastro_celular1" id="celular" class="ccelulares" value="<?php $_REQUEST['cadastro_celular1']?>" /> </div> <div class="title"> <input type="text" name="cadastro_contato2" id="cadastro_contato2" class="cnomes" value="<?php $_REQUEST['cadastro_contato2']?>" /> <input type="text" name="cadastro_email2" id="cadastro_email2" class="cemails" value="<?php $_REQUEST['cadastro_email2']?>" /> <input type="text" name="cadastro_telefone2" id="cadastro_telefone2" class="ctelefones" value="<?php $_REQUEST['cadastro_telefone3']?>" /> <input type="text" name="cadastro_celular2" id="cadastro_celular2" class="ccelulares" value="<?php $_REQUEST['cadastro_celular2']?>" /> </div> <div class="title"> <input type="text" name="cadastro_contato3" id="cadastro_contato3" class="cnomes" value="<?php $_REQUEST['cadastro_contato3']?>" /> <input type="text" name="cadastro_email3" id="cadastro_email3" class="cemails" value="<?php $_REQUEST['cadastro_email3']?>" /> <input type="text" name="cadastro_telefone3" id="cadastro_telefone3" class="ctelefones" value="<?php $_REQUEST['cadastro_telefone3']?>" /> <input type="text" name="cadastro_celular3" id="cadastro_celular3" class="ccelulares" value="<?php $_REQUEST['cadastro_celular3']?>" /> </div> <div class="title"> <input type="text" name="cadastro_contato4" id="cadastro_contato4" class="cnomes" value="<?php $_REQUEST['cadastro_contato4']?>" /> <input type="text" name="cadastro_email4" id="cadastro_email14" class="cemails" value="<?php $_REQUEST['cadastro_email4']?>" /> <input type="text" name="cadastro_telefone4" id="cadastro_telefone4" class="ctelefones" value="<?php $_REQUEST['cadastro_telefone4']?>" /> <input type="text" name="cadastro_celular4" id="cadastro_celular4" class="ccelulares" value="<?php $_REQUEST['cadastro_celular4']?>" /> </div> <div class="title"> <input type="text" name="cadastro_contato5" id="cadastro_contato5" class="cnomes" value="<?php $_REQUEST['cadastro_contato5']?>" /> <input type="text" name="cadastro_email5" id="cadastro_email15" class="cemails" value="<?php $_REQUEST['cadastro_email5']?>" /> <input type="text" name="cadastro_telefone5" id="cadastro_telefone5" class="ctelefones" value="<?php $_REQUEST['cadastro_telefone5']?>" /> <input type="text" name="cadastro_celular5" id="cadastro_celular5" class="ccelulares" value="<?php $_REQUEST['cadastro_celular5']?>"/> </div> <div class="title"> <input type="text" name="cadastro_contato6" id="cadastro_contato6" class="cnomes" value="<?php $_REQUEST['cadastro_contato6']?>" /> <input type="text" name="cadastro_email6" id="cadastro_email16" class="cemails" value="<?php $_REQUEST['cadastro_email6']?>" /> <input type="text" name="cadastro_telefone6" id="cadastro_telefone6" class="ctelefones" value="<?php $_REQUEST['cadastro_telefone6']?>" /> <input type="text" name="cadastro_celular6" id="cadastro_celular6" class="ccelulares" value="<?php $_REQUEST['cadastro_celular6']?>" /> </div> <div class="title"> <input type="text" name="cadastro_contato7" id="cadastro_contato7" class="cnomes" value="<?php $_REQUEST['cadastro_contato7']?>" /> <input type="text" name="cadastro_email7" id="cadastro_email17" class="cemails" value="<?php $_REQUEST['cadastro_email7']?>" /> <input type="text" name="cadastro_telefone7" id="cadastro_telefone7" class="ctelefones" value="<?php $_REQUEST['cadastro_telefone7']?>" /> <input type="text" name="cadastro_celular7" id="cadastro_celular7" class="ccelulares" value="<?php $_REQUEST['cadastro_celular7']?>" /> </div> <div class="title"> <input type="text" name="cadastro_contato8" id="cadastro_contato8" class="cnomes" value="<?php $_REQUEST['cadastro_cadastro8']?>" /> <input type="text" name="cadastro_email8" id="cadastro_email18" class="cemails" value="<?php $_REQUEST['cadastro_email8']?>" /> <input type="text" name="cadastro_telefone8" id="cadastro_telefone8" class="ctelefones" value="<?php $_REQUEST['cadastro_telefone8']?>" /> <input type="text" name="cadastro_celular8" id="cadastro_celular8" class="ccelulares" value="<?php $_REQUEST['cadastro_celular9']?>" /> </div> <div class="title"> <input type="text" name="cadastro_contato9" id="cadastro_contato9" class="cnomes" value="<?php $_REQUEST['cadastro_contato9']?>" /> <input type="text" name="cadastro_email9" id="cadastro_email19" class="cemails" value="<?php $_REQUEST['cadastro_email9']?>" /> <input type="text" name="cadastro_telefone9" id="cadastro_telefone9" class="ctelefones" value="<?php $_REQUEST['cadastro_telefone9']?>" /> <input type="text" name="cadastro_celular9" id="cadastro_celular9" class="ccelulares" value="<?php $_REQUEST['cadastro_celular9']?>" /> </div> <div class="title"> <input type="text" name="cadastro_contato10" id="cadastro_contato10" class="cnomes" value="<?php $_REQUEST['cadastro_contato10']?>" /> <input type="text" name="cadastro_email10" id="cadastro_email10" class="cemails" value="<?php $_REQUEST['cadastro_email10']?>" /> <input type="text" name="cadastro_telefone10" id="cadastro_telefone10" class="ctelefones" value="<?php $_REQUEST['cadastro_telefone10']?>" /> <input type="text" name="cadastro_celular10" id="cadastro_celular10" class="ccelulares" value="<?php $_REQUEST['cadastro_celular10']?>" /> </div> </div> <input name="KT_Insert1" id="entrar" value="salvar" type="submit" title="Salvar registro" style="margin-right:40px" /> <a href="#" title="Voltar" id="btnvoltar" onclick="javascript:self.close(). " onkeypress="javascript:self.close(). ">Voltar</a> </div> </form> </div> </div> </div> </div>
</body>
</html>2-) Fazer uma busca em Ajax
3-) Os botões editar e excluir não funcionam na barra, quando eu clico neles eles não executam, e preciso eles também funcionarem com Jquery e o Ajax
4-) O mesmo fazer com o botão adicionar, ao cadastrar os dados fazer inclusão via ajax como proceder. 5-) Como eu posso melhorar este código? Alguém saberia me ajudar com este caso, me dar um caminho para que possa solucionar?
Discussão (7)
Carregando comentários...