Question

Я заранее прошу прощения за мой Engli sh, но я словацкий, и я также немного помог с Google Translator:)

Я надеюсь найти помощь здесь для моей проблемы ...

У меня есть кредитный калькулятор. Примеры будут приведены ниже.

Я стараюсь убедиться, что когда у меня есть калькулятор на странице domain.xx / loan , мне нужно добиться что при выборе суммы кредита, срока погашения кредита и при нажатии кнопки я хочу, чтобы страница перенаправлялась на domain.xx / request ..., где форма будет готова

. проблема в том, что я не знаю, как отправить информацию из калькулятора на вторую страницу, чтобы она была прикреплена к форме, которая будет заполнена и отправлена в БД

Надеюсь, вы понимаю мою проблему.

Я использую: Laravel и JS

$("document").ready(function() {

const rangeSliderAmount   = document.querySelector('.lc-range-slider-amount');
const rangeSliderMonth    = document.querySelector('.lc-range-slider-month');
const rangeValueBarAmount = document.querySelector('#lc-range-value-bar-amount');
const rangeValueBarMonth  = document.querySelector('#lc-range-value-bar-month');
const rangeValueAmount    = document.querySelector('#lc-range-value-amount');
const rangeValueMonth     = document.querySelector('#lc-range-value-month');
const rangeAmount         = document.getElementById("lc-amount");
const rangeMonth          = document.getElementById("lc-month");

let isDown = false;

function dragHandler() {
  isDown = !isDown;
  if (!isDown) {
    rangeValueAmount.style.setProperty('opacity', '0');
    rangeValueMonth.style.setProperty('opacity', '0');
  } else {
    rangeValueAmount.style.setProperty('opacity', '0');
    rangeValueMonth.style.setProperty('opacity', '0');
  }
}

function dragOn(e) {
  if (!isDown) return;
  rangeValueHandler();
}

function rangeValueHandler() {
  amountPercentage            = `${((rangeSliderAmount.value - 500) * 100) / (6000 - 500)}%`;
  monthPercentage             = `${((rangeSliderMonth.value - 6) * 100) / (60 - 6)}%`;
  rangeValueBarAmount.style.setProperty('width', amountPercentage);
  rangeValueBarMonth.style.setProperty('width', monthPercentage);
  rangeValueAmount.innerHTML  = `${rangeSliderAmount.value}`;
  rangeValueMonth.innerHTML   = `${rangeSliderMonth.value}`;
  rangeAmount.innerHTML       = `${rangeSliderAmount.value}`;
  rangeMonth.innerHTML        = `${rangeSliderMonth.value}`;
  vypocetSplatka();
}

rangeValueHandler();
rangeSliderAmount.addEventListener('mousedown', dragHandler);
rangeSliderAmount.addEventListener('mousemove', dragOn);
rangeSliderAmount.addEventListener('mouseup', dragHandler);
rangeSliderAmount.addEventListener('click', rangeValueHandler);
rangeSliderAmount.addEventListener('touchstart', dragHandler);
rangeSliderAmount.addEventListener('touchmove', dragOn);
rangeSliderAmount.addEventListener('touchend', dragHandler);
rangeSliderAmount.addEventListener('touchstart', rangeValueHandler);

rangeSliderMonth.addEventListener('mousedown', dragHandler);
rangeSliderMonth.addEventListener('mousemove', dragOn);
rangeSliderMonth.addEventListener('mouseup', dragHandler);
rangeSliderMonth.addEventListener('click', rangeValueHandler);
rangeSliderMonth.addEventListener('touchstart', dragHandler);
rangeSliderMonth.addEventListener('touchmove', dragOn);
rangeSliderMonth.addEventListener('touchend', dragHandler);
rangeSliderMonth.addEventListener('touchstart', rangeValueHandler);


function slideValue(inputElement) {
    var sliderElement = inputElement.closest('.lc-ranger-box').find('.slider');
    var val = parseInt(inputElement.val().replace(' ', '')) || 0;
    var sliderMax = $(sliderElement).slider('option', 'max');
    var sliderMin = $(sliderElement).slider('option', 'min');

    if (val > sliderMax) {
        val = sliderMax;
    }
    if (val < sliderMin) {
        val = sliderMin;
    }
    $(sliderElement).slider('value', val);

    val = formatNumber(val, 0, ',', ' ');
    if (inputElement.val() !== val) {
      inputElement.val(val);
    }
  }

  $('.slider-value .value').change(function(){
    slideValue($(this));
    vypocetSplatka();
  });

  vypocetSplatka();

  $('.insurance-box').on('change', 'input[name=poistenie]', function(){
    vypocetSplatka();
  });

  function formatNumber(number, decimals, dec_point, thousands_sep) {
    var str = number.toFixed(decimals ? decimals : 0).toString().split('.');
    var parts = [];
    for (var i = str[0].length; i > 0; i -= 3) {
      parts.unshift(str[0].substring(Math.max(0, i - 3), i));
    }
    str[0] = parts.join(thousands_sep ? thousands_sep : ',');
    return str.join(dec_point ? dec_point : '.');
  }

  function vypocetSplatka() {
    var mesiace = parseInt($('[data-value="months"]').html());
    var pozicka = parseInt($('[data-value="loan"]').html().replace(' ', ''));
    var poplatok = (pozicka / 100) * 2;
    $('.hascharge').show();
    if(pozicka <= -1){
        poplatok = 0;
        $('.hascharge').hide();
    }
    var benefit = 2;
    var perc, payment_mpr, payment_mpr_full, insurance, payment_month, payment_month_full, suma, suma_full, rateValue, rpmn;
    $('[data-value="charge"]').text(poplatok);
    $('[data-value="months-val"]').text(mesiace);
    $('span[data-value="loan"]').text(price_format(pozicka));
    if (pozicka <= 300) {
      perc = 15.18;
    } else if (pozicka <= 700) {
      perc = 13.9;
    } else if (pozicka <= 1499) {
      perc = 11.4;
    } else {
      perc = 8.9;
    }
    if (pozicka <= 300 && mesiace<=60 && mesiace>=6) {
      perc = 15.18;
    } else if (pozicka <= 679 && mesiace<=60 && mesiace>=6) {
      perc = 13.9;
    } else if (pozicka <= 720 && mesiace<=60 && mesiace>=6) {
      perc = 10.01;
    } else if (pozicka <= 1499 && mesiace<=60 && mesiace>=6) {
      perc = 11.4;
    } else if (mesiace<=60 && mesiace>=6) {
      perc = 8.9;
    }

    var diff = (Math.round((perc - benefit) * 100) / 100).toFixed(2);
    diff = diff.replace('.', ',');
    $('[data-value="interest"]').text(diff);

    var pmt_ir_full = perc / 1200;
    var pmt_ir = (perc - benefit) / 1200;

    //pmt_ir = 13.9 / 1200;
    var pmt_np = mesiace;
    var pmt_pv = -pozicka;

    if (pmt_np > 0 && pmt_pv < 0) {
      payment_mpr = pmt(pmt_ir, pmt_np, pmt_pv);
      payment_mpr_full = pmt(pmt_ir_full, pmt_np, pmt_pv);

      $('.insurance-label').text('');
      // poistenie
      insurance = 0;

      if ($('input[name=poistenie]:checked').val() === '1') {
        insurance += 0.081 * pozicka / 100;
        $('.insurance-label').text('vrÄ‚Ë‡tane poistenia');
      }
      if ($('input[name=poistenie]:checked').val() === '2') {
        insurance += 0.148 * pozicka / 100;
        $('.insurance-label').text('vrÄ‚Ë‡tane poistenia');
      }
      //payment_mpr += ' Ă˘â€šÂ¬';
      payment_month = rd(payment_mpr + insurance);
      payment_month_full = rd(payment_mpr_full + insurance);
      payment_mpr = rd(payment_mpr);

      suma = payment_month * mesiace + poplatok;
      suma_full = payment_month_full * mesiace + poplatok;

      $('#clientsave').html(price_format(suma_full - suma) + ' &euro;');

    } else {
      payment_mpr = '';
    }
    $('[data-value="fee"]').html(price_format(payment_month));
    $('[data-value="fee-val"]').text(price_format(payment_mpr));

    rateValue = rate(pmt_np, payment_mpr, -pozicka + poplatok);
    rpmn = (Math.pow(rateValue + 1, 12) - 1) * 100;
    $('[data-value="rpmn-val"]').text(price_format(rpmn));
    $('[data-value="sum"]').text(price_format(payment_mpr * mesiace + poplatok));

    $('#vyskaF').val(pozicka);
    $('#splatnostF').val(mesiace);
  if ($('input[name=poistenie]:checked').val() === '0') { $('#poistenieF').val("bez poistenia"); };
  if ($('input[name=poistenie]:checked').val() === '1') { $('#poistenieF').val("zÄ‚Ë‡kladnÄ‚Â©"); };
  if ($('input[name=poistenie]:checked').val() === '2') { $('#poistenieF').val("rozÄąË‡Ä‚ÂrenÄ‚Â©"); };

  //bez benefitu repre priklad *NEW 16.11:2017 -- START
  var diffWo = (Math.round((perc) * 100) / 100).toFixed(2);
  diffWo = diffWo.replace('.', ',');
  payment_mpr_full = rd(payment_mpr_full);

  var rateValue_full, rpmn_full;
  rateValue_full = rate(pmt_np, payment_mpr_full, -pozicka + poplatok);
  rpmn_full = (Math.pow(rateValue_full + 1, 12) - 1) * 100;

  $('[data-value="interest-wo"]').text(diffWo);
  $('[data-value="fee-val-wo"]').text(price_format(payment_mpr_full));
  $('[data-value="rpmn-val-wo"]').text(price_format(rpmn_full));
  $('[data-value="sum-wo"]').text(price_format(payment_mpr_full * mesiace + poplatok));
  // *NEW 16.11:2017 -- END

  }

  function rd(n) {
    var r = Math.round(n * 100) / 100;
    return r;
  }

  function price_format(number, decimals, decPoint, thousandsSep) {

    decimals = decimals || 2;
    number = parseFloat(number);

    if (!decPoint || !thousandsSep) {
      decPoint = ',';
      thousandsSep = ' ';
    }

    var roundedNumber = Math.round(Math.abs(number) * ('1e' + decimals)) + '';
    var numbersString = decimals ? roundedNumber.slice(0, decimals * -1) : roundedNumber;
    var decimalsString = decimals ? roundedNumber.slice(decimals * -1) : '';
    var formattedNumber = '';

    while (numbersString.length > 3) {
      formattedNumber += thousandsSep + numbersString.slice(-3);
      numbersString = numbersString.slice(0, -3);
    }

    return (number < 0 ? '-' : '') + numbersString + formattedNumber + (decimalsString ? (decPoint + decimalsString) : '');
  }


  //function pmt(ir, np, pv, fv = 0, type = 0) {  //defaul value nie je vsade podporovane!!! RBR
  function pmt(ir, np, pv, fv, type) {

    var fv = (typeof fv !== 'undefined') ?  fv : 0;
    var type = (typeof type !== 'undefined') ?  type : 0;

    /*
     * ir   - interest rate per month
     * np   - number of periods (months)
     * pv   - present value
     * fv   - future value
     * type - when the payments are due:
     *        0: end of the period, e.g. end of month (default)
     *        1: beginning of period
     */

    if (ir === 0) {
      return -(pv + fv) / np;
    }

    var pvif = Math.pow(1 + ir, np);
    var pmt = -ir * pv * (pvif + fv) / (pvif - 1);

    if (type === 1) {
      pmt /= (1 + ir);
    }

    return pmt;
  }

  function rate(paymentsPerYear, paymentAmount, presentValue, futureValue, dueEndOrBeginning, interest) {
    //If interest, futureValue, dueEndorBeginning was not set, set now
    if (interest == null) {
      interest = 0.01;
    }

    if (futureValue == null) {
      futureValue = 0;
    }

    if (dueEndOrBeginning == null) {
      dueEndOrBeginning = 0;

    }

    var FINANCIAL_MAX_ITERATIONS = 128; //Bet accuracy with 128
    var FINANCIAL_PRECISION = 0.0000001; //1.0e-8

    var y, y0, y1, x0, x1 = 0,
      f = 0,
      i = 0;
    var rate = interest;
    if (Math.abs(rate) < FINANCIAL_PRECISION) {
      y = presentValue * (1 + paymentsPerYear * rate) + paymentAmount * (1 + rate * dueEndOrBeginning) * paymentsPerYear + futureValue;
    } else {
      f = Math.exp(paymentsPerYear * Math.log(1 + rate));
      y = presentValue * f + paymentAmount * (1 / rate + dueEndOrBeginning) * (f - 1) + futureValue;
    }
    y0 = presentValue + paymentAmount * paymentsPerYear + futureValue;
    y1 = presentValue * f + paymentAmount * (1 / rate + dueEndOrBeginning) * (f - 1) + futureValue;

    // find root by Newton secant method
    i = x0 = 0.0;
    x1 = rate;
    while ((Math.abs(y0 - y1) > FINANCIAL_PRECISION) &&
      (i < FINANCIAL_MAX_ITERATIONS)) {
      rate = (y1 * x0 - y0 * x1) / (y1 - y0);
      x0 = x1;
      x1 = rate;

      if (Math.abs(rate) < FINANCIAL_PRECISION) {
        y = presentValue * (1 + paymentsPerYear * rate) + paymentAmount * (1 + rate * dueEndOrBeginning) * paymentsPerYear + futureValue;
      } else {
        f = Math.exp(paymentsPerYear * Math.log(1 + rate));
        y = presentValue * f + paymentAmount * (1 / rate + dueEndOrBeginning) * (f - 1) + futureValue;
      }

      y0 = y1;
      y1 = y;
      ++i;
    }
    return rate;
  }

});

/*=================================================================*/
/*                      LOAN CALCULATOR
/*=================================================================*/
.lc-wrapper {
  width: 100%;
  margin: 0 auto;
  padding: 5px 0;
  overflow: hidden;
  display: flex;
  flex-direction: row;
  border-radius: 10px;
  background: #302f4e;
}
.lc-ranger-content {
  width: 70%;
  padding: 0 10px;
}
.lc-ranger-box {
  width: 100%;
  position: relative;
  margin: 0;
  padding: 0;
}
.lc-ranger-box:first-child {
  margin-bottom: 5px;
  border-bottom: 1px solid #28263e;
}
.lc-ranger-box-top {
  width: 100%;
  padding: 7px 25px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.lc-amount {
  width: 90px;
  height: 90px;
  position: relative;
  display: block;
  padding-top: 20px;
  line-height: 30px;
  text-align: center;
  font-size: 24px;
  font-weight: 700;
  color: #FF4C60;
  font-style: normal;
  line-height: normal;
  border-radius: 50%;
  box-sizing: border-box;
  transform-origin: center center;
  border: 5px solid #5E5C7F;
  background: #F9F9FF;
}
.lc-amount::after {
  display: block;
  content: "EUR";
  font-size: 16px;
  letter-spacing: 0.07em;
  margin-top: -2px;
}
.lc-month {
  width: 90px;
  height: 90px;
  position: relative;
  display: block;
  padding-top: 20px;
  line-height: 30px;
  text-align: center;
  font-size: 24px;
  font-weight: 700;
  color: #FF4C60;
  font-style: normal;
  line-height: normal;
  border-radius: 50%;
  box-sizing: border-box;
  transform-origin: center center;
  border: 5px solid #5E5C7F;
  background: #F9F9FF;
}
.lc-month::after {
  display: block;
  content: "Mon.";
  font-size: 16px;
  letter-spacing: 0.07em;
  margin-top: -2px;
}
.lc-ranger-box-sliding {
  padding: 15px 0;
  position: relative;
}
.lc-ranger-container {
  position: relative;
  padding: 15px 0;
}

.lc-ranger-box-bottom {
  width: 100%;
  padding: 7px 25px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.lc-pyment-content {
  width: 30%;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: center;
  position: relative;
  padding: 0;
  border-left: 1px solid #28263e;
}
.lc-payment-head {
  width: 100%;
  padding: 5px;
  text-align: center;
}
.lc-payment-show {
  width: 100%;
}
.lc-payment {
  width: 200px;
  height: 200px;
  margin: 0 auto;
  padding-top: 60px;
  line-height: 60px;
  display: block;
  font-size: 36px;
  font-weight: 700;
  text-align: center;
  position: relative;
  border-radius: 100%;
  box-sizing: border-box;
  border: 5px solid #5E5C7F;
  background: #F9F9FF;
  color: #FF4C60;
}
.lc-payment::after {
  display: block;
  content: "EUR/MON.";
  font-size: 16px;
  letter-spacing: 0.07em;
  margin-top: -2px;
}
.lc-payment-btn {
  width: 100%;
  padding: 4px 0 8px 0;
  text-align: center;
}
.lc-text {
  color: #F9F9FF;
}
.representative-example {
  width: 100%;
  position: relative;
  margin: 50px 0;
  padding: 15px;
  font-size: 13px;
  color: #F9F9FF;
  border-radius: 5px;
  background: #302f4e !important;
}
.representative-example span.span-bold {
  font-weight: 500;
  color: #FF4C60;
}
.representative-example span {
  font-weight: 400;
  color: #FF4C60;
}
#lc-range-value-bar-amount {
  width: 100%;
  content: "0";
  background-color: #FF4C60;
  position: absolute;
  z-index: 100;
  height: 25px;
  top: 0;
  margin: 0;
  border-radius: 5px;
}
#lc-range-value-bar-month {
  width: 100%;
  content: "0";
  background-color: #FF4C60;
  position: absolute;
  z-index: 99;
  height: 25px;
  top: 0;
  margin: 0;
  border-radius: 5px;
}
input[type='range'] {
  width: 100%;
  cursor: pointer;
  position: absolute;
  top: 0;
  margin: 0;
  border-radius: 5px
}
input[type=range]:focus {
  outline: none;
}
input[type='range'],
input[type='range']::-webkit-slider-runnable-track,
input[type='range']::-webkit-slider-thumb {
  -webkit-appearance: none;
}
input[type='range']::-webkit-slider-runnable-track {
  width: 100%;
  height: 25px;
  cursor: pointer;
  animate: 0.2s;
  box-shadow: 0px 0px 0px #000000, 0px 0px 0px #0d0d0d;
  background: #F9F9FF;
  border-radius: 5px;
  border: 0px solid #000101;
}
input[type='range']::-webkit-slider-thumb {
  box-shadow: 0 2px 10px 0 rgba(0,0,0,0.08);
  border: 14px solid #F9F9FF;
  height: 53px;
  width: 53px;
  border-radius: 30px;
  background: #FF4C60;
  cursor: pointer;
  -webkit-appearance: none;
  margin-top: -13.5px;
  position: relative;
  z-index: 1000;
}
input[type='range']::-webkit-slider-thumb::before {
  position: absolute;
  content: '';
  height: 10px; /* equal to height of runnable track */
  width: 500px; /* make this bigger than the widest range input element */
  left: -502px; /* this should be -2px - width */
  top: 8px; /* don't change this */
  background: #777;
}
input[type=range]::-moz-range-track {
  width: 100%;
  height: 12.8px;
  cursor: pointer;
  animate: 0.2s;
  box-shadow: 0px 0px 0px #000000, 0px 0px 0px #0d0d0d;
  background: #353353;
  border-radius: 25px;
  border: 0px solid #000101;
}
input[type=range]::-moz-range-thumb {
  box-shadow: 0px 0px 0px #000000, 0px 0px 0px #0d0d0d;
  border: 0px solid #000000;
  height: 20px;
  width: 39px;
  border-radius: 7px;
  background: #000000;
  cursor: pointer;
}
input[type=range]::-ms-track {
  width: 100%;
  height: 12.8px;
  cursor: pointer;
  animate: 0.2s;
  background: transparent;
  border-color: transparent;
  border-width: 39px 0;
  color: transparent;
}
input[type=range]::-ms-fill-lower {
  background: #000;
  border: 0px solid #000101;
  border-radius: 50px;
  box-shadow: 0px 0px 0px #000000, 0px 0px 0px #0d0d0d;
}
input[type=range]::-ms-fill-upper {
  background: #000;
  border: 0px solid #000101;
  border-radius: 50px;
  box-shadow: 0px 0px 0px #000000, 0px 0px 0px #0d0d0d;
}
input[type=range]::-ms-thumb {
  box-shadow: 0px 0px 0px #000000, 0px 0px 0px #0d0d0d;
  border: 0px solid #000000;
  height: 20px;
  width: 39px;
  border-radius: 7px;
  background: #000;
  cursor: pointer;
}
/*
#range-value {
  content:"0";
  background: rgba(233, 239, 244, 0.1);;
  position: absolute;
  z-index: 10000;
  height: 25px;
  top: -65px;
  margin: 0;
  border-radius: 5px;
  left: 50%;
  transform0: translateX(-50%);
  font-size: 20px;
  padding: 12px;
  color: #41576B;
  box-shadow: 0 2px 10px 0 rgba(0,0,0,0.08);
  text-align: center;
  opacity: 0;
}*/
/*=================================================================*/
/*                     BUTTONS
/*=================================================================*/
.btn {
  border-radius: 30px;
  font-family: "Rubik", sans-serif;
  font-size: 16px;
  font-weight: 700;
  overflow: hidden;
  line-height: 1;
  padding: 12px 32px;
  position: relative;
}
.btn:focus {
  box-shadow: none;
}

.btn:focus {
  outline: 0;
}

@-webkit-keyframes button-push {
  50% {
    -webkit-transform: scale(0.8);
    transform: scale(0.8);
  }
  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}
@keyframes hvr-push {
  50% {
    -webkit-transform: scale(0.8);
    transform: scale(0.8);
  }
  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}
.btn-default {
  color: #FFF;
  background: #FF4C60;
  display: inline-block;
  vertical-align: middle;
  position: relative;
  -webkit-transform: perspective(1px) translateZ(0);
  transform: perspective(1px) translateZ(0);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
}
.btn-default:hover {
  color: #FFF;
  -webkit-animation-name: button-push;
  animation-name: button-push;
  -webkit-animation-duration: 0.3s;
  animation-duration: 0.3s;
  -webkit-animation-timing-function: linear;
  animation-timing-function: linear;
  -webkit-animation-iteration-count: 1;
  animation-iteration-count: 1;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<section class="loan bg-shadow">
        <div class="container">
            <form id="loanFormSubmit" method="get" action="{{ route('request.index') }}">
                @csrf
                <div class="container">
                    <div class="lc-wrapper shadow-main02s">
                        <div class="lc-ranger-content">
                            <div class="lc-ranger-box">
                                <div class="lc-ranger-box-top">
                                    <span class="lc-ranger-text lc-text">Choose your loan amount</span>
                                    <span id="lc-amount" class="lc-amount">6000</span>
                                </div>
                                <div class="lc-ranger-box-sliding">
                                    <div class="lc-ranger-container slider-value">
                                        <input id="lc-range-amount" type="range" class="slider lc-range-slider-amount" min="500" max="6000" step="100" value="1000">
                                        <span id="lc-range-value-bar-amount"></span>
                                        <span id="lc-range-value-amount" data-value="loan" class="value" style="display:none!important;">0</span>
                                    </div>
                                </div>
                                <div class="lc-ranger-box-bottom">
                                    <span class="lc-ranger-text lc-text">500€</span>
                                    <span class="lc-ranger-text lc-text">6000€</span>
                                </div>
                            </div>
                            <div class="lc-ranger-box">
                                <div class="lc-ranger-box-top">
                                    <span class="lc-ranger-text lc-text">Choose a maturity period</span>
                                    <span id="lc-month" class="lc-month">60</span>
                                </div>
                                <div class="lc-ranger-box-sliding">
                                    <div class="lc-ranger-container slider-value">
                                        <input id="lc-range-month" type="range" class="slider lc-range-slider-month" min="6" max="60" step="1" value="24">
                                        <span id="lc-range-value-bar-month"></span>
                                        <span id="lc-range-value-month" data-value="months" class="value" style="display:none!important;">0</span>
                                    </div>
                                </div>
                                <div class="lc-ranger-box-bottom">
                                    <span class="lc-ranger-text lc-text">6 months</span>
                                    <span class="lc-ranger-text lc-text">60 months</span>
                                </div>
                            </div>
                        </div>
                        <div class="lc-pyment-content">
                            <div class="lc-payment-head lc-text">
                                <h3>Your monthly payment</h3>
                            </div>
                            <div class="lc-payment-show">
                                <span id="lc-payment-show" class="lc-payment value " data-value="fee">
                                    0,00
                                </span>
                            </div>
                            <div class="lc-payment-btn">
                                <button type="submit" class="btn btn-default" id="accept-loan">
                                    I want a loan
                                </button>
                            </div>
                        </div>
                    </div>
                </div>
            </form>
        </div>
    </section>

Моя попытка добавлена в тело onload = "setData ()" добавлено в форму калькулятора кредита в кнопку onclick = "submitForm ()" и добавлено в JS

$(document).ready(function() {
    $("#accept-loan").click(function(e) {
        var loan = $("#lc-range-amount").val();
        var month = $("#lc-range-month").val();
        var pay = $("[data-value='fee']").html().replace(' ', '');
        var url = $("#loanFormSubmit")[0].setAttribute('action', '/request'+"?loan="+loan+"&months="+month+"&pay="+pay);
        $.ajaxSetup({
            headers: {
                'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
            }
        });
        $.ajax({
            url: url,
            method: 'post',
            type: 'post',
            data: {
                _token: '{{csrf_token()}}',
                loan: $("#loan").html(),
                month: $("#month").html(),
                pay: $("#pay").text(),
            },
            contentType: false,
            processData: false,
            success: function( data ) {
                console.log(data);
            }
        });
    });
});
function submitForm(){
    if(typeof(localStorage) != "undefined"){
        localStorage.loan = $('[data-value="loan"]').html();
        localStorage.months = $('[data-value="months"]').html();
        localStorage.payment = $('[data-value="fee"]').html();
    }
    document.getElementById("loanFormSubmit").submit();
}

function setData(){
    if(typeof(localStorage) != "undefined"){
        document.getElementById("loan").innerHTML = localStorage.loan;
        document.getElementById("month").innerHTML = localStorage.months;
        document.getElementById("pay").innerHTML = localStorage.payment;
   }
}

Кажется, все работает, так как я не должен знать, правильно ли отправлять такую информацию или это можно сделать еще лучше

Mr Khan · Answer 1 · 01 марта 2020

Привет, вы можете получить все данные, представленные в форме, используя запрос метод.

request('title') //Title is the name of the field

Я предлагаю вам перейти по этой ссылке, чтобы решить вашу проблему. Он показывает все шаги один за другим.

https://vegibit.com/how-to-set-up-form-submission-in-laravel/

Отправка данных из формы калькулятора в другую форму страницы в Laravel и JS

Пожалуйста, войдите или зарегистрируйтесь чтобы ответить на этот вопрос.

1 Ответ

Пожалуйста, войдите или зарегистрируйтесь что бы добавить комментарий.

Отправка данных из формы калькулятора в другую форму страницы в Laravel и JS

Пожалуйста, войдите или зарегистрируйтесь чтобы ответить на этот вопрос.

1 Ответ

Пожалуйста, войдите или зарегистрируйтесь что бы добавить комментарий.

Похожие темы