Jump to content

joelzsbit

Members
  • Content count

    26
  • Joined

  • Last visited

Community Reputation

1 Comum

About joelzsbit

Recent Profile Visitors

664 profile views
  1. joelzsbit

    Salvar imagem no banco usando o script compressed

    Alguem tem algum exemplo que usa essa biblioteca e que salva no banco Mysql?
  2. Pessoal implementei o link (https://xkeshi.github.io/image-compressor/) no meu site para fazer a compressão de imagens, porem preciso que essa imagem seja salva no banco. Não estou conseguindo pegar essa imagem comprimida e enviar para um arquivo salvar.php que é o responsável para salvar no banco. A imagem comprimida fica nesse bloco: <div class="w-100 text-center" v-if="outputURL"> <img class="mw-100" :src="outputURL" :alt="output.name"> <div class="mt-2"> <a class="btn btn-sm btn-blocks btn-outline-primary mt-2" :download="output.name" :href="outputURL" title="Download the compressed image">Download</a> </div> </div> Pensei em colocar um botão de salvar ali no lugar do Download, porem como que vou enviar os dados da imagem que estão em javascript para um arquivo salvar.php ?
  3. joelzsbit

    Salvar imagem no banco usando o script compressed

    Pessoal, ainda não consegui resolver o problema. Obrigado por tentarem me ajudar. Vou abrir um tópico na categoria JavaScript.
  4. joelzsbit

    Salvar imagem no banco usando o script compressed

    Ola amigo, obrigado por tentar me ajudar. Recebo através do javascript que manda exibir nessa div: <div class="mt-2"> Não, apenas exibe na div e tem um botão que ao clicar que faz o download da imagem (aqui, não foi upado ainda... faz o download apenas da memória)... nessa linha: Aqui você já upou a imagem... e é isso que nao estou conseguindo upar uma imagem que o javascript exibe numa div. Obs: Queria usar esse "image-compressor", porque tem a vantagem de carregar e redimensionar a imagem rapidamente consequentemente salvando mais rápido no banco no meu caso usando o mysql.
  5. joelzsbit

    Salvar imagem no banco usando o script compressed

    Mas o que preciso é usar o (https://xkeshi.github.io/image-compressor/) para depois passar pro PHP. A imagem aparece nessa div: <div class="mt-2"> <a class="btn btn-sm btn-blocks btn-outline-primary mt-2" :download="output.name" :href="outputURL" title="Download the compressed image">Download</a> </div> Talvez nesse condigo: :download="output.name" :href="outputURL" alterasse para algo como: :upload="output.name" :href="salvar.php" mas como que vou enviar os parâmetros para pegar la no salvar.php?
  6. joelzsbit

    Salvar imagem no banco usando o script compressed

    Ai é que esta o problema, não sei como fazer pra pegar a imagem... ela aparece dentro desa div: <div class="mt-2"> <a class="btn btn-sm btn-blocks btn-outline-primary mt-2" :download="output.name" :href="outputURL" title="Download the compressed image">Download</a> </div>
  7. Pessoal implementei o link (https://xkeshi.github.io/image-compressor/) no meu site para fazer a compressão de imagens, porem preciso que essa imagem seja salva no banco. Não estou conseguindo pegar essa imagem comprimida e enviar para um arquivo salvar.php que é o responsável para salvar no banco. A imagem comprimida fica nesse bloco: <div class="w-100 text-center" v-if="outputURL"> <img class="mw-100" :src="outputURL" :alt="output.name"> <div class="mt-2"> <a class="btn btn-sm btn-blocks btn-outline-primary mt-2" :download="output.name" :href="outputURL" title="Download the compressed image">Download</a> </div> </div> Pensei em colocar um botão de salvar ali no lugar do Download, porem como que vou enviar os dados da imagem para o arquivo salvar.php?
  8. joelzsbit

    Ordenar imagens com o mouse

    Usando o sortable, agora consegui setar a ordem tanto na div como no input fazendo assim: document.getElementById('resultado').innerHTML = valores; ///passa para a div document.getElementById('resultado2').value = valores; // passa para o input Então o código ficou da seguinte forma: <html xmlns="http://www.w3.org/1999/xhtml"> <head> <script src="//code.jquery.com/jquery-1.12.4.js"></script> <script src="//code.jquery.com/ui/1.12.0/jquery-ui.js"></script> <style> #sortable {list-style-type: none; margin: 0; padding: 0; width: 450px;} #sortable li {margin: 3px 3px 3px 0; padding: 1px; float: left; width: 110px; height: 90px; font-size: 4em; text-align: center; } #sortable li img {height:80px; width:100px;} .oculta_span{display:none;} </style> <link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css"> <script src="https://code.jquery.com/jquery-1.12.4.js"></script> <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script> <script> $(function () { $("#sortable").sortable(); $("#sortable").disableSelection(); $('.salvar').click(function () { var valores = new Array(); $('#sortable .ordem').each(function () { valores.push($(this).html()); }); document.getElementById('resultado').innerHTML = valores; ///passa para a div document.getElementById('resultado2').value = valores; // passa para o input }); }); </script> </head> <body> <div class="row"> <form method="post" name="form1" role="form" action="<?php echo $_SERVER['PHP_SELF'] ?>" enctype="multipart/form-data"> <ul id="sortable"> <li class="ui-state-default"><span class="ordem">1</span></li> <li class="ui-state-default"><span class="ordem">2</span></li> <li class="ui-state-default"><span class="ordem">3</span></li> <li class="ui-state-default"><span class="ordem">4</span></li> <li class="ui-state-default"><span class="ordem">5</span></li> <li class="ui-state-default"><span class="ordem">6</span></li> <li class="ui-state-default"><span class="ordem">7</span></li> <li class="ui-state-default"><span class="ordem">8</span></li> <li class="ui-state-default"><span class="ordem">9</span></li> </ul> <div id="resultado" style=""></div> <input type="text" name="resultado2" id="resultado2" class="form-control largura450" value=""> <button type="submit" class="btn btn-primary btn-lg salvar"> Salvar </button> <input type="hidden" name="acao" value="cadastra" /> </form> </div> </body> <?php if ($_POST["acao"] == "cadastra"): $arrayOrdem = explode(",", trim($_POST['resultado2'])); // trim retira os espaços e coloca no array onde encontrarr a virgula $quantidade = count($arrayOrdem); // conta quantos itens foi encontrado for ($i = 0; $i < $quantidade; $i++) { echo 'Nr: '.$arrayOrdem[$i]; echo '<br>'; } endif; ?> </html> A principio deu certo, vou fazer mais testes e posto aqui novamente.
  9. joelzsbit

    Ordenar imagens com o mouse

    Então nesse caso é melhor usar o http://jqueryui.com/sortable/#display-grid, que supre bem minha necessidade de uma maneira bem simples e não acontece de substituir a img. O problema é que usando o sortable ainda não consegui fazer setar a ordem em uma div ou num input para que eu possa pegar a ordem com o php e salvar no banco mysql.
  10. joelzsbit

    Ordenar imagens com o mouse

    Amigo, analisando tua implementação acredito que no meu código falta data-id, uma div para setar a ordem e também renomear as function: onde consta: <div id="div1" ondrop="drop(event)" ondragover="allowDrop(event)"> Substitui por: <div id="div1" data-id="1" ondrop="drop(ev)" ondragover="allowDrop(ev)"> e também coloquei uma div para setar o resultado: <div class="container-drop"></div> porém mesmo assim não houve erro e não me mostrou nenhum resultado. O que sera que falta?
  11. joelzsbit

    Ordenar imagens com o mouse

    Pessoal, como que faço para gravar a ordem das imagens que foi ordenada com o mouse, usando esse codigo: <!DOCTYPE HTML> <html> <head> <style> #div1, #div2, #div3 { float: left; width: 100px; height: 35px; margin: 10px; padding: 10px; border: 1px solid black; } </style> <script> function allowDrop(ev) { ev.preventDefault(); } function drag(ev) { ev.dataTransfer.setData("text", ev.target.id); } function drop(ev) { ev.preventDefault(); var data = ev.dataTransfer.getData("text"); ev.target.appendChild(document.getElementById(data)); } </script> </head> <body> <h2>Drag and Drop</h2> <p>Drag the image back and forth between the two div elements.</p> <div id="div1" ondrop="drop(event)" ondragover="allowDrop(event)"> <img src="/imagens/img_cod/924081810.gif" draggable="true" ondragstart="drag(event)" id="drag1" width="88" height="31"> </div> <div id="div2" ondrop="drop(event)" ondragover="allowDrop(event)"> <img src="/imagens/img_cod/924081810.gif" draggable="true" ondragstart="drag(event)" id="drag1" width="88" height="31"> </div> <div id="div3" ondrop="drop(event)" ondragover="allowDrop(event)"></div> </body> </html>
  12. Ta explicado Gabriel... show de bola, valeu. Muito obrigado amigo.
  13. Pessoal com ajuda de vocês e com pesquisa na net, consegui fazer e esta funcionando da forma que queria, apenas tive que incluir um arquivo externo para fazer a busca no banco, mas não precisou fazer vários arquivos para cada input como imaginava: No meu arquivo teste.php ficou assim: <html> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script> <script type="text/javascript"> $(document).ready(function () { $("select[name='nome']").change(function () { var nome = $("input[name='nome']"); var sobrenome = $("input[name='sobrenome']"); var login = $("input[name='login']"); $(nome).val('Carregando...'); $(sobrenome).val('Carregando...'); $(login).val('Carregando...'); $.getJSON( 'function.php', // arquivo externo que faz as buscas no banco. {id_cad_pf: $(this).val()}, function (json) { $(nome).val(json.nome); $(sobrenome).val(json.sobrenome); $(login).val(json.login); } ); }); }); </script> </head> <body> <form action="" method="post"> <label>Nome: </label> <select name="nome"> <option value="">Seleciona um Usuario: </option> <?php include 'function19.php'; echo montaSelect(); ?> </select> <label>Nome: <input name="nome" type="text" disabled="disabled" value="" /></label> <label>Sobrenome: <input type="text" name="sobrenome" value="" /></label> <label>login: <input type="text" name="login" value="" /></label> </form> </body> </html> Ai no meu arquivo function.php fiz assim: <?php require_once("../DAO/conn.class.php"); require_once("../classes/classes.class.php"); $classe = new myclass; function montaSelect() { $PDO_con = conectar(); $busca_segura = $PDO_con->prepare("SELECT * FROM tb_cad_pf WHERE excluido != 'sim' "); $busca_segura->execute(); if ($busca_segura == 1) { while ($dados = $busca_segura->fetch(PDO::FETCH_ASSOC)) { $opt .= '<option value="' . $dados['id_cad_pf'] . '">' . $dados['nome'] . '</option>'; } } else { $opt = '<option value="0">Nenhum cliente cadastrado</option>'; } return $opt; } /** * função que devolve em formato JSON os dados do cliente */ function retorna($id) { $PDO_con = conectar(); $id = (int) $id; $busca_id = $PDO_con->prepare("SELECT * FROM tb_cad_pf WHERE id_cad_pf = '$id'"); $busca_id->execute(); $arr = Array(); if ($busca_id == 1) { while ($dados_id = $busca_id->fetch(PDO::FETCH_ASSOC)) { $arr['nome'] = $dados_id['nome']; $arr['sobrenome'] = $dados_id['sobrenome']; $arr['login'] = $dados_id['codigo']; } } else $arr[] = 'endereco: não encontrado'; return json_encode($arr); } /* só se for enviado o parâmetro, que devolve o combo */ if (isset($_GET['id_cad_pf'])) { echo retorna($_GET['id_cad_pf']); } Só não entendi ali no "function retorna($id)" onde esta "$id = (int) $id", como que essa variável $id esta com o valor do $id pra fazer a consulta no banco se em nenhum momento eu estou setando esse $id. Para explicar melhor: se no select eu escolho o id 5, como que o $id assume esse valor se nenhum momento ele esta setado que $id esta com '5' .
  14. Retirei os pontos, no while ja estão com o nome dos campos da tabela. Weslsley, com Ajax, não tentei ainda... mas pelo que sei teria que criar um arquivo externo. Mas ai para cada input terei que criar um arquivo externo? se for assim ai fica mais trabalhoso.
  15. Fiz assim: <body> <label for="cadastro">Cadastro</label> <select id="cadastro" name="cadastro" id=""> <?php $busca_segura = $PDO_con->prepare("SELECT * FROM tb_cad_pf WHERE excluido != 'sim' "); $busca_segura->execute(); if ($busca_segura == 1) { while ($dados= $busca_segura->fetch(PDO::FETCH_ASSOC)) { $opt .= '<option value="' . $dados['id_cad_pf'] . '">' . $dados['nome'] . '</option>'; $nome .= $dados['nome']; // criei o array incluido .= $sobrenome .= $dados['sobrenome']; // criei o array incluido .= $login .= $dados['login']; // criei o array incluido .= } } else { $opt = '<option value="0">Nenhum cliente cadastrado</option>'; } echo $opt; ?> </select> <label for="nome">Nome</label> <input type="text" id="nome" placeholder="nome" value=""/> <label for="sobrenome">Sobrenome</label> <input type="text" id="sobrenome" placeholder="sobrenome" value=""/> <label for="login">Login</label> <input type="text" id="login" placeholder="login" value=""/> <script> var nomes = <?php echo $nome ?>; var sobrenomes = <?php echo $sobrenome ?>; var logins = <?php echo $login ?>; <?php foreach($nome as $key => $value) { printf("nomes[%d] = '%s';", $key, $value); // Imprime nomes[0] = '(primeiro nome)'; } foreach($sobrenome as $key => $value) { printf("sobrenomes[%d] = '%s';", $key, $value); // Imprime sobrenomes[0] = '(primeiro sobrenome)'; } foreach($login as $key => $value) { printf("logins[%d] = '%s';", $key, $value); // Imprime logins[0] = '(primeiro login)'; } ?> document.getElementById("cadastro").addEventListener('change', function () { document.getElementById("nome").value = nomes[this.selectedIndex]; document.getElementById("sobrenome").value = sobrenomes[this.selectedIndex]; document.getElementById("login").value = logins[this.selectedIndex]; }); </script> </body> Não mostra erro, mesmo assim não preenche os campos, note que criei os arrays colocando ".= " nas variáveis ($nome, $sobrenome e $login) do php, sera que é ai o problema?
×

Important Information

Ao usar o fórum, você concorda com nossos Terms of Use.