每行都有“编辑”按钮。如果我按下所选行上的“编辑”按钮，我需要将此行的ID传递给Modal，并在sql查询中使用它来调用其余数据。附：我尝试了很多方法，没有人帮助过，并且基于bootstrap。
这是我的Modal代码
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<div class="container">
<div class="table-responsive">
<table class="table" id="myTable">
<thead>
<tr class="header">
<th>#</th>
<th>Müştərinin Nömrəsi</th>
<th>Götürülən Ünvan</th>
<th>Gədilən Ünvan</th>
<th>Zəng Vaxtı</th>
<th>Sürücünün Tabel Kod</th>
<th>Təhfil aldı</th>
<th>Təhfil verdi</th>
<th>Maşın Nömrəsi</th>
<th>Qiymət</th>
<th>Action</th>
</tr>
</thead>
<tbody>
<?php
while($data=mysql_fetch_array($result)) // цикл вывода
{
$id = $data['id'];
echo "<tr>
<td></td>
<td>".$data['MUSHTERINOMRE']."</td>
<td>".$data['MUSHTERIHARDAN']."</td>
<td>".$data['MUSHTERIHARA']."</td>
<td>".$data['ZENGVAXTI']."</td>
<td>".$data['TABELKOD']."</td>
<td>".$data['TEHFILALDI']."</td>
<td>".$data['TEHFILVERDI']."</td>
<td>".$data['MASHINNOMRE']."</td>
<td>".$data['QIYMET']."</td>
<td><button class=\"btn btn-success\" onclick='getValue(".$id.");' data-toggle=\"modal\" data-target=\"#myModal\" contenteditable=\false\" value=".$id.">EDIT </button></td>
"; ?>
</tr>
<?php
}
?>
</tbody>
</table>
</div>
</div>
<div class="modal fade" id="myModal" role="dialog">
<div class="modal-dialog">
<div class="modal-content"></div>
</div>
<div class="modal-dialog">
<div class="modal-content"></div>
</div>
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal"> <span aria-hidden="true" class="">? </span><span class="sr-only">Close</span>
</button>
<!--Here I am trying to echo ID
<h4 class="modal-title" id="myModalLabel"><?php //echo $id."ID OFaa"; ?></h4>-->
</div>
<div class="modal-body">
<?php echo $id."I NEED TO GET ID HERE "; ?>
<?php
$link = mysql_connect('localhost', 'user', 'psw');
$db_selected = mysql_select_db('my_db', $link);
$query = mysql_query("Select * from my_table where id = $id");
//var_dump($pt);
$row = mysql_fetch_array($query);
$number = $row['num'];
?>
<div class="form-group">
<label for="name" class="control-label">Müştəri Nömrə:</label>
<input type="text" class="form-control" id="num" name="num" value="<?php echo $number; ?>" />
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
<button type="button" class="btn btn-primary">Save changes</button>
</div>
</div>
</div>
</div>
答案 0 :(得分：1)
希望这会给你一些指导
function getValue(id)
{
$.ajax({
url:'filename.php',
method:'get',
data:'id='+id,
success: function(ret)
{
// add the returned value into the modal body
$('#modalBody').html(ret);
// show the modal
$('#myModal').show();
}
});
}
答案 1 :(得分：1)
最重要的是要记住PHP不会执行客户端，所以用id和可编辑值填充对话框必须由客户端语言-javascript执行。在编辑过程中，进一步服务器端参与的唯一选择是进行AJAX调用。
通过＆＃34; promisified＆＃34;您会发现这个过程更加简单。模态对话框。您可以安装install bootStrapModal，而不是自己编写内容，为您提供一个与标准Bootstrap模式非常相似的模态，但它可以作为异步资源。
HTML：
<script src="js/bsBetterModal.js"></script>
按如下方式构建表行：
while($data=mysql_fetch_array($result)) { // цикл вывода
$id = $data['id'];
echo "<tr data-id=\".$id.\">
<td></td>
<td class=\"mushterinomre\">".$data['MUSHTERINOMRE']."</td>
<td class=\"mushterihardan\">".$data['MUSHTERIHARDAN']."</td>
<td class=\"mushterihara\">".$data['MUSHTERIHARA']."</td>
<td class=\"zengvaxti\">".$data['ZENGVAXTI']."</td>
<td class=\"tabelkod\">".$data['TABELKOD']."</td>
<td class=\"tehfilaldi\">".$data['TEHFILALDI']."</td>
<td class=\"tehfilverdi\">".$data['TEHFILVERDI']."</td>
<td class=\"mashinnomre\">".$data['MASHINNOMRE']."</td>
<td class=\"qiymet\">".$data['QIYMET']."</td>
<td><button class=\"btn btn-success edit\">EDIT</button></td>
</tr>";
} ?>
...
按如下所示编写对话框的标题：
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal"> <span aria-hidden="true" class="">? </span><span class="sr-only">Close</span></button>
<h4 class="modal-title dlg-element" data-element="id"></h4>
</div>
按如下方式编写每个对话框的输入（x8）：
<label class="control-label">Müştəri Nömrə:</label>
<input type="text" class="dlg-element" data-element="mushterinomre" value="" />
按如下所示编写对话框页脚：
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
<button type="button" class="btn btn-primary ok">Save changes</button>
</div>
编辑按钮＆＃39;点击处理程序有点复杂。它包含一些序言，后跟一个承诺链。通过将繁琐的位卸载到一堆辅助工具中，我已经尽可能简单了。
jQuery(function($) {
// *** start: click handler ***
$('#myTable').on('click', '.edit', function(e) {
e.preventDefault(); // in case button attempts form submission
var $button = $(this).prop('disabled', true);
var $row = $(this).closest('tr');
var idHash = { 'id': $row.data('id') }; // <<<<<< HERE'S THE ID - expressed as a js plain object.
// From here on, everything is asynchronous, therefore performed within a promise chain.
fetchValues(idHash) // Fetch current values (onscreen values may be stale)
.then(function(valuesHash) {
return betterModal.run($('#myModal'), $.extend(valuesHash, idHash))// Open modal window, populated with current field values.
.then(function($dialog) {
// The dialog was accepted.
// `$dialog` holds a jQuery object of the dialog.
return saveValues($.extend(dialogToHash($dialog), idHash)); // Pass hash of editable field values, plus idHash, to saveValues()
})
.then(function() {
// New values were successfully saved.
// valuesHash is still in scope
updateHtmlTableRow($row, valuesHash); // Update the HTML table row with the edited values.
}, function(err) {
// Save failed
// Provide warning to user ...
return err;
})
})
.then(null, function(err) {
console.log(err);
$button.prop('disabled', false);
})
.always(function() {
$button.prop('disabled', false);
});
});
// *** end: click handler ***
var fields = ['mushterinomre', 'mushterihardan', 'mushterihara', 'tabelkod', 'tehfilaldi', 'tehfilverdi', 'mashinnomre', 'qiymet']; // 'zengvaxti' omitted
// *** start: helper utility functions ***
function fetchValues(idHash) {
return $.getJSON({
'url': 'api.php', // replace with actual url
'method': 'get',
'data': idHash
});
}
function saveValues(values) {
return $.ajax({
'url': 'api.php', // replace with actual url
'method': 'put',
'data': values
});
}
function dialogToHash($dialog) {
var hash = {};
fields.forEach(function(f) {
hash[f] = $('.'+f, $dialog).val();
});
return hash;
}
function updateHtmlTableRow($row, valuesHash) {
fields.forEach(function(f) {
$('.'+f, $row).text(valuesHash[f]),
});
}
// *** end: utility functions ***
});
未经测试和粗略的地方所以需要调试。一些服务器端的东西也需要解决。