问题是我无法让表(bootstrap-table
)在注册完成后更新数据。我试图通过JS来做,但没有成功。我尝试了以下内容:
JS
$.post($form.attr('action'), $form.serialize(), function (result) {
if (result.status == "true") {
$(location).attr('href', result.acao.url);
} else {
$('#cargo').formValidation('resetForm', true)
$('#cadastroCargo').modal('hide')
//ATTEMPT REFRESH BOOTSTRAP-TABLE:
$('#teste').bootstrapTable('refresh')
}
}, 'json');
HTML / PHP
<button class="btn btn-primary pull-right btn-import-user btn-sm" data-toggle="modal" data-target="#cadastroCargo">Novo Cadastro</button>
<!-- Modal -->
<div class="modal fade" id="cadastroCargo" tabindex="-1" data-keyboard="false" data-backdrop="static" role="dialog" aria-labelledby="cargoLabel">
<div class="modal-dialog" role="document">
<div class="modal-content">
<form id="cargo" action="Cargo/inserir" method="POST" enctype="multipart/form-data" autocomplete="off">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
<h4 class="modal-title" id="cargoLabel">Cadastrar Cargo</h4>
</div>
<div class="modal-body">
<fieldset>
<div class="form-group">
<label class="modal-font-body control-label">Informe o Cargo</label>
<input name="titulo" type="text" class="form-control input-sm" id="titulo" data-minlength="4" size="35" value="<?= @$cargo->titulo ?>" data-error="Por favor, preencha este campo corretamente!" required>
<input type="hidden" name="id" value="<?= @$cargo->id ?>">
<input type="reset" id="configreset" value="reset" hidden>
</div>
<div id="mensagemSucesso" class="alert alert-success alerta-sucesso" hidden></div>
</fieldset>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Fechar</button>
<input type="submit" id="salvar" value="Salvar" name="salvar" class="btn btn-primary">
</div>
</form>
</div>
</div>
</div>
<table id="teste" name="teste" class="table table-striped" data-toggle="table" data-search="true" data-show-refresh="true" data-show-columns="true"
<thead>
<tr>
<th class="th-small" data-align="left" data-sortable="true">ID</th>
<th data-align="left" data-sortable="true">Nome</th>
<th class="th-small">Ações</th>
</tr>
</thead>
<tbody>
<?php
foreach ($cargo as $key => $v) {
?>
<tr>
<td><?= $v->id ?></td>
<td><?= $v->titulo ?></td>
<td>
<div class="dropdown">
<button class="btn btn-default dropdown-toggle" type="submit" data-toggle="dropdown">... <span class="caret"></span></button>
<ul class="table-modal dropdown-menu">
<li><a data-remote="Cargo/page/visualizar/<?= $v->id ?>" role="button" data-toggle="modal" data-target="#select-modal">Visualizar</a></li>
<li><a data-remote="Cargo/page/alterar/<?= $v->id ?>" data-toggle="modal" data-target="#editarIdade">Editar</a></li>
</ul>
</div>
</td>
</tr>
<?php } ?>
</tbody>
</table>
答案 0 :(得分:3)
当然它无法刷新,你没有按照doco或例子来使用可以刷新的数据源。
http://bootstrap-table.wenzhixin.net.cn/documentation/
http://issues.wenzhixin.net.cn/bootstrap-table/
http://issues.wenzhixin.net.cn/bootstrap-table/#methods/refresh.html
您使用data from html
类型方法,而不是data-url
。
当您首次请求页面时使用php打印到页面时,您希望表格如何知道从哪里获取刷新数据?
更容易修复你创建表的方式,这样你仍然有下拉等等。
查看上面的示例和doco链接:
formatter
列选项进行下拉菜单data-url
从数据源加载,请参阅doco,例如格式
https://bootstrap-table.com/docs/api/table-options/#url
属性: data-url
输入:字符串
<强>详情:强>
从远程站点请求数据的URL。
请注意,所需的服务器响应格式会有所不同,具体取决于&#39; sidePagination&#39;选项已指定。请参阅以下示例:
默认:未定义
示例:来自网址
https://bootstrap-table.com/docs/api/table-options/#rowstyle
属性:数据行样式
输入:功能
<强>详情:强>
行样式格式化程序函数,有两个参数:
支持班级或CSS。
默认: {}
示例:行样式
https://bootstrap-table.com/docs/api/column-options/#formatter
属性:数据格式化程序
输入:功能
<强>详情:强>
上下文(this)是列Object。
单元格格式化程序功能,取三个参数:
默认:未定义
答案 1 :(得分:3)
1)填写名为data-url
2)刷新时需要调用js函数$('#teste').bootstrapTable('refresh')