Greetings Tell me how having 2 fields of arrival and county date you can calculate the amount. At the moment, the amount of the day is unloaded from the base, it is necessary in real-time when choosing dates to make a calculation. Those.

<label for="dtarrive">Дата заезда</label> <input type="date" class="form-control" id="dtarrive" name="dtarrive"/> <label for="dtdepart">Дата выезда</label> <input type="date" class="form-control" id="dtdepart" name="dtdepart"/> <label for="price">Цена за 1 день</label> <input type="hidden" class="form-control" id="price" name="price" value="{$val.price}" /> <input type="text" class="form-control" value="{$val.price}" disabled />

 <label for="price">Итоговая цена</label> ?????
  • Where will the amount be written? - L. Vadim
  • In <label for = "price"> Total price </ label> <input type = "text" ..... disabled /> Then it will go to the base - Den

2 answers 2

How can I remove the choice of the date that passed?

If I understood correctly, then you need to hide the date selection field from the user after he (the user) entered the value.

If this is not true, then clarify the question and I will rewrite the answer, and if this is correct, here it is necessary to supplement the action on the event of changing the date field

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script> <label for="dtarrive">Дата заезда <input type="date" class="form-control" id="dtarrive" name="dtarrive"/> </label> <label for="dtdepart">Дата выезда <input type="date" class="form-control" id="dtdepart" name="dtdepart"/> </label> <label for="price">Цена за 1 день</label> <input type="hidden" class="form-control" id="price" name="price" value="10000" /> <input type="text" class="form-control" value="10000" disabled /> <label for="price">Итоговая цена</label><span id="cost"></span> <script> var dtarrive=0, dtdepart=0, price=$('#price').val(); $('#dtarrive,#dtdepart').change(function(){ dtarrive=$('#dtarrive').val(); dtdepart=$('#dtdepart').val(); if(dtarrive) $('label[for="dtarrive"]').fadeOut(); if(dtdepart) $('label[for="dtdepart"]').fadeOut(); if(dtarrive && dtdepart ) { //для I-7 //dtarrive=new Date(dtarrive.replace(/(\d+)-(\d+)-(\d+)/, '$2/$3/$1')); dtarrive=new Date(dtarrive); dtdepart=new Date(dtdepart); var cost=Math.round((dtdepart-dtarrive)/1000/3600/24)*price; $('#cost').text(cost); } }); </script>

As you can see here the html structure has been changed to make it easier to access hidden elements and a couple of lines have been added to the script.

  • or if (dtarrive) $ ('# dtarrive'). attr ('disabled', 'disabled'); if (dtdepart) $ ('# dtdepart'). attr ('disabled', 'disabled'); - Mcile
  • if you want to hide the choice not at the cost of hiding the field, but at the price of hiding the possibility of choice - Mcile

If I understood correctly, the user enters the arrival date and departure date while on the page and as soon as he entered both dates, it is necessary for him to output the total amount.

If this is not true, then clarify the question and I will rewrite the answer, and if this is correct, then there is a work with dates

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script> <label for="dtarrive">Дата заезда</label> <input type="date" class="form-control" id="dtarrive" name="dtarrive"/> <label for="dtdepart">Дата выезда</label> <input type="date" class="form-control" id="dtdepart" name="dtdepart"/> <label for="price">Цена за 1 день</label> <input type="hidden" class="form-control" id="price" name="price" value="10000" /> <input type="text" class="form-control" value="10000" disabled /> <label for="price">Итоговая цена</label><span id="cost"></span> <script> var dtarrive=0, dtdepart=0, price=$('#price').val(); $('#dtarrive,#dtdepart').change(function(){ dtarrive=$('#dtarrive').val(); dtdepart=$('#dtdepart').val(); if(dtarrive && dtdepart ) { //для I-7 //dtarrive=new Date(dtarrive.replace(/(\d+)-(\d+)-(\d+)/, '$2/$3/$1')); dtarrive=new Date(dtarrive); dtdepart=new Date(dtdepart); var cost=Math.round((dtdepart-dtarrive)/1000/3600/24)*price; $('#cost').text(cost); } }); </script>

as you can see for clarity, I substituted the cost of the day 10,000 and connected the jquery library to quickly access the elements, also added the output to the span

  • Perfectly detailed and understandable! Thank you, another question: how can I remove the choice of the date that passed? - Den