好的，挑战相对较小，但它是一只在我头上嗡嗡作响的苍蝇。在 jQuery 中查看 $("#list_total"+table_number).text("$"+grand_total[table_number].toFixed(2));
我试图做的是 grand_total[table_number] += sub_total; 但我不断得到NaN。
CSS
.guest_table
{
float:left;
position: relative;
margin-left: 30px;
width: 280px;
}
h1
{
text-align: center;
}
table
{
margin-left: auto;
margin-right: auto;
width: 425px;
}
table, tr
{
border: 5px solid black;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
border-radius: 10px; /* future proofing */
-khtml-border-radius: 10px; /* for old Konqueror browsers */
}
tr
{
height: 65px;
}
.submit
{
text-align: center;
}
.input
{
border: none;
background: #fff url(../images/rounded-corner.png) no-repeat left top;
background-size:185px 37px;
width: 160px;
padding: 10px;
}
.input:focus
{
background-color: #ffff33 ;
}
#submit_form
{
border: 50px;
padding: 10px;
margin-left: auto;
margin-right: auto;
}
.error
{
text-align: center;
color: red;
font-size: 20px;
margin-bottom: 20px;
background-color: yellow;
width: 25%;
margin-left: auto;
margin-right: auto;
}
.list_total
{
display: inline-block;
padding-left: 5px;
}
#option_list
{
width: 25%;
}
#already_paid
{
text-align: center;
}
input[type=submit]:hover,input[type=reset]:hover
{
background-color: #8F5B00;
color: white;
}
button, input[type=submit]
{
margin-left: 10px;
}
button:hover
{
background-color: #8F5B00;
color: white;
}
Codeigniter 视图
<?php echo validation_errors(); ?>
<?php
$total_guests = count($results);
$attributes = array(
'id' => 'submit_form'
);
echo form_open('main/form_validation/options');
?>
<div id="center">
<?php
foreach ($results as $result) {
?>
<table class="guest_table" id="guest_<?php echo $result->id; ?>">
<th>
<?php echo $result->full_name; ?>
</th>
<tr id="option_list">
<td>
<?php
$b = $price2 > 0 ? " $" . $price2 : "N/A";
$day = array(
array(
'name' => 'friday_performance_' . $result->id,
'id' => 'friday_performance' . $result->id,
'value' => 'friday_performance'
),
array(
'name' => 'friday_banquet_' . $result->id,
'id' => 'friday_banquet' . $result->id,
'value' => 'friday_banquet'
),
array(
'name' => 'saturday_' . $result->id,
'id' => 'saturday' . $result->id,
'value' => 'saturday'
),
);
$meal_pref = array(
array(
'name' => 'meal_' . $result->id,
'id' => 'chicken',
'value' => 'chicken'
),
array(
'name' => 'meal_' . $result->id,
'id' => 'fish',
'value' => 'fish'
),
array(
'name' => 'meal_' . $result->id,
'id' => 'vegetarian',
'value' => 'vegetarian'
),
);
echo form_checkbox($day[0]);
?>
Friday Performance <?php echo " $" . $price1; ?><br>
<?php echo form_checkbox($day[1]);
?> Friday Banquet <?php echo $b; ?><br>
<div class="meal_choice" id='meal_choice<?php echo $result->id; ? >'>
<?php
echo form_radio($meal_pref[0]);
?> Chicken <br>
<?php echo form_radio($meal_pref[1]);
?> Fish <br>
<?php echo form_radio($meal_pref[2]);
?> Vegetarian<br>
</div>
<?php echo form_checkbox($day[2]); ?> Saturday Workshop w/lunch <?php echo " $" . $price3; ?><br>
<br><br>
</td>
</tr>
<tr>
<td>
Total:<div class="list_total" id="list_total<?php echo $result->id; ?>"></div>
</td>
</table>
<?php } ?>
</div>
<div class="submit">
<?php
echo ("<input type='hidden' name='email' value=" . $this->session->userdata('email') . ">");
$data = array(
'name' => 'submit',
'id' => 'submit',
'value' => 'Complete Form',
'type' => 'submit'
);
echo form_submit($data);
echo form_button('exit', 'Exit');
?>
</div>
<?php
echo form_close();
?>
jQuery
<script>
$(document).ready(function(){
$(".list_total").text("$0.00");
$(".meal_choice").hide();
var total_attending = (<?php echo $total_guests; ?> + 1);
$("[name='exit']").click(function(){
window.location.href='<?php echo base_url(); ?>/main/logout';
});
var table_number = 0;
$('.guest_table').click(function(){
var table_id = $(this).attr('id');
table_number = parseInt(table_id.charAt(table_id.length-1));
});
var grand_total=[];
grand_total[table_number]=0.00;
$(':checkbox').change(function(){
switch($(this).attr('id'))
{
case 'friday_performance' + table_number:
var sub_total= 0.00;
sub_total = parseInt(friday_performance());
grand_total[table_number] += sub_total;
$("#list_total"+table_number).text("$"+ grand_total[table_number].toFixed(2));
break;
case 'friday_banquet' + table_number:
var sub_total= 0.00;
sub_total = parseInt(friday_banquet());
grand_total[table_number] += sub_total;
$("#list_total"+table_number).text("$"+ grand_total[table_number].toFixed(2));
break;
case 'saturday' + table_number:
var sub_total= 0.00;
sub_total += parseInt(saturday());
grand_total[table_number] = sub_total;
$("#list_total"+table_number).text("$"+ grand_total[table_number].toFixed(2));
break;
}
});
function friday_performance ()
{
if ( $("#friday_performance"+table_number).is(":checked"))
{
var price1 = <?php echo $price1; ?>;
return price1;
}else if ( $("#friday_performance"+table_number).not(":checked"))
{
var price1 = 0;
return price1;
}
}
function friday_banquet ()
{
if ($("#friday_banquet"+table_number).is(":checked"))
{
$("#meal_choice"+table_number).show("slow");
var price2 = <?php echo $price2; ?>;
return price2;
}else if ($("#friday_banquet"+table_number).not(":checked"))
{
$("#meal_choice"+table_number).hide("slow");
$('input:radio').prop("checked",false);
var price2 = 0;
return price2;
}
}
function saturday()
{
if ( $("#saturday"+table_number).is(":checked"))
{
var price3 = <?php echo $price3; ?>;
return price3;
}else if ( $("#saturday"+table_number).not(":checked"))
{
var price3 = 0;
return price3;
}
}
$("#submit").click(function(){
alert("Got it!");
});
});
</script>