1

Preciso de ajuda para fazer um botão de avançar e voltar o mês de uma lista de aniversariantes. Os dados serão enviados via POST para uma classe que faz a consulta. A parte do PHP está ok. Preciso adaptar o JavaScript.

PHP

$data = date('Y-m-d');

$data_explode = explode("-", $data);

$dia = $data_explode[2];
$mes = $data_explode[1];
$ano = $data_explode[0];


$v_mes = substr($mes, 0, 2); //voltar mes
$novo_mes = (int) $mes - 1; //avancar mes


$botoes_mes = '<div class="medium-2 columns float-left">
                    <a id="#action-aniver" rel="' . $v_mes . '"><i class="fi-arrow-left"></i></a></div>
                   <div class="medium-8 columns float-center">
                      <h4 class="text-center">' . $mes . '</h4>
                   </div>
                   <div class="medium-2 columns">
                     <a id="#action-aniver" rel="' . $novo_mes . '"><i class="fi-arrow-right float-right"></i></a>
                   </div>';

Classe Ajax:

case 'aniversario':

$char = $_POST['val'];
$body = '';

$dados = connection::select("SELECT * from aniversarios where MONTH(data_usuario) = '" . $char . "'");

foreach ($dados as $reg) {

         $body .= '<p>' . $reg['nome'] . '</p>';

}

retorno = $body;


break;

JavaScript

$('#action-aniver').click(function () {
        var chars = (this.value);
        $.post(URL + 'Ajax/aniversario', {val: chars}, function (busca) {
            $('#aniver-ajax').html(busca);
        });
    });
2
  • Qual é o problema que você está tendo?
    – BrTkCa
    Commented 10/11/2016 às 13:21
  • Não funciona o código. Na verdade eu tentei fazer. Mas não consegui. Acredito que o problema seja na função do javascript Commented 10/11/2016 às 13:23

1 Resposta 1

2

Você precisa adaptar algumas coisas em seu código, mas mais importante que resolver esse único problema, é você entender melhor os conceitos de client-side e server-side, pois claramente você misturou algumas coisas que são impossíveis de acontecer utilizando essas linguagens. Mas vamos ao que interessa, faça as seguintes adaptações:

HTML

<div class="medium-2 columns float-left">
    <a id="#action-aniver-prev">
        <i class="fi-arrow-left"></i>
    </a>
</div>
<div class="medium-8 columns float-center">
    <h4 class="text-center" id="month"></h4>
    <div id="aniver-ajax">
    </div>
</div>
<div class="medium-2 columns">
    <a id="#action-aniver-next">
        <i class="fi-arrow-right float-right"></i>
    </a>
</div>
<input type="hidden" name="current-month" value="0"/>

JavaScript

    function changeMonth(month){
       var months = [
           "JAN",
           "FEV",
           "MAR",
           "ABR",
           "MAI",
           "JUN",
           "JUL",
           "AGO",
           "SET",
           "OUT",
           "NOV",
           "DEZ"
       ]; 

       $("#month").html(months[month-1]);
    }

    $(function(){
        $('#action-aniver-next').click(function () {
            var chars = $('[name="current-month"]').val();
            chars++;
            if(chars > 12)
                chars = 1;

            changeMonth(chars);

            $('[name="current-month"]').val(chars);

            $.post(URL + 'Ajax/aniversario', {val: chars}, function (busca) {
                $('#aniver-ajax').html(busca);
            });
        });

        $('#action-aniver-prev').click(function () {
            var chars = $('[name="current-month"]').val();
            chars--;
            if(chars < 1)
                chars = 12;

            changeMonth(chars);

            $('[name="current-month"]').val(chars);

            $.post(URL + 'Ajax/aniversario', {val: chars}, function (busca) {
                $('#aniver-ajax').html(busca);
            });
        });

        $('#action-aniver-next').trigger('click');
    });
8
  • Funcionou certinho cara. Muito obrigado. Commented 10/11/2016 às 15:40
  • Como posso colocar o nome dos meses? Commented 10/11/2016 às 15:58
  • Creio que isso resolva Commented 10/11/2016 às 16:34
  • Parou de voltar o meses, só avança Commented 10/11/2016 às 17:00
  • Quando clico no botão voltar, ele avança Commented 10/11/2016 às 17:00

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .