Ir para conteúdo

POWERED BY:

  • 0
Jack Oliveira

Salvar dados na tabela com JAVASCRIPT

Pergunta

Ola pessoal boa noite preciso salvar umas coisas no banco de dados usando ao clicar no botão que esteja aparecendo sem que recarregue a página

 

Seria isso aqui

 

HTML do botão

                                                <div class="btn-group">
                                                    <a href="javascript:void(0)" class="rate-btn toggole-contnet">
                                                        <i class="fa fa-thumbs-o-up" aria-hidden="true"></i> Sim
                                                    </a>
                                                    <a href="javascript:void(0)" class="rate-btn toggole-contnet">
                                                        <i class="fa fa-thumbs-o-down" aria-hidden="true"></i> Não
                                                    </a>
                                                </div>

No PHP para salvar no banco esta da seguinte forma.

<?php  if(isset($_POST['AvaliComentario'])) {
		// Se o cookie ainda não foi setado
$cookie = isset($_COOKIE["avali_comentario_".$Comentario['id']]) ? $_COOKIE["avali_comentario_".$Comentario['id']] : null;
if (!isset($cookie)) {		
		
		$Adicionar = array(
			'comentario_id' 	=> $Comentario['id'],
			'up' 	            => post('up'),
			'down' 	            => post('down')
		);
		$Query = DBCreate('avali_comentario', $Adicionar);
		
   // Se for um sucesso a query
    if ($Query)
    {
        // Seta um cookie
        setcookie("avali_comentario_".$Comentario['id']."", true, time()+60*60*24*6004);
        // Retorna false, ou seja, sucesso
        echo false;
		
 Redireciona(''.$URLSHARE.'');	
    }else{
	//AbreAlerta("Erro! Ouve um erro ao  ".$dados['titulo']."!");
		 //Redireciona(''.$URLSHARE.'');
	}
			

	 }else{		
	//Sweet('Atenção!!!', 'Você já deu  sua Curtida para '.$dados['titulo'].'!', 'warning', 'Fechar');

	//AbreAlerta("Ops! Você já deu  sua Curtida para ".$dados['titulo']."!");
		//Redireciona(''.$URLSHARE.'');
		 
 }
 
}

Só preciso para quando clicar uns dos botão ele salvar sem precisar carregar a página...

 

Se ter um forma diferente para fazer fico grato pelas dicas que puderem dar ai..

 

 

Compartilhar este post


Link para o post
Compartilhar em outros sites

6 respostas a esta questão

Recommended Posts

  • 0
  Em 21/06/2021 at 02:34, Jack Oliveira disse:

sem que recarregue a página

 

Use AJAX para carregar um arquivo que irá registrar a avaliação. Nesse arquivo não use redirecionamento.

Ao clicar no botão pode enviar a informação do que foi clicado por protocolo GET ou POST, tanto faz o que conta mesmo é como esse dado será tratado no back-end.

 

Só um detalhe usar um cookie pode não ser o mais ideal, uma vez que o usuário pode está com cookies bloqueados no browser o mesmo limpar o cache ele vai poder avaliar novamente.

Sugiro uma tabela para registrar o que o usuário já avaliou.

Mas caso não seja um problema o usuário poder avaliar diversas vezes a mesma coisa, desconsidere....

Compartilhar este post


Link para o post
Compartilhar em outros sites
  • 0
  Em 21/06/2021 at 05:01, Omar~ disse:

uma vez que o usuário pode está com cookies bloqueados no browser o mesmo limpar o cache ele vai poder avaliar novamente

Ola @Omar~ Boa tarde então esta aparte que usará cookies seria bloquear para que os mesmo não fazem mais de uma vez...

 

Porem os usuários que poderá fazer as avaliações será quando fazerem algum comentário e sim poder dar sua avaliação, neste caso eles não teria login entende??

 

Teria como fazer pelo IP de uso do usuários ou seja da maquina ou mesmo da rede da internet IP?

Compartilhar este post


Link para o post
Compartilhar em outros sites
  • 0
  Em 21/06/2021 at 05:01, Omar~ disse:

Use AJAX para carregar um arquivo que irá registrar a avaliação. Nesse arquivo não use redirecionamento.

Ao clicar no botão pode enviar a informação do que foi clicado por protocolo GET ou POST, tanto faz o que conta mesmo é como esse dado será tratado no back-end.

Sobre aqui certo vou fazer obrigado....

Compartilhar este post


Link para o post
Compartilhar em outros sites
  • 0
  Em 21/06/2021 at 18:31, Jack Oliveira disse:

Teria como fazer pelo IP de uso do usuários ou seja da maquina ou mesmo da rede da internet IP?

Tem sim (pelo ip físico da máquina do usuário dizem que tem como obter o DNS também, mas não sei como).

Há uma possibilidade de erro (duplicar o mesmo), mas se colocar-mos IP + dados da máquina + sistema operacional você terá uma margem bem alta de precisão, pode acontecer de duplicar, mas seria extremamente raro.

Veja essa classe com ela você pode obter o IP o SO e até o browser que o usuário esteja usando.

  Mostrar conteúdo oculto

 

No entanto de qualquer forma terá que registrar em algum lugar no servidor, seja um banco de dados, um XML JSON, TXT etc... Não importa tem que registrar em algum lugar para saber se o usuário já fez a sua avaliação.

Compartilhar este post


Link para o post
Compartilhar em outros sites
  • 0
  Em 21/06/2021 at 05:01, Omar~ disse:

Use AJAX para carregar um arquivo que irá registrar a avaliação. Nesse arquivo não use redirecionamento.

Ao clicar no botão pode enviar a informação do que foi clicado por protocolo GET ou POST, tanto faz o que conta mesmo é como esse dado será tratado no back-end.

Ola @Omar~

 

Quero fazer usando data-value  Tu sabes como posso usar ou seja montar ele para que seja gravado apenas se for clicado em uns dos botões?

Na minha tabela fiz isso aqui, sem que não tem nada a ver aqui...

CREATE TABLE `avali_comentario` (
  `id` int(11) NOT NULL AUTO_INCREMENT,
  `comentario_id` int(11) NOT NULL,
  `up` int(11) NOT NULL,
  `down` int(11) NOT NULL,  
  PRIMARY KEY (`id`)
) ENGINE=MyISAM DEFAULT CHARSET=latin1;

Veja aqui no html como que posso bloquear se uns dos botão já tiver sindo clicado? 

                                                <div class="btn-group">
												<form method="post" action="" id="ajax_form">
                                                    <a href="javscript:void(0)" data-value="1" class="rate-btn toggole-contnet">
                                                        <i class="fa fa-thumbs-o-up" aria-hidden="true"></i> Sim
                                                    </a>
                                                    <a href="javscript:void(0)" data-value="2" class="rate-btn toggole-contnet">
                                                        <i class="fa fa-thumbs-o-down" aria-hidden="true"></i> Não
                                                    </a>
													</form>
                                                </div>

No javascript fiz isso

 

	<script type="text/javascript">
	jQuery(document).ready(function(){
		jQuery('#ajax_form').submit(function(){
			var dados = jQuery( this ).serialize();

			jQuery.ajax({
				type: "POST",
				url: "ajax/avaliar_listagem.php",
				data: dados,
				success: function( data )
				{
					alert( data );
				}
			});
			
			return false;
		});
	});
	</script>

No avaliar_listagem.php seria o mesmo aqui no PHP

 

<?php  if(isset($_POST['AvaliComentario'])) {
		// Se o cookie ainda não foi setado
$cookie = isset($_COOKIE["avali_comentario_".$Comentario['id']]) ? $_COOKIE["avali_comentario_".$Comentario['id']] : null;
if (!isset($cookie)) {		
		
		$Adicionar = array(
			'comentario_id' 	=> $Comentario['id'],
			'up' 	            => post('up'),
			'down' 	            => post('down')
		);
		$Query = DBCreate('avali_comentario', $Adicionar);
		
   // Se for um sucesso a query
    if ($Query)
    {
        // Seta um cookie
        setcookie("avali_comentario_".$Comentario['id']."", true, time()+60*60*24*6004);
        // Retorna false, ou seja, sucesso
        echo false;
		
 Redireciona(''.$URLSHARE.'');	
    }else{
	AbreAlerta("Erro! Ouve um erro ao  ".$dados['titulo']."!");
		 //Redireciona(''.$URLSHARE.'');
	}
			

	 }else{		
	//Sweet('Atenção!!!', 'Você já deu  sua Curtida para '.$dados['titulo'].'!', 'warning', 'Fechar');

	AbreAlerta("Ops! Você já deu  sua Curtida para ".$dados['titulo']."!");
		//Redireciona(''.$URLSHARE.'');
		 
 }
 
}

Sobre o que tu mandou qui vou dar um estudada nele..

 

  Em 21/06/2021 at 20:42, Omar~ disse:

Tem sim (pelo ip físico da máquina do usuário dizem que tem como obter o DNS também, mas não sei como).

Há uma possibilidade de erro (duplicar o mesmo), mas se colocar-mos IP + dados da máquina + sistema operacional você terá uma margem bem alta de precisão, pode acontecer de duplicar, mas seria extremamente raro.

Veja essa classe com ela você pode obter o IP o SO e até o browser que o usuário esteja usando.

  Mostrar conteúdo oculto

 

No entanto de qualquer forma terá que registrar em algum lugar no servidor, seja um banco de dados, um XML JSON, TXT etc... Não importa tem que registrar em algum lugar para saber se o usuário já fez a sua avaliação.

 

Vou criar uma tabela para pegar as informações necessárias

Obrigado pela esta ajuda 

Compartilhar este post


Link para o post
Compartilhar em outros sites
  • 0

Aqui eu estou supondo que haja apenas uma postagem ou várias a avaliar por página.

Se for várias apenas os form's devem ser gerados dentro de um loop das postagens.

Vou resumir, apesar de ser algo bem simples requer algumas manipulações do front para termos a coisa dinâmica, mas nada complicado.

<?php
$postID = 99;
?>
<form method="post" action="" id="ajax_form_<?= $postID ?>">
    <input type="hidden" name="alvo_da_postagem" value="<?= $postID ?>" />
    <input type="text" name="avaliar" value="" /> <!-- Mude para type="hidden" está como text para você testar aí -->

    <a data-value="1" class="voto">Sim</a>
    <a data-value="2" class="voto">Não</a>
</form>

<script>
    var botoes = document.getElementsByClassName('voto'); // Obtenho os botões de avaliação
  	if (typeof botoes !== 'undefined' && botoes !== null) { // Depois eu digo o porque disso
    	for (var i = 0; i < botoes.length; i++) {
        	botoes[i].addEventListener('click', salvarForm, false); // Adiciono evento click a cada botão
    	}
    }

    function salvarForm(e) {
        var alvo = e.target; // Obtenho o correto botão clicado
        var pai = alvo.parentNode; // Obtenho o elemento pai é o form "alvo.parentNode"
      	/*
        O primeiro elemento filho é um input que irá identificar o id da postagem "children[0]"
        Encontro o input para adicionar o valor da avaliação que é o segundo filho "children[1]"
        Então nesse filho que é o que tenho de manipular adiciono o valor do atributo data do botão clicado
        */
        pai.children[1].value = alvo.dataset.value;
       
       /*
       	AQUI então você salva o form por ajax
        Caso precise identificar o id do formulário lembre-se que já o encontramos
        então caso precise o "pai.id"
        será o mesmo valor que o foi renderizado no HTML id="ajax_form_<?= $postID ?>"
        */
    }
</script>

 

Então no arquivo que vai receber os dados do form você terá o

$_POST['alvo_da_postagem'] >>>> Que é o id da postagem para avaliar

$_POST['avaliar'] >>>> Que é data-value clicado pelo usuário

 

Nesse mesmo arquivo ao salvar a avaliação poderemos manipular o HTML

Como o #ID do form está assim ajax_form_<?= $postID ?> e $_POST['alvo_da_postagem'] será o mesmo que $postID então podemos chegar ao formulário para manipular qualquer um de seus elementos filhos no caso remover o ouvinte de eventos click do botão clicado 

Assim sendo não podendo clicar novamente no mesmo ou em ambos, sei lá como vai querer fazer...

document.getElementById('ajax_form_<?= $_POST['alvo_da_postagem'] ?>')

 

Ao caso do usuário recarregar a página fechar e reabrir a página sempre estará disponível os botões de avaliação.

Por isso a importância de também haver registro de qual postagem aquele usuário postou

Aqui eu estarei apenas usando a própria tabela que você apresentou, mas poderá criar outra apenas para essa finalidade de checagem

CREATE TABLE `avali_comentario` (
  `id` int(11) NOT NULL AUTO_INCREMENT,
  `comentario_id` int(11) NOT NULL,
  `usuario_id` int(11) NOT NULL DEFAULT '1' COMMENT 'ID do usuario que avaliou',
  `up` int(11) NOT NULL,
  `down` int(11) NOT NULL,  
  PRIMARY KEY (`id`)
) ENGINE=MyISAM DEFAULT CHARSET=latin1;

Nesse meu caso é só checar se o usuário já fez sua avaliação no post que se segue:

SELECT
    comentario_id,
    usuario_id
FROM
    avali_comentario
WHERE
    comentario_id = '$ID_DO_COMENTARIO'
AND
    usuario_id = '$ID_DO_USUARIO'

Se por exemplo essa query retornar algum valor podemos apenas escrever o html sem executar a função dos botões

<?php
$retornoDaQuery = true; /* Supondo que o usuario já votou porque a query retornou algum valor */
?>

<a <?= ($retornoDaQuery ? 'data-value="1" class="voto"' : null) ?>>Sim</a>
<a <?= ($retornoDaQuery ? 'data-value="2" class="voto"' : null) ?>>Não</a>

Assim sendo se os botões não tem as propriedades necessárias o voto não acontece ou até mesmo poderíamos colocar um IF se sim nem escreveríamos o html deles.

Por isso a identificação da existência pelo typeof antes de adicionar ouvintes nos botões se eles não existirem vai gerar erro de console.

Compartilhar este post


Link para o post
Compartilhar em outros sites

Crie uma conta ou entre para comentar

Você precisar ser um membro para fazer um comentário

Criar uma conta

Crie uma nova conta em nossa comunidade. É fácil!

Crie uma nova conta

Entrar

Já tem uma conta? Faça o login.

Entrar Agora

  • Conteúdo Similar

    • Por belann
      Olá!
       
      Estou usando o nextjs versão 15.2.3 e criei uma navbar que quando é carregado o programa aparece com a home, mas na hora de clicar na página produtos desaparece a navbar.
      A navbar esta sendo chamada no layout.tsx estou usando typescript
      e fica dessa forma
      <div>           <Navbar/>             <main>{children}</main>             </div>  
    • Por luiz monteiro
      Olá, tudo bem?
       
      Estou melhorando meu conhecimento em php e mysql e, me deparei com o seguinte. A tabela da base de dados tem um campo do tipo varchar(8) o qual armazena números. Eu não posso alterar o tipo desse campo. O que preciso é fazer um select para retornar o números que contenham zeros a direita ou a esquerda.
      O que tentei até agora
       
      Ex1
      $busca = $conexao->prepare("select campo form tabela where (campo = :campo) ");
      $busca->bindParam('campo', $_REQUEST['campo_form']);
       
      Se a direita da string $_REQUEST['campo_form'] termina ou inicia com zero ou zeros, a busca retorna vazio.
      Inseri dados numéricos, da seguinte maneira para testar: 01234567;  12345670: 12345678: 12340000... entre outros nessa coluna. Todos os valores que não terminam ou não iniciam com zero ou zeros, o select funciona.
       
       
      Ex2
      $busca = $conexao->prepare("select campo form tabela where (campo = 0340000) ");
      Esse número está cadastrado, mas não retorna.
       
      Ex3
      $busca = $conexao->prepare("select campo form tabela where (campo = '02340001' ) ");
      Esse número está cadastrado, mas não retorna.
       
       
      Ex4
      $busca = $conexao->prepare("select campo form tabela where (campo like 2340000) ");
      Esse número está cadastrado, mas não retorna.
       
      Ex5
      $busca = $conexao->prepare("select campo form tabela where (campo like '12340000') ");
      Esse número está cadastrado, mas não retorna.
       
      Ex6
      $busca = $conexao->prepare("select campo form tabela where (campo like '"12340000"' ) ");
      Esse número está cadastrado, mas não retorna.
       
       
      Ex7
      $busca = $conexao->prepare("select campo form tabela where (campo like :campo) ");
      $busca->bindParam('campo', $_REQUEST['campo_form'])
      Não retorna dados.
       
      O  $_REQUEST['campo_form'] é envio via AJAX de um formulário. 
      Usei o gettype para verificar o post, e ele retorna string.
      Fiz uma busca com número 12345678 para verificar o que o select retorna, e também retrona como string.
       
      Esse tipo de varchar foi usado porque os números que serão gravados nesse campo,  terão zeros a direita ou na esquerda. Os tipos number do mysql não gravam zeros, então estou usando esse. O problema é a busca.
      Agradeço desde já.
       
       
    • Por daemon
      Boa tarde,
       
      Eu tenho uma rotina que faz uma leitura do arquivo .xml de vários sites.

      Eu consigo pegar o tópico e a descrição, e mostrar a imagem que esta na pagina do link.
      Para isso utilizo esta função:
      function getPreviewImage($url) { // Obter o conteúdo da página $html = file_get_contents($url); // Criar um novo objeto DOMDocument $doc = new DOMDocument(); @$doc->loadHTML($html); // Procurar pela tag meta og:image $tags = $doc->getElementsByTagName('meta'); foreach ($tags as $tag) { if ($tag->getAttribute('property') == 'og:image') { return $tag->getAttribute('content'); } } // Se não encontrar og:image, procurar pela primeira imagem na página $tags = $doc->getElementsByTagName('img'); if ($tags->length > 0) { return $tags->item(0)->getAttribute('src'); } // Se não encontrar nenhuma imagem, retornar null return null; } // Uso: $url = "https://example.com/article"; $imageUrl = getPreviewImage($url); if ($imageUrl) { echo "<img src='$imageUrl' alt='Preview'>"; } else { echo "Nenhuma imagem encontrada"; }  
      Mas estou com um problema, esta funcão funciona quando coloco em uma pagina de teste.php. Preciso mostrar em uma página inicial diversas fotos de todos os links. (No caso acima só funciona 1).
    • Por violin101
      Caros amigos, saudações.
       
      Por favor, me permita tirar uma dúvida com os amigos.

      Tenho um Formulário onde o Usuário digita todos os Dados necessários.

      Minha dúvida:
      --> como faço após o usuário digitar os dados e salvar, o Sistema chamar uma Modal ou mensagem perguntando se deseja imprimir agora ?

      Grato,
       
      Cesar
    • Por Carcleo
      Tenho uma abela de usuarios e uma tabela de administradores e clientes.
      Gostaria de uma ajuda para implementar um cadastro
       
      users -> name, login, passord (pronta) admins -> user_id, registratiom, etc.. client -> user_id, registratiom, etc...
      Queria ajuda para extender de user as classes Admin e Client
      Olhem como estáAdmin
      <?php namespace App\Models; use Illuminate\Database\Eloquent\Factories\HasFactory; use Illuminate\Database\Eloquent\Model; class Admin extends User {     use HasFactory;            protected $fillable = [         'name',         'email',         'password',         'registration'     ];      private string $registration;     public function create(         string $name,          string $email,          string $password,         string $registration     )     {         //parent::create(['name'=>$name, 'email'=>$email, 'password'=>$password]);         parent::$name = $name;         parent::$email = $email;         parent::$password = $password;         $this->registration = $registration;     } } User
      <?php namespace App\Models; // use Illuminate\Contracts\Auth\MustVerifyEmail; use Illuminate\Database\Eloquent\Factories\HasFactory; use Illuminate\Foundation\Auth\User as Authenticatable; use Illuminate\Notifications\Notifiable; use Illuminate\Database\Eloquent\Relations\BelongsToMany; class User extends Authenticatable {     /** @use HasFactory<\Database\Factories\UserFactory> */     use HasFactory, Notifiable;     static string $name;     static string $email;     static string $password;     /**      * The attributes that are mass assignable.      *      * @var list<string>      */     protected $fillable = [         'name',         'email',         'password',     ];          /**      * The attributes that should be hidden for serialization.      *      * @var list<string>      */     protected $hidden = [         'remember_token',     ];     /**      * Get the attributes that should be cast.      *      * @return array<string, string>      */     protected function casts(): array     {         return [             'email_verified_at' => 'datetime',             'password' => 'hashed',         ];     }          public function roles() : BelongsToMany {         return $this->belongsToMany(Role::class);     }       public function hasHole(Array $roleName): bool     {                 foreach ($this->roles as $role) {             if ($role->name === $roleName) {                 return true;             }         }         return false;     }         public function hasHoles(Array $rolesName): bool     {                 foreach ($this->roles as $role) {             foreach ($rolesName as $rolee) {             if ($role->name === $rolee) {                 return true;             }          }         }         return false;     }         public function hasAbility(string $ability): bool     {         foreach ($this->roles as $role) {             if ($role->abilities->contains('name', $ability)) {                 return true;             }         }         return false;     }     } Como gravar um Admin na tabela admins sendo que ele é um User por extensão?
      Tentei assim mas é claro que está errado...
      public function store(Request $request, Admin $adminModel) {         $dados = $request->validate([             "name" => "required",             "email" => "required|email",             "password" => "required",             "registration" => "required"         ]);         $dados["password"] =  Hash::make($dados["password"]);                  $admin = Admin::where("registration",  $dados["registration"])->first();                  if ($admin)              return                    redirect()->route("admin.new")                             ->withErrors([                                 'fail' => 'Administrador já cadastrados<br>, favor verificar!'                   ]);                            $newAdmin = $adminModel->create(                                    $dados['name'],                                    $dados['email'],                                    $dados['password'],                                    $dados['registration']                                 );         dd($newAdmin);         $adminModel->save();         //$adminModel::create($admin);                  return redirect()->route("admin.new")->with("success",'Cadastrado com sucesso');     }  
×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.