Problems using the switch on JS

Asked

Viewed 334 times

1

Hey, guys, I got a problem I don’t know how to fix. I this I want to change the number of a month by the month name like this : ( 2/2013 for February/2013 ). In the code below I am making him list in chronological order by month/year. And I’d like to know how I can change the number of the month now by the name of what matches it.

=======HTML=====

<p>Tarefa colocar em ordem cronológica ( Mes/Ano)</p>
<div class="galeria">                 
<a href="#122014" data-order="2014-12" rel="12/2014/4">12/2014</a>
<a href="#12015"  data-order="2054-01" rel="1/2015/4">1/2015</a>
<a href="#112014" data-order="2014-11" rel="11/2014/4">11/2014</a>
<a href="#102014" data-order="2013-2" rel="2/2013/4">2/2013</a> 
</div>

=======JS======

$(document).ready(function(){
    var $sort = $('a');
    var $list = $('.galeria');
    var $listLi = $('a',$list);
    $listLi.sort(function(a, b){
        var keyA = $(a).attr('data-order');
        var keyB = $(b).attr('data-order');
        return (keyA > keyB) ? 1 : 0;
    });
    $.each($listLi, function(index, row){
        $list.append(row);
    });

function trocarNomeMes(mes) {
    switch ( mes ) {
        case 1: mes = "Janeiro";
        break;                

        case 2: mes = "Fevereiro";
        break;

        case 3: mes = "Março";
        break;

        case 4: mes = "Abril";
        break;

        case 5: mes = "Maio";
        break;

        case 6: mes = "Junho";
        break;

        case 7: mes = "Julho";
        break;

        case 8: mes = "Agosto";
        break;

        case 9: mes = "Setembro";
        break;

        case 10: mes = "Outubro";
        break;

        case 11: mes = "Novembro";
        break;

        case 12: mes = "Dezembro";
        break;
    }
    return mes;
}

});

LINK JSFIDDLE: https://jsfiddle.net/websmallville/2yk8mwh3/1/

Where am I going wrong..?!?

1 answer

1


You can separate the date into 2 pieces, and reassemble the contents like this inserir a descrição da imagem aqui

$(document).ready(function(){
    var $sort = $('a');
    var $list = $('.galeria');
    var $listLi = $('a',$list);
    $listLi.sort(function(a, b){
        var keyA = $(a).attr('data-order');
        var keyB = $(b).attr('data-order');
        return (keyA > keyB) ? 1 : 0;
    });
    $.each($listLi, function(index, row){
        var dataslice  = $(row).text().split("/");
        $(row).text(trocarNomeMes(dataslice[0])+"/"+dataslice[1]);
        $list.append(row);
    });
    
    function trocarNomeMes(mes) {
        switch ( mes ) {
            case "1": mes = "Janeiro";
            break;                

            case "2": mes = "Fevereiro";
            break;

            case "3": mes = "Março";
            break;

            case "4": mes = "Abril";
            break;

            case "5": mes = "Maio";
            break;

            case "6": mes = "Junho";
            break;

            case "7": mes = "Julho";
            break;

            case "8": mes = "Agosto";
            break;

            case "9": mes = "Setembro";
            break;

            case "10": mes = "Outubro";
            break;

            case "11": mes = "Novembro";
            break;

            case "12": mes = "Dezembro";
            break;
        }
        return mes;
    }
    
});

    
.galeria a {
    margin-right: 5px;
    padding: 4px;
    border-radius: 2px;
    font-size: 14px      
    list-style: none;
    text-decoration: none;
    display: block;
    float: left;    
    color: #fff;
    background-color: #F07C6C;
}
.galeria a:hover {
    background-color: #62707A;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<p>Tarefa colocar em ordem cronológica ( Mes/Ano)</p>
<div class="galeria">                 
<a href="#122014" data-order="2014-12" rel="12/2014/4">12/2014</a>
<a href="#12015"  data-order="2054-01" rel="1/2015/4">1/2015</a>
<a href="#112014" data-order="2014-11" rel="11/2014/4">11/2014</a>
<a href="#102014" data-order="2013-2" rel="2/2013/4">2/2013</a> 
</div>

jsfiddle

On the switch you are using a variable to store the value to then return, you could do this directly.

switch ( mes ) {
            case "1": return "Janeiro";
            break;                

            case "2": return "Fevereiro";
            break;

            case "3":return"Março";
            break;

            case "4": return "Abril";
            break;

            case "5": return "Maio";
            break;

            case "6":return "Junho";
            break;

            case "7": return "Julho";
            break;

            case "8": return "Agosto";
            break;

            case "9": return "Setembro";
            break;

            case "10": return  "Outubro";
            break;

            case "11":return ovembro";
            break;

            case "12": return  "Dezembro";
            break;
        }
  • Thanks Isvaldo for the help and explanation. D

Browser other questions tagged

You are not signed in. Login or sign up in order to post.