我有一个包含表格的网页。每行都有一个复选框。当用户选择行时,使用复选框,然后按一个按钮(我将代码保存在数组中)它显示一个带有四个按钮(输入)的窗口模式。单击其中一个按钮时,它会启动一个PHP页面来更新数据库。
现在当它显示窗口模态时,我得到一个包含选择行代码的数组,我不知道如何使用POST方法将此数组(jquery代码)发送到PHP页面。
window-modal的HTML代码:
<!-- CHANGE STATUS MODAL MENU -->
<div class="modal fade" id="change" tabindex="-1" role="dialog" aria-labelledby="change" 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"><span class="glyphicon glyphicon-remove" aria-hidden="true"></span></button>
<h4 class="modal-title custom_align" id="Heading">CANVIAR ESTAT</h3>
</div>
<form action="updateEstado.php" method="post">
<div class="modal-body">
<div class=" text-center">
<div class="container-fluid">
<div class="row">
<div class="col-md-12 text-center">
<input type="submit" class="btn btn-modal-estado" style="background-color:YellowGreen; color:white;" value="ACTIVAT">
</div>
</div>
<div class="row">
<div class="col-md-12 text-center">
<input type="submit" class="btn btn-modal-estado" style="background-color:Tomato; color:white;" value="PENDENT MIQUEL ALIMENTACIÓ">
</div>
</div>
<div class="row ">
<div class="col-md-12 text center">
<input type="submit" class="btn btn-modal-estado" style="background-color:SkyBlue; color:white;" value="PENDENT ADDCOM">
</div>
</div>
<div class="row">
<div class="col-md-12 text center">
<input type="submit" class="btn btn-modal-estado" style="background-color:Gray; color:white;" value="DESACTIVAT">
</div>
</div>
<div class="row">
<h5 id='codigosSeleccionados'></h5>
</div>
</div>
</div>
</div>
</form>
</div>
</div>
</div>
</div>
Jquery代码:
/* CHANGE MODAL WINDOW */
$('#change').on('show.bs.modal', function (event) {
var arrayCod = new Array();
$('#tableprod').find('tbody tr').each(function () {
var $button = $(event.relatedTarget) // Button that triggered the modal
var row = $(this);
if (row.find('input[type="checkbox"]').is(':checked')) {
var field = $(this).data("field");
var cod;
$tds = row.find("td"); // get all table cells in that row
$.each($tds, function(index,value) {
var field = $(this).data("field");
if (field == 'codigo'){
cod = $(this).text();
console.log(cod);
arrayCod.push(cod);
return false;
}
});
}
if (arrayCod.length != 0){
$('input[type="submit"]').prop('disabled', false);
$('#codigosSeleccionados').text(arrayCod.length + " codis seleccionats");
} else {
$('input[type="submit"]').prop('disabled', true);
$('#codigosSeleccionados').text("Cap codi seleccionat");
}
});
//$('#codigosSeleccionados').text("CODIS SELECCIONATS: " + strCods);
console.log(arrayCod.length);
});
PHP页面:
$conn = dbConnect("localhost", "5432", "dbname", "dbuser", "dbpass");
$codigo = $_POST['codigo'];
$query = "UPDATE produccion.ma_producto SET estado={$estado} WHERE codigo={$codigo}";
$result = pg_query($conn, $query);
我不知道怎么做,我能从jquery中保存全局php变量吗?或者我可以在点击按钮时发送带有方法发布的数组吗? :(
答案 0 :(得分:1)
将所有选中的代码添加为hidden
[]
字段的列表,然后PHP也会将其作为列表接收。它应该在form
上,模式的4个按钮之一将提交:
var $form = $("form"); // The modal's form
arrayCod.forEach(function(cod) {
$('<input type="hidden" name="codigo[]" value="' + cod + '">').appendTo($form);
});
// Event handler for your modal's four buttons. They will submit the form
$('.modal').on('click', 'button', function() {
$form.submit();
});
然后在PHP中:
$codigos = $_POST["codigos"]; // This will be an array
示例:
$("#open-modal").on("click", function() {
var checkedCodes = [];
// Get checked checkboxes
$("#codes input").each(function() {
if ($(this).is(":checked")) {
// Get the code from td's text
checkedCodes.push($(this).closest("tr").find("td:eq(1)").text());
}
});
// Add hidden fields to the "modal"'s form
var $modal = $("#modal-body"),
$form = $modal.find("form");
checkedCodes.forEach(function(code) {
$('<input type="hidden" name="codigos[]" value="' + code + '">').appendTo($form);
});
$modal.show();
});
$("#modal-body").on("click", "button", function() {
$("#modal-body").find("form").submit();
});
&#13;
#modal-body {
display: none;
border: 1px solid #000
}
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table id="codes">
<tr>
<td><input type="checkbox"></td>
<td>1</td>
</tr>
<tr>
<td><input type="checkbox"></td>
<td>2</td>
</tr>
<tr>
<td><input type="checkbox"></td>
<td>3</td>
</tr>
</table>
<button id="open-modal">Open Modal</button>
<div id="modal-body">
Imagine this is your modal
<form>
<button>Button #1</button>
<button>Button #2</button>
<button>Button #3</button>
<button>Button #4</button>
</form>
</div>
&#13;
这段代码只是一个例子。我甚至没有基于你的代码。