Select for card expiration

Question

Select for card expiration

Navigation

#1 by (0 votes)

1

I wanted to make two fields select one for the month and another for the year to use as validity dates of a card, but wanted it to be generated dynamically and that when selecting the year of 2017 for example appears only the months that are missing for to end the year that in the case on today's date would only appear December. I just made a basic html structure.

<div class="col-md-4 col-lg-4 col-sm-12 col-xs-12">
  <label>Mês</label>
   <select required ng-model="customer.monthCard">
     <option value="01">Janeiro</option>
     <option value="02">Favereiro </option>
     <option value="03">Março</option>
     <option value="04">Abril</option>
     <option value="05">Maio</option>
     <option value="06">Junho</option>
     <option value="07">Julho</option>
     <option value="08">Agosto</option>
     <option value="09">Setembro</option>
     <option value="10">Outubro</option>
     <option value="11">Novembro</option>
     <option value="12">Dezembro</option>
   </select>
</div>
<div class="col-md-3 col-lg-3 col-sm-12 col-xs-12">
  <label>Ano</label>
    <select required ng-model="customer.yearCard">
      <option value="18"> 2018</option>
      <option value="19"> 2019</option>
      <option value="20"> 2020</option>
      <option value="21"> 2021</option>
    </select>
</div>

javascript html angularjs html5

asked by anonymous 07.11.2017 / 16:51

1 answer

How to interpret Johansen test in R? [closed] Subquery returns more than 1 row MySql

score 0 · Accepted Answer

I did something that could break a branch

<div class="col-md-3 col-lg-3 col-sm-12 col-xs-12">
  <label>Ano</label>
  <select required ng-model="customer.yearCard">
    <option value="{{ano}}" ng-repeat="ano in AnosCard"> {{ano}}</option>
  </select>
</div>
<div class="col-md-4 col-lg-4 col-sm-12 col-xs-12">
   <label>Mês</label>
   <select ng-disabled="!customer.yearCard" required ng-model="customer.monthCard">
     <option value="{{mes}}" ng-repeat="mes in mesesCard">{{mes}}</option>
</select>

JavaScript

        function geraDatas(){
        var data = new Date()
        data = data.getFullYear()
        var dataFim = data + 11
        var anos = []
        for (var index = 0; data < dataFim; data++, index++) {
            anos.push(data)   
        }
        $scope.AnosCard = anos
    }()

    $scope.$watch('customer.yearCard', function(newValue) {
        console.log(newValue)
        $scope.mesesCard = []
        var anoAtual = (new Date()).getFullYear()
        console.log(newValue, anoAtual)
        if(newValue == anoAtual){
            var mesAtual = (new Date().getMonth()) + 1
            console.log(mesAtual)
            var meses = []
            for(mesAtual; mesAtual <= 12; mesAtual++){
                meses.push(mesAtual)
            }
            $scope.mesesCard = meses
        } else {
            $scope.mesesCard = [1,2,3,4,5,6,7,8,9,10,11,12]
        }
    });