javascript — data-target не работает внутри плагина bootgrid

Я пытаюсь вызвать модал внутри плагина bootgrid, просто он не работает.

Это скрипт, который переводит данные json в bootgrid: (пожалуйста, обратите внимание на переменную $ acoes)

try {

$where = " 1=1 ";
$order_by= "usuarionome";
$rows = 25;
$current = 1;
$limit_l = ($current * $rows) - ($rows);
$limit_h = $limit_l + $rows  ;

//Handles Sort querystring sent from Bootgrid
if (isset($_REQUEST['sort']) && is_array($_REQUEST['sort']) ) {
$order_by="";
foreach($_REQUEST['sort'] as $key=> $value) {
$order_by.=" $key $value";
}
}

//Handles search  querystring sent from Bootgrid
if (isset($_REQUEST['searchPhrase']) ) {
$search=trim($_REQUEST['searchPhrase']);
$where.= " AND ( usuarionome LIKE '".$search."%' OR  usuariodescricao LIKE '".$search."%' ) ";
}

//Handles determines where in the paging count this result set falls in
if (isset($_REQUEST['rowCount']) ) {
$rows=$_REQUEST['rowCount'];
}

//calculate the low and high limits for the SQL LIMIT x,y clause
if (isset($_REQUEST['current']) ) {
$current=$_REQUEST['current'];
$limit_l=($current * $rows) - ($rows);
$limit_h=$rows ;
}

if ($rows==-1) {
$limit = "acesso.usuario";  //no limit
} else {
//$limit=" LIMIT $limit_l,$limit_h  ";

$limit = " (SELECT ROW_NUMBER() OVER(ORDER BY usuarioidentificador) AS rownumber,*
FROM acesso.usuario WHERE $where)  as somex  WHERE  rownumber >= ($current)*10-9
AND rownumber <=($current)*$rows  ";
}

// POSTGRES
//$sql = "SELECT usuarionome, usuariodescricao, usuariosituacao FROM acesso.usuario WHERE $where $limit";

// SQL SERVER
$sql = "SELECT usuarioidentificador, usuarionome, usuariodescricao, usuariosituacao FROM $limit";

$user= new Usuario();
$result = $user->CustomSelect($sql);

foreach ($result as &$value) {

$editar = $this->link('usuarios/editar/'.Encrypt::encrypt($value->usuarioidentificador));
$excluir = $this->link('usuarios/excluir/');

$acoes = '<a class="btn btn-primary" href="'.$editar.'" role="button"><i class="glyphicon glyphicon-edit"></i> Editar </a>&nbsp;
<button class="btn btn-danger" type="button" data-toggle="modal" data-target="#confirmDelete" data-title="Excluir usuário" data-message="Tem certeza que deseja excluir o usuário '.$value->usuarionome.'?" data-id="'.Encrypt::encrypt($value->usuarioidentificador).'" data-link="'.$excluir.'">
<i class="glyphicon glyphicon-trash"></i> Excluir
</button>';

if ($value->usuariosituacao == 1) {
$value->usuariosituacao = 'Ativo';
} else {
$value->usuariosituacao = 'Inativo';
}

$value->usuarioidentificador = $acoes;
}

$json=json_encode( $result );

$count = "SELECT COUNT(*) as qtd FROM acesso.usuario WHERE $where";

$nRows = $user->CustomSelect($count);
$qtde = $nRows[0]->qtd;

// Tell the broswer JSON is coming
header('Content-Type: application/json');

// Means we're using bootgrid library
if (isset($_REQUEST['rowCount']) ) {
echo "{ \"current\":  $current, \"rowCount\":$rows,  \"rows\": ".$json.", \"total\": $qtde }";
} else {
// Just plain vanillat JSON output
echo $json;
}

} catch(PDOException $e) {
echo 'SQL PDO ERROR: ' . $e->getMessage();
}

Это мой интерфейс, он использует Twig, это шаблон проекта.

{% import 'Shared/_twigMacro.mitra.php' as forms %}

<div class="container-fluid">
<div class="col-md-10 col-md-offset-1">
<div class="panel panel-default">
<div class="panel-heading"><a href="{{ link('home/index') }}">Home</a> > Usu&aacute;rios</div>
<div class="panel-body">
<a class="btn btn-default" href="{{ link('usuarios/salvar') }}" role="button"><i class="glyphicon glyphicon-plus"></i> Adicionar novo usu&aacute;rio</a>
<br/><br/>
<table id="grid-data" class="table table-condensed table-hover table-striped" data-toggle="bootgrid" data-ajax="true" data-url="{{ link('usuarios/paginacao') }}">
<thead>
<tr>
<th data-column-id='usuarionome'><div align='center'>Usu&aacute;rio</div></th>
<th data-column-id='usuariodescricao'><div align='center'>Descri&ccedil;&atilde;o</div></th>
<th data-column-id='usuariosituacao'><div align='center'>Situa&ccedil;&atilde;o</div></th>
<th data-column-id='usuarioidentificador'><div align='center'>A&ccedil;&otilde;es</div></th>
</tr>
</thead>
</table>
<a class="btn btn-default" href="{{ link('home/index') }}" role="button"><i class="glyphicon glyphicon-arrow-left"></i> Voltar</a>
</div>
</div>
</div>
</div>
</div>

<!-- Modal Dialog -->
<div class="modal fade" id="confirmDelete" role="dialog" aria-labelledby="confirmDeleteLabel" aria-hidden="true">
<input type="hidden" id="confirmId">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
<h4 class="modal-title"></h4>
</div>
<div class="modal-body">
<p></p>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal"><i class="glyphicon glyphicon-ban-circle"></i> Cancelar</button>
<button type="button" class="btn btn-danger" id="confirm"><i class="glyphicon glyphicon-trash"></i> Excluir</button>
</div>
</div>
</div>
</div>

{{ forms.modal( tituloModal , corpoModal ) }}

Это мой javascript, он загружен на мою главную страницу.

    $('#confirmDelete').on('show.bs.modal', function (e) {
$id = $(e.relatedTarget).attr('data-id');
$link = $(e.relatedTarget).attr('data-link');
$message = $(e.relatedTarget).attr('data-message');
$(this).find('.modal-body p').text($message);
$title = $(e.relatedTarget).attr('data-title');
$(this).find('.modal-title').text($title);
$(this).find('#confirmId').val($id);

// Pass form reference to modal for submission on yes/ok
var form = $(e.relatedTarget).closest('form');
$(this).find('.modal-footer #confirm').data('form', form);
});

<!-- Form confirm (yes/ok) handler, submits form -->
$('#confirmDelete').find('.modal-footer #confirm').on('click', function(){
window.location= $link +$('#confirmId').val();
});

Модал работает, если я удаляю загрузочную сетку из проекта.
Я уже изменил порядок загрузки js обоих скриптов.
Я на 100% уверен, что это всего лишь маленький трюк, чтобы это произошло.
Помоги мне, если сможешь.

Спасибо

1

Решение

Работает со следующим скриптом:

    $("#grid-data").on("loaded.rs.jquery.bootgrid", function(){
$(".btn-deletar").click(function() {

$id = $(this).data('id');
$link = $(this).data('link');
$message = $(this).data('message');
$('#confirmDelete').find('.modal-body p').text($message);
$title = $(this).data('title');
$('#confirmDelete').find('.modal-title').text($title);
$('#confirmDelete').find('#confirmId').val($id);

// Pass form reference to modal for submission on yes/ok
var form = $(this).closest('form');
$('#confirmDelete').find('.modal-footer #confirm').data('form', form);<!-- Form confirm (yes/ok) handler, submits form -->
$('#confirmDelete').find('.modal-footer #confirm').on('click', function(){
window.location= $link +$('#confirmId').val();
});$('#confirmDelete').modal('show');});

});
0

Другие решения

Других решений пока нет …

По вопросам рекламы [email protected]