我正在做机票预订项目，当我点击添加乘客按钮时，它显示姓名，年龄和性别选项，这是通过javscript和jquery，但当刷新页面时，这个添加的部分消失了，而且在存储数据到数据库中没有问题。
<script>
$(document).ready(function(){
var i=1;
$('#add').click(function(){
i++;
$('#a').append('<tr id="row'+i+'"> <th><input type="text" name="pname[]" placeholder="Name" class="form-control name_list" /></th><th ><input type="number" name="age[]" placeholder="Age" class="form-control name_list" /></th><th scope=""><select class="form-control" id="gender[]" name="gender[]" placeholder="gender" width=""><option value="" disabled selected></option> <option>Male</option> <option>Female</option></select></th><th><button type="button" name="remove" id="'+i+'" class="btn btn-danger btn_remove">X</button></th></tr>');
});
$(document).on('click', '.btn_remove', function(){
var button_id = $(this).attr("id");
$('#row'+button_id+'').remove();
});
});
</script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<label for="No.of Children">Passenger Details</label><button type="button" class="btn btn-primary btn-sm" id="add" style="margin-left:170px">Add Passenger</button>
<table class="table table-secondary" id="a" name="a">
<thead>
<tr class="table-default">
<th scope="col-lg-15">
<? if(isset($pname)): // Name set? ?>
<? foreach($pname as $item): // Loop through all previous posted items ?>
<?php echo form_input(['type'=>'text','name'=>'pname[]','value'=>'','class'=>'form-control','id'=>'pname','placeholder'=>'Name','value'=>set_value('pname[]')]); ?>
<?php echo form_error('pname[]'); ?>
<? endforeach; ?>
<? else: ?>
<? endif; ?>
</th>
<th scope="col-lg-15">
<? if(isset($age)): // Name set? ?>
<? foreach($age as $item): ?>
<?php echo form_input(['type'=>'number','name'=>'age[]','class'=>'form-control','id'=>'age','placeholder'=>'Age','value'=>set_value('age[]')]); ?>
<?php echo form_error('age[]'); ?>
<? endforeach; ?>
<? else: ?>
<? endif; ?>
</th>
<th scope="col-lg-15">
<? if(isset($gender)): // Name set? ?>
<? foreach($gender as $item): // Loop through all previous posted items ?>
<select class="form-control" id="gender[]" name="gender[]" placeholder="Gender" >
<option>Male</option>
<option>Female</option>
</select>
<? endforeach; ?>
<? else: ?>
<? endif; ?>
</th>
</tr>
</thead>
</table>
控制器
public function reserve_train($train_id)
{
$this->load->model('user_model');
$this->form_validation->set_rules('pname[]', 'Passenger Name', 'required');
$this->form_validation->set_rules('age[]', 'Age', 'required');
$this->form_validation->set_rules('gender[]', 'Gender', 'required');
$this->form_validation->set_rules('train_id', 'Train ID', 'required');
$this->form_validation->set_rules('origin', 'Origin', 'required');
$this->form_validation->set_rules('destination', 'Destination', 'required');
$this->form_validation->set_rules('date', 'Date', 'required');
$this->form_validation->set_rules('arrivaltime', 'ArrivalTime', 'required');
$this->form_validation->set_rules('departuretime', 'DepartureTime', 'required');
$this->form_validation->set_rules('class', 'Class', 'required');
$this->form_validation->set_rules('price', 'Price', 'required');
$this->form_validation->set_rules('ano', 'No.of Adults', 'required|max_length[1]');
$this->form_validation->set_rules('cno', 'No.of Children', 'required|max_length[1]');
$this->form_validation->set_rules('tamount', 'Total Amount', 'required');
$this->form_validation->set_rules('cardno', 'Card Number', 'required|min_length[16]|max_length[16]');
$this->form_validation->set_rules('noc', 'Name on card', 'required|trim|alpha_numeric_spaces');
$this->form_validation->set_rules('month', 'Month', 'required');
$this->form_validation->set_rules('year', 'Year', 'required');
$this->form_validation->set_rules('cardtype', 'Card Type', 'required');
$this->form_validation->set_rules('cvv', 'CVV', 'required|min_length[3]|max_length[3]');
$this->form_validation->set_error_delimiters('<p class="text-danger">','</p>');$data=$this->user_model->fetchdata($this->session->userdata('passenger_id'));
if($this->form_validation->run()){
// $data=$this->input->post();
//if($this->input->post()){
$pname=implode(", ", $this->input->post('pname[]'));
$age=implode(", ", $this->input->post('age[]'));
$gender=implode(",", $this->input->post('gender[]'));
$data= array(
'pname[]'=> $pname ,
'age[]'=>$age ,
'gender[]'=> $gender,
'train_id'=>$this->input->post('train_id'),
'origin'=>$this->input->post('origin'),
'destination'=>$this->input->post('destination'),
'date'=>$this->input->post('date'),
'arrivaltime'=>$this->input->post('arrivaltime'),
'departuretime'=>$this->input->post('departuretime'),
'class'=>$this->input->post('class'),
'price'=>$this->input->post('price'),
'ano'=>$this->input->post('ano'),
'cno'=>$this->input->post('cno'),
'tamount'=>$this->input->post('tamount'),
'cardno'=>$this->input->post('cardno'),
'noc'=>$this->input->post('noc'),
'month'=>$this->input->post('month'),
'year'=>$this->input->post('year'),
'cardtype'=>$this->input->post('cardtype'),
'cvv'=>$this->input->post('cvv'),
);
$this->load->model('user_model');
if($this->user_model->reserve($data,$train_id)){
$this->session->set_flashdata('message','Train booked successfully');
return redirect("user/dashboard");
}
else{
$this->session->set_flashdata('message','Failed to Book Train');
}return redirect("user/reserve/{$train_id}");
}else{
$this->reserve($train_id);
}
}
你可以把数据保存在localStorage上。
例如，你可以在本地存储上保存数据。https:/scrimba.comccZa6qA6
你需要将这些信息存储在本地存储或通过API存储在后台那里。刷新页面总是会破坏动态添加的内容。