доступ к переменным JavaScript в laravel - PullRequest
0 голосов
/ 25 июня 2018

Я застрял в проблеме проекта Laravel.У меня есть страница билета, которая отображает название автобуса, пункт назначения автобуса, стоимость билета из таблиц транспортных средств базы данных.Помимо этого есть шаблон бронирования билетов, выполненный на JavaScript, который подсчитывает количество и количество мест, а также дает значение количества и выбранного места и этой страницы.Что я хочу сделать, это взять эти два значения из переменной JavaScript и передать их в базу данных таблицы заказов, как и другое значение таблицы транспортных средств, которые отображаются.Я хочу, чтобы значения var str и var rTotal отправлялись в базу данных вместе с другими переменными, которые отправляются с использованием скрытых полей формы снимок экрана внешнего интерфейса

@extends ('layouts.app')
@section('content')
 <div id="all">
      <div id="content">
        <div class="container">
          <div class="row bar">
            <div class="col-lg-9">
              <div id="productMain" class="row">
                <div class="col-md-9 col-sm-6">
                   <div class="plane">
  <div class="cockpit">
    <h1>Please select a seat</h1>
  </div>
  <div class="exit exit--front fuselage">   
  </div>
   <form id="frmCareer" method="get" action="prjFormEvent.js">
    <strong><label id="lblRealistic">"R" Section</label></strong>   
<div id="realisticTotal"></div>
<a href="#" onclick="getValue();return false;">Get Value</a>
  <ol class="cabin fuselage">
    <li class="row row--1">
      <ol class="seats" type="A">
        <li class="seat">
          <input type="checkbox" name="chkRealistic" onclick="getRealistic()" class="checks" value="1A" id="1A" />
          <label for="1A">1A</label>
        </li>
        <li class="seat">
          <input type="checkbox" name="chkRealistic" onclick="getRealistic()" class="checks" value="1B" id="1B" />
          <label for="1B">1B</label>
        </li>
        <li class="seat">
          <input type="checkbox" name="chkRealistic" onclick="getRealistic()" class="checks" value="1C" id="1C" />
          <label for="1C">1C</label>
        </li>
        <li class="seat">
          <input type="checkbox"name="chkRealistic" onclick="getRealistic()" class="checks" value="1D" disabled id="1D" />
          <label for="1D">Occupied</label>
        </li>
        <li class="seat">
          <input type="checkbox" name="chkRealistic" onclick="getRealistic()" class="checks" value="1E" id="1E" />
          <label for="1E">1E</label>
        </li>
        <li class="seat">
          <input type="checkbox" name="chkRealistic" onclick="getRealistic()" class="checks" value="1F" id="1F" />
          <label for="1F">1F</label>
        </li>
      </ol>
    </li>
  </ol>
  <div class="exit exit--back fuselage">

  </div>
</div>
        <script>
            function getValue() {

                var checks = document.getElementsByClassName('checks');
                var str = '';

                for ( i = 0; i < 6; i++) {

                    if ( checks[i].checked === true ) {
                        str += checks[i].value + " ";
                    }

                }
                document.getElementById("lblRealfisti").innerHTML = str

            }
var getCareer = new Array();
getCareer["1A"] = 1;
getCareer["1B"] = 1;
getCareer["1C"] = 1;
getCareer["1D"] = 1;
getCareer["1E"] = 1;
getCareer["1F"] = 1;

function getRealistic()
{
    var rTotal = 0;

    var selectedRealistic = document.forms["frmCareer"]["chkRealistic"];

    for (var sel = 0; sel < selectedRealistic.length; sel++)
    {
      if (selectedRealistic[sel].checked)    
          rTotal += getCareer[selectedRealistic[sel].value]        
    }      
    document.getElementById("lblRealistic").innerHTML = rTotal+ "/9 Checked"
}
        </script>
     </div>
                <div class="col-md-3 col-sm-6">
                  <div class="box">
                                          <div class="sizes">
                                            <form>
                                                  <h3>{{$product->name}}</h3>
                        <h3>{{$product->departure}}</h3>
                        <h3>{{$product->destination}}</h3>
                        <h3>{{$product->date_arrival}}</h3>
                        <h3>{{$product->price}}</h3>
                        <h3>{{$product->description}}</h3>
                        <strong><label id="lblRealisti"></label></strong>                     
                      </div>
                      <p class="price">{{$product->price}}</p>
                      <p class="text-center">
                        <form action="{{route('cart.store')}}" method="post">
                              {{ csrf_field() }}                    
                          <input type="hidden" name="id" value="{{$product->id}}">
                          <input type="hidden" name="name" value="{{$product->name}}">
                          <input type="hidden" name="price" value="{{$product->price}}">
                          <input type="hidden" name="price" value="{{$product->seats}}">                     
                  <button type="submit">click me</button>
                       </form>
                      </p>

                  </div>
                  <div data-slider-id="1" class="owl-thumbs">
                    <button class="owl-thumb-item"><img src="img/detailsquare.jpg" alt="" class="img-fluid"></button>
                    <button class="owl-thumb-item"><img src="img/detailsquare2.jpg" alt="" class="img-fluid"></button>
                    <button class="owl-thumb-item"><img src="img/detailsquare3.jpg" alt="" class="img-fluid"></button>
                  </div>
                </div>
              </div>  
              <div id="product-social" class="box social text-center mb-5 mt-5">
                <h4 class="heading-light">Show it to your friends</h4>
                <ul class="social list-inline">
                  <li class="list-inline-item"><a href="#" data-animate-hover="pulse" class="external facebook"><i class="fa fa-facebook"></i></a></li>
                  <li class="list-inline-item"><a href="#" data-animate-hover="pulse" class="external gplus"><i class="fa fa-google-plus"></i></a></li>
                  <li class="list-inline-item"><a href="#" data-animate-hover="pulse" class="external twitter"><i class="fa fa-twitter"></i></a></li>
                  <li class="list-inline-item"><a href="#" data-animate-hover="pulse" class="email"><i class="fa fa-envelope"></i></a></li>
                </ul>
              </div>           
             <div class="container">
      <div class="container hotelbook-section">
      <div class="section-padding"></div>
        <div class="section-header">
          <h3>Book your seat</h3>
          <span>We're gonna dreams come true</span>
        </div>
            <div class="row text-center">
 @foreach($mightAlsoLike as $product)
    <div class="col-lg-3 col-md-6 mb-4">
          <div class="card">
            <img class="card-img-top" src="/img/projects/new/bus1.jpeg" alt="">
            <div class="card-body">
              <h4 class="card-title"><img src="/img/line-chart.png" alt="">&nbsp; {{ $product->departure }}</h4>
              <h4 class="card-title"><img src="/img/line-chart.png" alt="">&nbsp;{{ $product->destination }}</h4>
              <h4 class="card-title"><img src="/img/line-chart.png" alt="">&nbsp;{{ $product->date_arrival}}</h4>
              <p class="card-text"><img src="/img/coins.png" alt="">RS&nbsp;{{ $product->price }}</p>
            </div>
            <div class="card-footer">
              <a href="#" class="btn btn-primary">Book Me</a>
            </div>
          </div>
        </div>

 @endforeach 
</div>
            </div>
          </div>
        </div>
      </div>
    </div>
    @endsection

1 Ответ

0 голосов
/ 25 июня 2018

Добавьте два скрытых поля в форму:

 <input type="hidden" id="str" name="str" value=""> 
 <input type="hidden" id="rTotal" name="rTotal" value=""> 

Затем в ваших getValue и getRealistic функциях установите значение полей:

document.getElementById('str').value = str;
document.getElementById('rTotal').value = rTotal;

Таким образом, вы получите такие функции, как:

function getValue() {
  var checks = document.getElementsByClassName('checks');
  var str = '';
  for ( i = 0; i < 6; i++) {
    if ( checks[i].checked === true ) {
       str += checks[i].value + " ";
    }
  }
  document.getElementById("lblRealfisti").innerHTML = str
  document.getElementById('str').value = str;
}


function getRealistic() {
  var rTotal = 0;
  var selectedRealistic = document.forms["frmCareer"]["chkRealistic"];
  for (var sel = 0; sel < selectedRealistic.length; sel++) {
    if (selectedRealistic[sel].checked)    
      rTotal += getCareer[selectedRealistic[sel].value]        
    }      
  }
  document.getElementById("lblRealistic").innerHTML = rTotal+ "/9 Checked"
  document.getElementById('rTotal').value = rTotal;
}
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...