Automatically generate date sequence within input

Asked

Viewed 131 times

0

How can I generate a sequence of dates and place each date inside inputs( INPUTS ALREADY EXIST INSIDE A FORM) from the initial and final date automatically?

I place the initial and final date and the script generates the date range on inputs that already exist. It is not p generate input’s. It is put the generated dates inside them. A input for each date.

TEST SCRIPT GENERATING DATE RANGE

 var dt= new Date();
 var ndt = new Date(1850,01,27);      
 var diassem = ndt.getDay();     
 var mes=ndt.getMonth();

 var meses = new Array("Janeiro","Fevereiro","março");
 var dias = new Array("Domingo","Segunda","Terça","Quarta","Quinta","Sexta","Sabado");
    for (var i = 0; i <= 10; i++) 
    {      
      var dia=ndt.getDate()+i;
      document.write(dia+"________");
      *****AQUI EU CONSIGO IMPRIMIR, MAS N CONSIGO PEGAR CADA DATA GERADA E COLOCAR NOS INPUTS DE ACORDO COM O ID DE CADA UM ( dti0, dti1, dti2....)****

    };

TEST FORM WHERE I’ll HAVE IT SAVED IN THE DATABASE

<form method="POST" action="teste.php">
 <input type="text"  name="dti0" id="dti0" autocomplete="off"/><br>
 <input type="text"  name="dti1" id="dti1" autocomplete="off"/><br>
 <input type="text"  name="dti2" id="dti2" autocomplete="off"/><br>
 <input type="text"  name="dti3" id="dti3" autocomplete="off"/><br>   
</form>

It’s kind of sketching my code. In it I can generate the sequence of dates, but I still don’t know how to put each date inside a input

javascript html jquery

  • you can use a for to generate a loop from start date to end date by making a check if the date matches the desired range so you print the input.

  • Thanks for answering. But the part about writing the value in the input is q I can’t. Can generate the sequence and print with Document.write, but I can’t assign each date to a different input. Pd guide me?

  • can post the code you generated?

  • It’s kind of cheap. Using only var year as test by enq var dt= new Date(); var ndt = new Date(1850,01,27); var diassem = ndt.getDay(); var mes=ndt.getMonth(); var months = new Array("January","February","March"); var days = new Array("Sunday","Second","Tuesday","Fourth","Fifth","Sixth","Sabbath"); for (var i = 0; i <= 10; i++) ' var dia=ndt.getDate()+i; Document.write(dia+"________"); };

  • try changing this snippet Document.write('<input type="text" value="'+dia+'" name="day">')

  • Hello Alisson. I tried to post the code but I’m new here. So I added the code I asked in the question. I hope you can understand.

  • Yes, but I can’t. I know how. I’ve tried using Document Innerhtmlid, to find the id of each input and put the generated value. But I could. I forgot to mention, but the inputs must be filled in. Pq is part of a table and I saved it in the BD>

  • i understood what you need and inside Document.write you can print html.

  • if you want to print inside a div all inputs exchange Document.write for $("#divPrincipal"). append("<input type="text" value="'+dia+'" name="day[]">");

  • I qr q if each generated date is placed within a different input. The inputs already exist, as they are part of a form that must be saved in the Database. I’m sorry for the complication;

  • I swapped the main DIV id for the id of one of the input’s. I tried to adapt your code by deleting part of it. The logic is this, but I don’t know how to do it. What is the right way to take the value and set it in input? $("#Dti"). append(value=day);

  • Place the form HTML with the inputs you want to enter the dates.

  • It’s just an example because the form is bigger. <form method="POST" action="test.php"> <input type="text" name="dti0" id="dti0" autocomplete="off"/><br> <input type="text" name="dti1" id="dti1" autocomplete="off"/><br> <input type="text" ="dti2" id="dti2" autocomplete="off"off""/><br> <input type="text" name="dti3" id="dti3" autocomplete="off"/><br> </form> . P each input of this, I want to put a date generated by the array.

  • But what would be the format of the date? Your for says <= 10; but only has 4 inputs, will generate error.

  • You’re right. But I did test p code n to get too big, as example msm. Pd adopt the for only with 4 msm. And the n format matters now. My difficulty is in putting the generated values inside each input. Vc pd help me?

  • Thank you so much for your attention. You helped so much msm. Thank you. Leo Caraciolo

  • Okay, I’ll put it in answer

Show 12 more comments

1 answer

0


The method toLocaleDateString() returns a string with the representation of part of the date based on the language.

var start = new Date("1850,01,27");

var options = { weekday: 'long', year: 'numeric', month: 'long', day: 'numeric' };

document.getElementById("dti0").value =start.toLocaleDateString('pt-BR',options);

for (var i = 1; i <= 10; i++) 
{
   //estabelece um intervalo entre as datas    
   var newDate = start.setDate(start.getDate() + 3);
   start = new Date(newDate);
   //coloca as datas nos inputs
   document.getElementById("dti"+i).value =start.toLocaleDateString('pt-BR', options);
}
<input type="text"  name="dti0" id="dti0" autocomplete="off" size="51"/><br>
<input type="text"  name="dti1" id="dti1" autocomplete="off" size="51"/><br>
<input type="text"  name="dti2" id="dti2" autocomplete="off" size="51"/><br>
<input type="text"  name="dti3" id="dti3" autocomplete="off" size="51"/><br>
<input type="text"  name="dti3" id="dti4" autocomplete="off" size="51"/><br>
<input type="text"  name="dti3" id="dti5" autocomplete="off" size="51"/><br>
<input type="text"  name="dti3" id="dti6" autocomplete="off" size="51"/><br>
<input type="text"  name="dti3" id="dti7" autocomplete="off" size="51"/><br>
<input type="text"  name="dti3" id="dti8" autocomplete="off" size="51"/><br>
<input type="text"  name="dti3" id="dti9" autocomplete="off" size="51"/><br>
<input type="text"  name="dti3" id="dti10" autocomplete="off" size="51"/><br>

  • Thanks, but it worked out.

Browser other questions tagged javascript html jquery

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