[英]My variables aren't passing to the function
更新:Ali 帮助我填充了值,但现在的问题是它每次都从数组中的最后一个游戏选项中提取数据。 我需要点击游戏并显示该游戏的信息。 我已经在下面更新了我的代码。
原文:我正在尝试修复一个包含用于搜索附近游戏并显示结果的表单的页面。 结果显示后,我需要能够单击结果以在弹出窗口 window 中显示每个游戏的信息。
它目前使用表单的默认值来填充弹出窗口,例如,在我更改搜索表单的时间之前,每个俱乐部都会显示 6.15 作为时间,在这种情况下,他们都会将该时间显示为比赛时间弹出窗口。
这是用于显示游戏的代码:
<div class="game-search-result-outer pop-profile-view pop-profile-view1">
<ul>
<?php $src_game = '';
if(!empty($game_lists)){
foreach($game_lists as $glist){
if($glist->count_golfer_join < $glist->golfer){
?>
<li class="game<?=$glist->id?>" onclick="getGameValue('<?=$glist->id?>','<?=$glist->club_name?>','<?=$src_game?>','<?=$glist->handicap_min?>','<?=$glist->handicap_max?>','<?= date("d/m/Y",strtotime($glist->start_date))?>');">
<a href="#" data-id="<?=$glist->id?>">
<div class="club-img">
<img src="<?=$src_game?>">
</div>
<h3><?=$glist->club_name?> <br> <?= date("d/m/Y",strtotime($glist->start_date))?> at <?= date("G:i a",strtotime($glist->start_time))?> <br> Handicap between <?=$glist->handicap_min?> and <?=$glist->handicap_max?></h3>
</a>
<input type="hidden" name="start_date<?=$glist->id?>" id="start_date<?=$glist->id?>" value="<?= date("d/m/Y",strtotime($glist->start_date))?>">
</li>
<?php }
} }else{ echo "No Games Available, please refine your search" ;} ?>
</ul>
</div>
Onclick,它激活这个 function:
<script>
function getGameValue(game_id,club_name,src,handicap_min,handicap_max) {
var golf_handicap = '<?=$USERDETAILS->golf_handicap?>';
var start_date = $("#start_date"+game_id).val();
//var start_date = '<?= date("d/m/Y",strtotime($glist->start_date))?>';
var play_against = $("#play_against option:selected").text();
var start_time = '<?= date("G:i a",strtotime($glist->start_time))?>';
var handicap1 = $("#handicap1").val();
var gofer = $("input[name='golfer']:checked").val();
var handicapRange1 = handicap_min;
var handicapRange2 = handicap_max;
var p = $('.game'+game_id+' > h3');
if(golf_handicap<handicapRange1 || golf_handicap>handicapRange2){
alert("Unfortunately you cannot join this game, your handicap "+golf_handicap+" is not within the handicap range.");
document.location.reload();
return false
}
var data ='<div class="result-pop-box-img"><img src="'+src+'"></div><div class="result-pop-box-text"><h3>'+club_name+'</h3><p class="game<?=$glist->id?>">Hi <?=$USERDETAILS->first_name?>, you\’re about to join a game at '+club_name+' on '+ start_date +' at '+ start_time +' for '+ gofer +' golfers playing against '+ play_against +' with a handicap between '+ handicap1 +'. If this is correct, click the “Confirm” button. If you want to edit your booking, click cancel</p></div>';
$("#getGameValueID").html(data);
}
</script>
感谢您的任何帮助。
更新
这是表单的代码:
<form>
<div class="form-control">
<label>Location
<?php $zip = ($USERDETAILS->s_address)?', '.$USERDETAILS->zip:''.$USERDETAILS->zip;
$location = $USERDETAILS->s_address.$zip; ?>
<span class="loc-icon"><input type="text" name="location" class="icon-input" id="location" value="<?=$location?>"></span>
</label>
</div>
<div class="form-control">
<label>Date
<span class="cal-icon">
<div>
<!--<input type="text" id="datepicker" name="start_date">-->
<input type="date" id="start_date2" name="start_date2" value="<?php if($_GET['start_date2']){echo $_GET['start_date2'];}else { echo date("Y-m-d",strtotime('+1 day', time()));} ?>" min="<?=date("Y-m-d",strtotime('+1 day', time()))?>" max="<?=date("Y-m-d",strtotime('+1 year', time()))?>">
</div>
</span>
<!--<input type="text" name="date" class="icon-input"></span>-->
</label>
</div>
<div class="golfer-select">
<div class="form-control">
<label>Golfers</label>
<?php if($_GET['golfer']==1) $gcheck = 'checked';
elseif($_GET['golfer']==2) $gcheck2 = 'checked';
elseif($_GET['golfer']==3) $gcheck3 = 'checked';
?>
<div class="x3">
<label>
<input type="radio" name="golfer" value="1" <?=$gcheck?>>
<span>1</span>
</label>
</div>
<div class="x3">
<label>
<input type="radio" name="golfer" value="2" <?=$gcheck2?>>
<span>2</span>
</label>
</div>
<div class="x3">
<label>
<input type="radio" name="golfer" value="3" <?=$gcheck3?>>
<span>3</span>
</label>
</div>
</div>
</div>
<div class="form-control">
<label>Play Againts</label>
<select name="play_against" id="play_against">
<?php foreach($categories as $cate){
if($_GET['play_against']==$cate->id) {
$csel = 'selected';
}else{ $csel = ''; }
?>
<option value="<?=$cate->id?>"<?=$csel?>><?=$cate->name?></option>
<?php } ?>
</select>
</div>
<div class="form-control">
<div class="time-range">
<label>Start Time</label>
<div class="range range-step range-step-popup">
<input value="1" type="range" max="60" min="0" step="1" list="ticks2" onclick="getTimeValue();">
<datalist id="ticks2">
<?php $minute=00; $counter=0;
for($start_time=06;$start_time<21;){
if($minute>45){
$minute = 00;
$start_time++;
}?>
<option value="<?=$counter?>"><?=$start_time?>.<?=$minute?></option>
<?php
$counter++;
$minute= $minute+15;
}?>
</datalist>
<output id="get_range" class="__range-output-square"></output>
</div>
<input type="text" name="start_time" id="start_time">
<script>
function getTimeValue() {
var range_val = document.getElementById('get_range').innerHTML;
document.getElementById('start_time').value=range_val;
}
</script>
</div>
</div>
<div class="form-control">
<div class="dis-range">
<label>Distance (in miles)</label>
<div class="range range-step range-step-popup">
<?php $dist_val = array(0,5,10,15,20,25,30,35,40,50,60,75,100,125,150,200,300,500,1000,2000,3000,5000,10000);
if(in_array($_GET['distance'],$dist_val)){
$key_val = array_search ($_GET['distance'], $dist_val);
$sel_dist_key = $key_val;
}else{
$sel_dist_key = 15;
} ?>
<input value="<?=$sel_dist_key?>" type="range" max="22" min="0" step="1" list="ticks3" onclick="getValue();">
<datalist id="ticks3">
<option value="0">0</option>
<option value="1">5</option>
<option value="2">10</option>
<option value="3">15</option>
<option value="4">20</option>
<option value="5">25</option>
<option value="6">30</option>
<option value="7">35</option>
<option value="8">40</option>
<option value="9">50</option>
<option value="10">60</option>
<option value="11">75</option>
<option value="12">100</option>
<option value="13">125</option>
<option value="14">150</option>
<option value="15">200</option>
<option value="16">300</option>
<option value="17">500</option>
<option value="18">1000</option>
<option value="19">2000</option>
<option value="20">3000</option>
<option value="21">5000</option>
<option value="22">10000</option>
</datalist>
<output id="get_distance" class="__range-output-square"></output>
</div>
<input type="hidden" name="distance" id="distance" value="">
<script>
function getValue() {
var range_val = document.getElementById('get_distance').innerHTML;
document.getElementById('distance').value=range_val;
}
</script>
</div>
</div>
<div class="form-control">
<div class="handi-range">
<label>Handicap</label>
<section class="range-slider range range-step range-step-popup">
<span class="rangeValues"></span>
<input value="0" min="0" max="54" step="1" type="range">
<input value="54" min="1" max="54" step="1" type="range">
<datalist class="in-dots" id="">
<?php for ($handcap=0;$handcap<=54;$handcap++){
echo '<option value="'.$handcap.'">'.$handcap.'</option>';
} ?>
</datalist>
</section>
<input type="hidden" name="handicap" id="handicap1">
</div>
</div>
<div class="sp20"></div>
<input type="submit" name="search" value="Search" class="green-btn-arrow" onclick="getInfo();">
<!--<button class="green-btn-arrow">Search</button>-->
</form>
给每一个li添加一个class属性;
<?php
...
<!-- add class to li based on glist_id so you can access to each element in the getGameValue function-->
<li class="game<?=$glist->id?>" onclick="getGameValue('<?=$glist->id?>','<?=$glist->club_name?>','<?=$src_game?>','<?=$glist->handicap_min?>','<?=$glist->handicap_max?>','<?= date("d/m/Y",strtotime($glist->start_date))?>', '<?= date("G:i a",strtotime($glist->start_time))?>');">
现在在你的 function
function getGameValue(game_id,club_name,src,handicap_min,handicap_max, start_date, start_time) {
// remove these lines and add them to inputs
// var start_date = '<?= date("d/m/Y",strtotime($glist->start_date))?>';
// var start_time = '<?= date("G:i a",strtotime($glist->start_time))?>';
// get h3 element
var h3 = $('.game'+game_id+' > h3');
// change the h3 innetHtml like here
}
除此之外,您可以使用 getGameValue function 中的信息做任何您想做的事情。
更新: Ali 帮助我获得了填充值,但现在的问题是它每次都从数组中的最后一个游戏选项中提取数据。 我需要单击游戏并显示该游戏的信息。 我在下面更新了我的代码。
原文:我正在尝试修复一个页面,该页面包含一个表单来搜索附近的游戏并显示结果。 显示结果后,我需要能够单击结果以在弹出窗口 window 中显示每个游戏的信息。
它目前正在使用表单的默认值来填充弹出窗口,例如,每个俱乐部将显示 6.15 作为时间,直到我更改搜索表单的时间,在这种情况下,它们都将显示该时间作为比赛时间弹出。
这是用于显示游戏的代码:
<div class="game-search-result-outer pop-profile-view pop-profile-view1">
<ul>
<?php $src_game = '';
if(!empty($game_lists)){
foreach($game_lists as $glist){
if($glist->count_golfer_join < $glist->golfer){
?>
<li class="game<?=$glist->id?>" onclick="getGameValue('<?=$glist->id?>','<?=$glist->club_name?>','<?=$src_game?>','<?=$glist->handicap_min?>','<?=$glist->handicap_max?>','<?= date("d/m/Y",strtotime($glist->start_date))?>');">
<a href="#" data-id="<?=$glist->id?>">
<div class="club-img">
<img src="<?=$src_game?>">
</div>
<h3><?=$glist->club_name?> <br> <?= date("d/m/Y",strtotime($glist->start_date))?> at <?= date("G:i a",strtotime($glist->start_time))?> <br> Handicap between <?=$glist->handicap_min?> and <?=$glist->handicap_max?></h3>
</a>
<input type="hidden" name="start_date<?=$glist->id?>" id="start_date<?=$glist->id?>" value="<?= date("d/m/Y",strtotime($glist->start_date))?>">
</li>
<?php }
} }else{ echo "No Games Available, please refine your search" ;} ?>
</ul>
</div>
Onclick,它激活这个 function:
<script>
function getGameValue(game_id,club_name,src,handicap_min,handicap_max) {
var golf_handicap = '<?=$USERDETAILS->golf_handicap?>';
var start_date = $("#start_date"+game_id).val();
//var start_date = '<?= date("d/m/Y",strtotime($glist->start_date))?>';
var play_against = $("#play_against option:selected").text();
var start_time = '<?= date("G:i a",strtotime($glist->start_time))?>';
var handicap1 = $("#handicap1").val();
var gofer = $("input[name='golfer']:checked").val();
var handicapRange1 = handicap_min;
var handicapRange2 = handicap_max;
var p = $('.game'+game_id+' > h3');
if(golf_handicap<handicapRange1 || golf_handicap>handicapRange2){
alert("Unfortunately you cannot join this game, your handicap "+golf_handicap+" is not within the handicap range.");
document.location.reload();
return false
}
var data ='<div class="result-pop-box-img"><img src="'+src+'"></div><div class="result-pop-box-text"><h3>'+club_name+'</h3><p class="game<?=$glist->id?>">Hi <?=$USERDETAILS->first_name?>, you\’re about to join a game at '+club_name+' on '+ start_date +' at '+ start_time +' for '+ gofer +' golfers playing against '+ play_against +' with a handicap between '+ handicap1 +'. If this is correct, click the “Confirm” button. If you want to edit your booking, click cancel</p></div>';
$("#getGameValueID").html(data);
}
</script>
感谢您的任何帮助。
更新
这是表单的代码:
<form>
<div class="form-control">
<label>Location
<?php $zip = ($USERDETAILS->s_address)?', '.$USERDETAILS->zip:''.$USERDETAILS->zip;
$location = $USERDETAILS->s_address.$zip; ?>
<span class="loc-icon"><input type="text" name="location" class="icon-input" id="location" value="<?=$location?>"></span>
</label>
</div>
<div class="form-control">
<label>Date
<span class="cal-icon">
<div>
<!--<input type="text" id="datepicker" name="start_date">-->
<input type="date" id="start_date2" name="start_date2" value="<?php if($_GET['start_date2']){echo $_GET['start_date2'];}else { echo date("Y-m-d",strtotime('+1 day', time()));} ?>" min="<?=date("Y-m-d",strtotime('+1 day', time()))?>" max="<?=date("Y-m-d",strtotime('+1 year', time()))?>">
</div>
</span>
<!--<input type="text" name="date" class="icon-input"></span>-->
</label>
</div>
<div class="golfer-select">
<div class="form-control">
<label>Golfers</label>
<?php if($_GET['golfer']==1) $gcheck = 'checked';
elseif($_GET['golfer']==2) $gcheck2 = 'checked';
elseif($_GET['golfer']==3) $gcheck3 = 'checked';
?>
<div class="x3">
<label>
<input type="radio" name="golfer" value="1" <?=$gcheck?>>
<span>1</span>
</label>
</div>
<div class="x3">
<label>
<input type="radio" name="golfer" value="2" <?=$gcheck2?>>
<span>2</span>
</label>
</div>
<div class="x3">
<label>
<input type="radio" name="golfer" value="3" <?=$gcheck3?>>
<span>3</span>
</label>
</div>
</div>
</div>
<div class="form-control">
<label>Play Againts</label>
<select name="play_against" id="play_against">
<?php foreach($categories as $cate){
if($_GET['play_against']==$cate->id) {
$csel = 'selected';
}else{ $csel = ''; }
?>
<option value="<?=$cate->id?>"<?=$csel?>><?=$cate->name?></option>
<?php } ?>
</select>
</div>
<div class="form-control">
<div class="time-range">
<label>Start Time</label>
<div class="range range-step range-step-popup">
<input value="1" type="range" max="60" min="0" step="1" list="ticks2" onclick="getTimeValue();">
<datalist id="ticks2">
<?php $minute=00; $counter=0;
for($start_time=06;$start_time<21;){
if($minute>45){
$minute = 00;
$start_time++;
}?>
<option value="<?=$counter?>"><?=$start_time?>.<?=$minute?></option>
<?php
$counter++;
$minute= $minute+15;
}?>
</datalist>
<output id="get_range" class="__range-output-square"></output>
</div>
<input type="text" name="start_time" id="start_time">
<script>
function getTimeValue() {
var range_val = document.getElementById('get_range').innerHTML;
document.getElementById('start_time').value=range_val;
}
</script>
</div>
</div>
<div class="form-control">
<div class="dis-range">
<label>Distance (in miles)</label>
<div class="range range-step range-step-popup">
<?php $dist_val = array(0,5,10,15,20,25,30,35,40,50,60,75,100,125,150,200,300,500,1000,2000,3000,5000,10000);
if(in_array($_GET['distance'],$dist_val)){
$key_val = array_search ($_GET['distance'], $dist_val);
$sel_dist_key = $key_val;
}else{
$sel_dist_key = 15;
} ?>
<input value="<?=$sel_dist_key?>" type="range" max="22" min="0" step="1" list="ticks3" onclick="getValue();">
<datalist id="ticks3">
<option value="0">0</option>
<option value="1">5</option>
<option value="2">10</option>
<option value="3">15</option>
<option value="4">20</option>
<option value="5">25</option>
<option value="6">30</option>
<option value="7">35</option>
<option value="8">40</option>
<option value="9">50</option>
<option value="10">60</option>
<option value="11">75</option>
<option value="12">100</option>
<option value="13">125</option>
<option value="14">150</option>
<option value="15">200</option>
<option value="16">300</option>
<option value="17">500</option>
<option value="18">1000</option>
<option value="19">2000</option>
<option value="20">3000</option>
<option value="21">5000</option>
<option value="22">10000</option>
</datalist>
<output id="get_distance" class="__range-output-square"></output>
</div>
<input type="hidden" name="distance" id="distance" value="">
<script>
function getValue() {
var range_val = document.getElementById('get_distance').innerHTML;
document.getElementById('distance').value=range_val;
}
</script>
</div>
</div>
<div class="form-control">
<div class="handi-range">
<label>Handicap</label>
<section class="range-slider range range-step range-step-popup">
<span class="rangeValues"></span>
<input value="0" min="0" max="54" step="1" type="range">
<input value="54" min="1" max="54" step="1" type="range">
<datalist class="in-dots" id="">
<?php for ($handcap=0;$handcap<=54;$handcap++){
echo '<option value="'.$handcap.'">'.$handcap.'</option>';
} ?>
</datalist>
</section>
<input type="hidden" name="handicap" id="handicap1">
</div>
</div>
<div class="sp20"></div>
<input type="submit" name="search" value="Search" class="green-btn-arrow" onclick="getInfo();">
<!--<button class="green-btn-arrow">Search</button>-->
</form>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.