Javascript 从函数调用引导模式
我试图让一个模式工作,但我似乎没有得到正确的方向 这就是功能Javascript 从函数调用引导模式,javascript,twitter-bootstrap,bootstrap-modal,Javascript,Twitter Bootstrap,Bootstrap Modal,我试图让一个模式工作,但我似乎没有得到正确的方向 这就是功能 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="#myMod
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('');
}
但什么都看不出来……有什么帮助吗
更新
本页所有内容
<?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>
mas nada AConteche将代码写得更清楚,以便我们更好地理解 现在,我可以告诉你在构建return时有几个错误 我认为它的效果更好
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('');
}
函数运算符格式(值、行、索引){
返回[
""
].加入(“”);
}
请给我们一点提示您的代码似乎有语法错误,您是否检查了控制台?或者它可能是你的代码片段中的一个输入错误,请稍等……谢谢你的帮助我无法让它工作,因为它使用的是我的php pdo文件,主文件在里面,你可以在那里检查我的代码,谢谢,我已经用你的代码更新了,但仍然没有打开模式,当页面加载时,我有这个url,当我点击按钮时,什么也没有发生。firefox带有firebug插件,它显示我错误“传递给getElementById的空字符串。查看您的源代码,我发现了一个小错误Deduzo que sejas brasileiro,então vou facilitar pra nós,esse erro da div não fechar pode estar causando todo problema ou não,se tu inspensionar o codigo fonte do bot o ele assim我没有任何getElementById…奇怪。”
<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));
}
}
<form onsubmit="submitForm('#myForm'); return false;" id='myForm'>
function submitForm(formId) {
var user_id = $('input[id="id_itens"]').val();
console.log(user_id);}
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('');
}