Business
Jobs
  • About Us
  • Solutions
    • Job Postings
      Post your job and receive qualified candidates in 48h.
    • Candidate Assessments
      500+ technical and psychological tests, plus anti-fraud.
    • Headhunting
      Tailor-made executive search from start to finish.
    • Payroll + EOR
      Payroll dispersal and EOR across 15+ LATAM countries.
  • Pricing
  • Jobs

0

270
Views
¿Cómo cambiar el marcador de posición de jQuery datepicker a dos semanas a partir de la fecha actual?

Quiero actualizar el marcador de posición de la entrada "Fin" (id="datepicker2) a la fecha 2 semanas después de la fecha de inicio (id=datepicker). Hasta ahora, solo se actualiza el valor de la fecha de finalización cuando el usuario selecciona una nueva fecha de inicio del calendario. En el caso de que el usuario deje la fecha de inicio predeterminada, quiero que vea la fecha de finalización también, no " en 2 semanas ".

HTML

 <form class="reminderControls"> <label for="startDate">Start:</label> <!-- START DATE --> <div class="dateParent"> <input type="text" id="datepicker" value=""> </div> </form> <form class="reminderControls"> <label for="endDate">End:</label> <!-- END DATE--> <div class="dateParent2"> <input type="text" id="datepicker2" value="" placeholder="in 2 weeks"> </div> </form>

JQUERY

 $(function () { $('.dateParent').datepicker({ inline: true, altField: '#datepicker', onSelect: function () { var selectedDate = $('.dateParent').datepicker('getDate'); var endDate = new Date(selectedDate); endDate.setDate(endDate.getDate() + 14); var endDateStr = (endDate.getMonth() + 1) + '/' + endDate.getDate() + '/' + (endDate.getYear() + 1900); $('#datepicker2').val(endDateStr); //changes value of end date } }); $('#datepicker').focus(function (event) { event.preventDefault(); $('.ui-datepicker').addClass('shown'); return false; }); $(document).click(function (event) { if (!$(event.target).is('.dateParent *')) $('.ui-datepicker').removeClass('shown');; }); });

ESTADO PREDETERMINADO (FECHA DE INICIO ES FECHA ACTUAL)

ingrese la descripción de la imagen aquí

DESPUÉS DE QUE EL USUARIO SELECCIONA UNA FECHA DIFERENTE

ingrese la descripción de la imagen aquí

about 4 years ago · Juan Pablo Isaza
1 answers
Answer question

0

Probé el código que publicaste y parece funcionar. Hice algunos cambios menores que tal vez quieras considerar.

 $(function() { $('.dateParent').datepicker({ inline: true, altField: '#datepicker', onSelect: function(dt, obj) { var selectedDate = $('.dateParent').datepicker('getDate'); var endDate = new Date(selectedDate); endDate.setDate(endDate.getDate() + 14); // changes placeholder of end date $('#datepicker2').attr("placeholder", $.datepicker.formatDate("mm/dd/yy", endDate)); } }); $('#datepicker').focus(function(event) { event.preventDefault(); $('.ui-datepicker').addClass('shown'); return false; }); $(document).click(function(event) { if (!$(event.target).is('.dateParent *')) $('.ui-datepicker').removeClass('shown');; }); });
 <link rel="stylesheet" href="//code.jquery.com/ui/1.13.1/themes/base/jquery-ui.css"> <script src="https://code.jquery.com/jquery-3.6.0.js"></script> <script src="https://code.jquery.com/ui/1.13.1/jquery-ui.js"></script> <form class="reminderControls"> <label for="startDate">Start:</label> <!-- START DATE --> <div class="dateParent"> <input type="text" id="datepicker" value=""> </div> </form> <form class="reminderControls"> <label for="endDate">End:</label> <!-- END DATE--> <div class="dateParent2"> <input type="text" id="datepicker2" value="" placeholder="in 2 weeks"> </div> </form>

about 4 years ago · Juan Pablo Isaza Report
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post vacancy Pricing Sales
Legal
Terms and conditions Privacy policy
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Show me some job opportunities
There's an error!