我陷入了 laravel 项目的一个问题。我有一个票务页面,显示数据库车辆表中的巴士名称、巴士目的地、票值(value)。除此之外,还有一个用 JavaScript 制作的订票模板,用于计算数量和座位,并给出计数值和所选座位以及该页面。我想要做的是从 JavaScript 变量中获取这两个值,并将它们传递到订单表的数据库,就像显示的车辆表的其他值一样。我希望 var str 和 var rTotal 的值与使用 screen shot of front end 形式的隐藏字段发送的其他变量一起发送到数据库中
@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=""> {{ $product->departure }}</h4>
<h4 class="card-title"><img src="/img/line-chart.png" alt=""> {{ $product->destination }}</h4>
<h4 class="card-title"><img src="/img/line-chart.png" alt=""> {{ $product->date_arrival}}</h4>
<p class="card-text"><img src="/img/coins.png" alt="">RS {{ $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
最佳答案
将两个隐藏字段添加到您的表单中:
<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;
}
关于javascript - 在 Laravel 中访问 JavaScript 变量,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/51028814/