JSFiddle - React, Tailwind, and code Playground

HTML

<!-для датапикера->
<link
  rel="stylesheet"
  href="https://bazaub.ru/media/datepicker/datepicker.css"
/>
<script src="https://bazaub.ru/media/admin/js/2.2.4jquery.min.js"></script>
<script src="https://bazaub.ru/media/datepicker/datepicker.js"></script>
<!-для селекта->
<link rel="stylesheet" href="https://bazaub.ru/media/celect2/select2.min.css" />
<script src="https://bazaub.ru/media/celect2/select2.min.js"></script>
<script src="https://bazaub.ru/media/celect2/ru.js"></script>
<!-маска для телефона->
<script src="https://bazaub.ru/media/front/js/jquery.maskedinput.min.js"></script>
<script src="https://bazaub.ru/media/front/js/allmask.js"></script>

<div class="nflr">
  <form id="validform" method="POST" class="form">
    <div class="ax-form">
      <div class="dfor mrb2 mrt7">
        <div class="fo5 mmr">
          <label>Дата заезда <b>*</b></label>
          <input
            type="text"
            id="start"
            name="datazaezd"
            placeholder="Выбрать дату"
            class="inp0 ino crsp"
          />
          <i class="icon-cldat"></i>
        </div>
        <div class="fo5 mml">
          <label>Дата выезда <b>*</b></label>
          <input
            type="text"
            id="end"
            name="dataviezd"
            placeholder="Выбрать дату"
            class="inp0 ino crsp"
          />
          <i class="icon-cldat"></i>
        </div>
      </div>

      <div class="prs mrb2 tcv">Минимальный срок бронирования 5 ночей.</div>

      <div class="dfor mrb2">
        <div class="fo5 mmr">
          <label>Количество взрослых <b>*</b></label>
          <select name="kolvovzros" class="js-select2">
            <option value="1 взрослый">1 взрослый</option>
            <option value="2 взрослых" selected="selected">2 взрослых</option>
            <option value="3 взрослых">3 взрослых</option>
            <option value="4 взрослых">4 взрослых</option>
            <option value="5 взрослых">5 взрослых</option>
           ...

CSS

body {
background: #E8E6E0;
}

.nflr {
  width: 50%;
  margin: 50px auto 50px;
  padding: 30px;
background: #fff;
}
.fo5 {
width: 50%;
position: relative;
}
.mrt7{
margin-top:-7px;
}
.mml{
  margin-left: 15px;
}
.mmr{
  margin-right: 15px;
}
.mrb2{
  margin-bottom: 20px;
}
.mrtb {
  margin: 20px 0 30px 0;
}
.mrb3 {
  margin-bottom: 25px;
}
.form label {
  display: block;
padding-bottom: 5px;
font-weight: 600;
}
.form div label b {
color: #FF2525;
}
.textr,
.inp0 {
    width: 100%;
    color: #52534A;
      font-size: 14px;
      -webkit-box-sizing: border-box;
      box-sizing: border-box;
}
.inp0 {
    height: 55px;
    line-height: 55px;
  padding: 0 50px 0 20px;

}
.crsp{
    cursor: pointer;
}
.textr{
  padding: 15px 20px 15px 20px;
  height: 110px;
}
.inc {
    border: 1px solid #E8E6E0;
    background: #E8E6E0;
    -webkit-box-shadow: inset 1px 1px 10px -1px rgba(0, 0, 0, 0.1);
    box-shadow: inset 1px 1px 10px -1px rgba(0, 0, 0, 0.1);
}
.ino {
  border: 1px solid #F8D76B;
  background: #F8D76B;
}
.form input:hover,
.form input:focus,
.form textarea:hover,
.form textarea:focus {
  border: 1px solid #52534A;
}
.prs{
  height: 55px;
  padding: 0 20px 0 20px;
  border: 1px solid #E8E6E0;
  font-size: 13px;
}
.prs b{
  line-height: 14px;
  font-weight: 600;
}
.prs b strong {
color: #dd7b2a;
font-weight: 600;
}
.prs span strong {
color: #FF2525;
font-weight: 600;
}
.pr20 span strong{
font-size: 20px;
}
.pr24 span strong {
  font-size: 24px;
}
.hdpr {
  -webkit-transition: opacity 200ms linear 0ms;
  transition: opacity 200ms linear 0ms;
  opacity: 0.4;
  -moz-opacity: 0.4;
  filter: alpha(opacity=40);
}
.fot {
  height: 55px;
  position: absolute;
  bottom:0;
  left:0;
  right:0;
}
.btb {
  display: block;
  text-align: center;
  color: #fff;
  text-transform: uppercase;
  font-weight: 600;
  width: 100%;
      height: 62px;
    line-height:62px;
    background: #F1A45A;
      margin-bottom:20px;
        cursor: pointer;
}
.btb:hover {
  background:...

JavaScript

$('select').on('change', function() {
  const fixPrice = $(".fix-price").html().replace(/\./,'') //берем фикс цену
  const allday = $("#days_count").html().replace(/\./,'') //берем кол-во дней с вывода
  const totalPrice = $('#price') //передаем цену по id
  const totalNumbers = $('#kolvonomerov').val().match(/\d*/)[0] //берем значение с селекта, кол-во номеров выбрали
  let rezult = (+fixPrice * +allday * +totalNumbers).toString().replace(/(?=(\d\d\d)+([^\d]|$))/g, '.');  //плюсуем две полученные цены и получаем сумму
  
  $(totalPrice).html(rezult); //выводим полученную сумму
  $('#prs').val(rezult); //передаем сумму в импут по id, для передачи в бд
});

  //вывод в тексте кол-во номеров выбрано в celect
  $('#kolvonomerov').on('change', function() {
    const val = this.value.match(/\d*/)[0]
    $("#allnom").text(val);
  });


function toDate(fd) {
  year = +fd.split(".")[2];
  month = +fd.split(".")[1];
  day = +fd.split(".")[0];
  return new Date(year, month - 1, day);
}

var $start = $("#start"),
  $end = $("#end");
$start.datepicker({
  minDate: new Date(), //запрещает выбор прошедшей даты
  onSelect: function (fd, date) {
    var date_from = toDate(fd);
    var date_to = toDate($end.val());
    var days_count = Math.abs(date_to - date_from) / 86400000;
    if (!isNaN(days_count)) {
      $("#days_count").text(days_count);
    }
    $end.data("datepicker").update("minDate", date);
    $end.focus();
  },
});
$end.datepicker({
  onSelect: function (fd, date) {
    var date_from = toDate($start.val());
    var date_to = toDate(fd);
    debugger;
    var days_count = Math.abs(date_to - date_from) / 86400000;
    if (!isNaN(days_count)) {
      $("#days_count").text(days_count);
    }
    $start.data("datepicker").update("maxDate", date);
  },
});

$.datepicker.regional["ru"] = {
  closeText: "Закрыть",
  prevText: "Предыдущий",
  nextText: "Следующий",
  currentText: "Сегодня",
  monthNames: [
    "Январь",
    "Февраль",
    "Март",
    "Апрель",
    "Май",
 ...