-1
votes

Comment restreindre la liste déroulante JQuery et afficher uniquement des mois actuels et précédents de manière dynamique

J'essaie d'afficher uniquement le mois actuel et précédent dans la liste déroulante et voulait masquer / supprimer les autres mois de la liste déroulante. De plus, la sélection par défaut devrait être - au mois en cours

avec le code ci-dessous, je pourrais atteindre - P>

Affichage des mois en dépose li>
Sélection par défaut au mois en cours LI>

Désactiver les mois à venir li> ul>

Je cherche: p>

Sélection par défaut au mois en cours LI>

Afficher uniquement le mois précédent dans la liste déroulante LI> ul>

Quelqu'un pourrait-il aider ou guider. Merci d'avance !! p>

Code: p>

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div>
  <select id="monthsDropdown">
    <option value='1'>Janaury</option>
    <option value='2'>February</option>
    <option value='3'>March</option>
    <option value='4'>April</option>
    <option value='5'>May</option>
    <option value='6'>June</option>
    <option value='7'>July</option>
    <option value='8'>August</option>
    <option value='9'>September</option>
    <option value='10'>October</option>
    <option value='11'>November</option>
    <option value='12'>December</option>
  </select>
</div>

javascript jquery html

1 commentaires

Mise à jour du titre de la question

3 Réponses :

0
votes

Vous pouvez le faire comme ça. Code:

   

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
   <div>
     <select id="monthsDropdown">
       <option value='1'>Janaury</option>
       <option value='2'>February</option>
       <option value='3'>March</option>
       <option value='4'>April</option>
       <option value='5'>May</option>
       <option value='6'>June</option>
       <option value='7'>July</option>
       <option value='8'>August</option>
       <option value='9'>September</option>
       <option value='10'>October</option>
       <option value='11'>November</option>
       <option value='12'>December</option>
     </select>
   </div>

1 commentaires

Merci, mais le code cache juste des mois après le mois en cours. Voulait cacher tout le mois avant les mois précédents aussi

1
votes

Remplacez votre CSS code>, il va masquer tout le mois suivant xxx pré>

p>



<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div>
  <select id="monthsDropdown">
    <option value='1'>Janaury</option>
    <option value='2'>February</option>
    <option value='3'>March</option>
    <option value='4'>April</option>
    <option value='5'>May</option>
    <option value='6'>June</option>
    <option value='7'>July</option>
    <option value='8'>August</option>
    <option value='9'>September</option>
    <option value='10'>October</option>
    <option value='11'>November</option>
    <option value='12'>December</option>
  </select>
</div>

3 commentaires

Merci, mais le code cache juste des mois après le mois en cours. Voulait cacher tout le mois avant les mois précédents aussi

@Jainprince a mis à jour la réponse s'il vous plaît vérifier

Merci, cela fonctionne

1
votes

$(document).ready(function(){
 var objMonthMapping = {
  1     : 'January',
  2     :   'February',
  3     :   'March',
  4     :   'April',
  5     :   'May',
  6     :   'June',
  7     :   'July',
  8     :   'August',
  9     :   'September',
  10    :   'October',
  11    :   'November',
  12    :   'December'
};

var intCurMonth     =   new Date().getMonth() + 1;

var intPrevMonth    =   (intCurMonth - 1) ? (intCurMonth - 1) : 12;

$('<option>').val(intPrevMonth).text(objMonthMapping[intPrevMonth]).appendTo('#monthsDropdown');
$('<option>').val(intCurMonth).text(objMonthMapping[intCurMonth]).appendTo('#monthsDropdown');

$('#monthsDropdown').val(intCurMonth);
});
This is the HTML:<div>
   <select id="monthsDropdown">
   </select>
</div>These lines of code is going to provide the option of current month and the previous month only, in the dropdown.

3 commentaires

Puis-je connaître le problème avec la solution, j'ai été voté.

Parfait!! Merci @atul Kumar Singh

S'il vous plaît upvote, si vous trouvez cela utile. Merci beaucoup.