Receive javascript data for query in mysql

Question

I was trying to return the variable post_id to php in order to perform a SELECT mysql, but I’m not able to work with post_id. How to do the query ?

    <script type="text/html" id="javo-map-tab-infobx-content">
     <div class="btn-group btn-group-justified pull-right">
                    <a id="botaoBrief" class="btn btn-primary btn-sm" onclick="window.javo_map_tab_func.brief_run(this);" data-id="{post_id}">
                        <i class="fa fa-user"></i> <?php _e("Briefaaaa", "javo_fr"); ?>
                    </a>

From the post_id i will perform a query and receive the value of a plan referring to the post. So I will decide whether to display:

<a id='colorDetail' href='{permalink}' class='btn btn-primary btn-sm'>
                                <i class='fa fa-group'><span>  Detalhes</span></i>
                            </a>

Or I show off:

<a id='colorDetail' class='btn btn-primary btn-sm'>
                                <i class='fa fa-group'><span>  Sem Detalhes</span></i>
                            </a>

How to perform the query so my code knows what to display?

Answer 1

I believe a request with a help from jQuery would help a lot.

The first step is to assign a click event to the desired element:

//Aplica o script apenas quando a página carregar
$(document).ready(function(){
  $btnBrief = $("#botaoBrief");
  $btnBrief.on("click", function(e){
    //Evita que o botão clicado faça alguma coisa exceto o que vamos orientar dentro deste método
    e.preventDefault();

    //Pegamos o ID que você precisa do elemento
    var idPost = $(this).attr("data-id");
    //Envia uma requisição POST assincrona para o script que tratará seu dado
                   //índice $_POST no PHP : var no javascript definida acima
                   //            |              |
                   //            |        ______|  Executa ao fim do script
                   //            |       |            |
                   //            |       |            |      |- Resposta
    $.post("seuscript.php", { idPost: idPost }, function(response){
       //Joga o resultado no lugar desejado. Ex. #colorDetail-container
       $("#colorDetail-container").html(response);
    } 
  });
});

The above code can be saved in a . js file or placed in HTML within <script></script>

Getting the data, your PHP script will treat idPost as you like.

seuscript.php

<?php 
  $idPost = $_POST['idPost'];

  //Faça as consultas que quiser
  //Toda sua lógica de exibir um tipo de link ou outro entra aqui

  //Ao final, decida qual saída você dará em seu script
  if($temDetalhes){
     echo "<a id='colorDetail' href='".$permalink."' class='btn btn-primary btn-sm'><i class='fa fa-group'><span>  Detalhes</span></i></a>";
  }else{
     echo "<a id='colorDetail' class='btn btn-primary btn-sm'><i class='fa fa-group'><span>  Sem Detalhes</span></i></a>";
  }

I hope I’ve helped.