我正在尝试使用模态，但我似乎没有找到正确的方向
这个功能
function operateFormatter(value, row, index) {
return [
'<a class="info btn btn-warning btn-xs" title="Editar" id="bt" data-unique-id="',row.id,'" data-toggle="myModal" data-target="#myModal',row.id,'">',
'<i class="glyphicon glyphicon-edit"></i>',
'</a>',
''<a href="#myModal" class="danger btn btn-danger btn-xs" title="Remover" id="bt" data-unique-id="',row.id,'" data-toggle="myModal" data-target="#myModal',row.id,'">', '<i class="glyphicon glyphicon-remove"></i>',
'</a>'
].join('');
}
我想从该函数中调用我的模态
function removeItem(index, row){
var id_itens = JSON.stringify(row.id_itens);
$('#myModal').modal('show');
}
但没有任何表现......任何帮助？
UPDATE 本页的所有内容
<?php
error_reporting(E_ALL | E_NOTICE);
ini_set('display_errors', '1');
include_once 'dbconfig.php';
?>
<!DOCTYPE html>
<html>
<head>
<title>Itens Registados</title>
<meta charset="utf-8">
<link rel="stylesheet" href="bootstrap/css/style_no_image.css" type="text/css" />
<link rel="stylesheet" href="bootstrap/css/bootstrap.min.css">
<link rel="stylesheet" href="bootstrap/css/bootstrap-table.css">
<link rel="stylesheet" href="bootstrap/css/bootstrap-editable.css">
<script src="js/jquery.min.js"></script>
<script src="js/jquery-1.6.min.js"></script>
<style>
#bt {
margin-left: 20px;
}
th.alinhado{
text-align: center;
}
</style>
</head>
<body>
<div class="header">
<div class="left">
<label><a href="http://www.esmaior.pt/agrupamento/">ESMAIOR- Gestão Biblioteca</a></label>
</div>
<div class="right">
<label><a href="logout.php?logout=true"><i class="glyphicon glyphicon-log-out"></i> Sair</a></label>
</div>
</div>
<div class="container-fluid">
<div class="row">
<div class="col-md-12">
<?php include 'menu_admin.php'; ?>
</div>
</div>
</div>
<div class="container-fluid">
<h3>Visualização e Edição de Registos</h3>
<table id="table" class="table table-bordered table-striped"
data-toggle="table"
data-pagination="true"
data-search="true"
data-show-refresh="true"
data-show-toggle="true"
data-show-columns="true"
data-toolbar="#toolbar"
data-url='pdoGetItens.php'>
<thead>
<tr>
<th data-field="id_itens" class="hidden">ID</th>
<th data-field="nome" data-editable="true" class="alinhado">Nome</th>
<th data-field="descricao" data-editable="true" class="alinhado">Descrição</th>
<th data-field="tipo" data-editable="true" class="alinhado" data-align="center">Tipo</th>
<th data-field="estado" data-editable="true" class="alinhado" data-align="center">Estado</th>
<th data-field="data" data-editable="true" class="alinhado" data-align="center">Data</th>
<th data-field="quantidade" data-editable="true" class="alinhado" data-align="center">Quantidade</th>
<th data-field="operate" data-formatter="operateFormatter" data-events="operateEvents" class="alinhado" data-align="center">Opções</th>
</tr>
</thead>
</table>
</div>
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
<h3 class="modal-title" id="myModalLabel">Atenção!</h3>
</div>
<div class="modal-body">
</div>
<div class="modal-footer">
<button type="button" class="btn btn-danger" id="btnDelteYes" href="#">Sim</button>
<button type="button" class="btn btn-default" data-dismiss="modal">Não</button>
</div>
</div>
</div>
</div>
<script src="js/bootstrap-table.js"></script>
<script src="js/bootstrap-table-pt-PT.js"></script>
<script>
function operateFormatter(value, row, index) {
return [
"<a class='info btn btn-warning btn-xs' title='Editar' id='bt' data-unique-id='"+row.id+"' data-toggle='myModal' data-target='#myModal"+row.id+"'>",
"<i class='glyphicon glyphicon-edit'></i>",
"</a>",
"<a href='#myModal' class='danger btn btn-danger btn-xs' title='Remover' id='bt' data-unique-id='"+row.id+"' data-toggle='myModal' data-target='#myModal'"+row.id+"'>",
"<i class='glyphicon glyphicon-remove'></i>",
"</a>"
].join('');
}
function removeItem(row){
var id_itens = JSON.stringify(row.id_itens);
$('#myModal').modal('show');
}
</script>
</body>
</html>
更新2
<script>
function operateFormatter(value, row, index) {
return [
"<a class='info btn btn-warning btn-xs' title='Editar' id='bt'>",
"<i class='glyphicon glyphicon-edit'></i>",
"</a>",
'<a class="remove btn btn-danger btn-xs" href="#myModal" title="Remover">',
'<i class="glyphicon glyphicon-remove"></i>',
'</a>'
].join(' ');
}
window.operateEvents = {
'click .like': function (e, value, row, index) {
alert('You click like icon, row: ' + JSON.stringify(row));
console.log(value, row, index);
},
'click .edit': function (e, value, row, index) {
alert('You click edit icon, row: ' + JSON.stringify(row));
console.log(value, row, index);
},
'click .remove': function (e, value, row, index) {
$('#myModal').modal('show').find('.modal-body #nome').val(JSON.stringify(row.nome));
$('#myModal').modal('show').find('.modal-body #id_itens').val(JSON.stringify(row.id_itens));
}
}
e o meu modal devia chamarafunção
<form onsubmit="submitForm('#myForm'); return false;" id='myForm'>
功能
function submitForm(formId) {
var user_id = $('input[id="id_itens"]').val();
console.log(user_id);}
mas nada acontece
答案 0 :(得分：0)
更清楚地编写代码，以便我们更好地理解。
现在我可以告诉你在返回的构造中有几个错误。
我认为它的工作更好
function operateFormatter(value, row, index) {
return [
"<a class='info btn btn-warning btn-xs' title='Editar' id='bt' data-unique-id='"+row.id+"' data-toggle='myModal' data-target='#myModal"+row.id+"''>",
"<i class='glyphicon glyphicon-edit'></i>",
"</a>",
"<a href='#myModal' class='danger btn btn-danger btn-xs' title='Remover' id='bt' data-unique-id='"+row.id+"' data-toggle='myModal' data-target='#myModal"+row.id+"'>",
"<i class='glyphicon glyphicon-remove'></i>",
"</a>"
].join('');
}