如何使用 Datatables 提交表单
How to submit form with Datatables
我使用 Datatables 提交调查问卷的答案。每个问题都在新页面中,下一个问题可通过 "Next" 按钮查看。我只想有一个提交按钮,它必须出现在所有问题的末尾。在我的代码中,它位于 table 下并且始终可见。我最大的问题是这个提交按钮只在数据库中插入最后一个问题,而不是所有问题。
你能帮帮我吗? :)
我的观点是:
<html>
<head>
<link rel="stylesheet" href="//cdn.datatables.net/1.10.5/css/jquery.dataTables.min.css" type="text/css" />
<script src="//code.jquery.com/jquery-1.11.0.min.js"></script>
<script src="//cdn.datatables.net/1.10.5/js/jquery.dataTables.min.js"></script>
<script>
$(document).ready(function() {
$('#example').dataTable( {
"pagingType": "simple",
"lengthMenu": [[1], [1]],
"bSort": false,
"language": {
"paginate": {
"previous": true
}
}
} );
} );
</script>
</head>
<body>
<?php
echo form_open('index/survey_fill/' .$survey_id ); ?>
<table id="example" >
<thead>
<tr><th>Question</th></tr>
</thead>
<tbody>
<?php
echo validation_errors();
foreach ($survey as $row)
{
?>
<tr>
<td>
<?php echo "$row->question"; ?><br/>
<?php echo "<input type='hidden' name='question_id' value='$row->question_id' />"; ?>
$data=array(
'name' => 'answer['.$row->question_id.']',
'value' => '5'
);
echo form_radio($data);
echo " 5 ";
$data=array(
'name' => 'answer['.$row->question_id.']',
'value' => ' 4'
);
echo form_radio($data);
echo " 4";
</td></tr>
<?php
}
?>
</tbody>
</table>
<?php echo "<input type='hidden' name='question_id' value='$row->question_id' />"; ?>
<input type="submit" id="button" name = "submit" value="Submit" class="btn btn-success">
</form>
</div>
</body>
</html>
我的模型是:
public function survey_fill()
{
$answers=($this->input->post('answer'));
if (null !==($this->input->post('submit'))) {
$date = new DateTime("now");
foreach($answers as $question_id=>$answer)
{
$data = array(
'user_id'=>$this->session->userdata['user_id'],
'question_id'=>$question_id,
'answer'=>$answer,
'created_at'=>$date->format('Y-m-d H:i:s')
);
$this->db->insert('survey_answers', $data);
}
if($this->db->affected_rows() > 0)
{
return true;
}
return false;
}
}
我认为数据tables 对于您正在尝试做的事情来说实在是太过分了。就个人而言,我会在一组 div 中输出它,并使用 jQuery 切换来做一个简单的前后类型按钮,这样可以减少很多开销。还有非常低开销的分页解决方案就足够了。请记住,datatables 不仅重新格式化 table,而且它还有一个载入的 API 调用的百科全书,加上它所拥有的数据模型。 show/hide 类型测试需要很多。
无论如何,解决方案非常简单。用 <form>
标签包裹你的容器(不管它是什么,datatable 或 div)。将提交按钮放在末尾,然后通过您想要的任何方式 show/hide 或 enable/disable 。 Datatables 有一个 API 调用可以告诉您当前页面,您可以关闭它以启用您的按钮。由于按钮将在您关闭 <form>
之前,它将自动提交。
或者,您可以将容器包装在表单中,构建一个 jQuery .on('click')
事件来序列化表单并在需要时通过 Ajax 提交。如果你走这条路,关键是 preventDefault()
所以表格不会像 html 表格的标准那样自动提交。
我使用 Datatables 提交调查问卷的答案。每个问题都在新页面中,下一个问题可通过 "Next" 按钮查看。我只想有一个提交按钮,它必须出现在所有问题的末尾。在我的代码中,它位于 table 下并且始终可见。我最大的问题是这个提交按钮只在数据库中插入最后一个问题,而不是所有问题。 你能帮帮我吗? :) 我的观点是:
<html>
<head>
<link rel="stylesheet" href="//cdn.datatables.net/1.10.5/css/jquery.dataTables.min.css" type="text/css" />
<script src="//code.jquery.com/jquery-1.11.0.min.js"></script>
<script src="//cdn.datatables.net/1.10.5/js/jquery.dataTables.min.js"></script>
<script>
$(document).ready(function() {
$('#example').dataTable( {
"pagingType": "simple",
"lengthMenu": [[1], [1]],
"bSort": false,
"language": {
"paginate": {
"previous": true
}
}
} );
} );
</script>
</head>
<body>
<?php
echo form_open('index/survey_fill/' .$survey_id ); ?>
<table id="example" >
<thead>
<tr><th>Question</th></tr>
</thead>
<tbody>
<?php
echo validation_errors();
foreach ($survey as $row)
{
?>
<tr>
<td>
<?php echo "$row->question"; ?><br/>
<?php echo "<input type='hidden' name='question_id' value='$row->question_id' />"; ?>
$data=array(
'name' => 'answer['.$row->question_id.']',
'value' => '5'
);
echo form_radio($data);
echo " 5 ";
$data=array(
'name' => 'answer['.$row->question_id.']',
'value' => ' 4'
);
echo form_radio($data);
echo " 4";
</td></tr>
<?php
}
?>
</tbody>
</table>
<?php echo "<input type='hidden' name='question_id' value='$row->question_id' />"; ?>
<input type="submit" id="button" name = "submit" value="Submit" class="btn btn-success">
</form>
</div>
</body>
</html>
我的模型是:
public function survey_fill()
{
$answers=($this->input->post('answer'));
if (null !==($this->input->post('submit'))) {
$date = new DateTime("now");
foreach($answers as $question_id=>$answer)
{
$data = array(
'user_id'=>$this->session->userdata['user_id'],
'question_id'=>$question_id,
'answer'=>$answer,
'created_at'=>$date->format('Y-m-d H:i:s')
);
$this->db->insert('survey_answers', $data);
}
if($this->db->affected_rows() > 0)
{
return true;
}
return false;
}
}
我认为数据tables 对于您正在尝试做的事情来说实在是太过分了。就个人而言,我会在一组 div 中输出它,并使用 jQuery 切换来做一个简单的前后类型按钮,这样可以减少很多开销。还有非常低开销的分页解决方案就足够了。请记住,datatables 不仅重新格式化 table,而且它还有一个载入的 API 调用的百科全书,加上它所拥有的数据模型。 show/hide 类型测试需要很多。
无论如何,解决方案非常简单。用 <form>
标签包裹你的容器(不管它是什么,datatable 或 div)。将提交按钮放在末尾,然后通过您想要的任何方式 show/hide 或 enable/disable 。 Datatables 有一个 API 调用可以告诉您当前页面,您可以关闭它以启用您的按钮。由于按钮将在您关闭 <form>
之前,它将自动提交。
或者,您可以将容器包装在表单中,构建一个 jQuery .on('click')
事件来序列化表单并在需要时通过 Ajax 提交。如果你走这条路,关键是 preventDefault()
所以表格不会像 html 表格的标准那样自动提交。