BootStrap Modal + JS/AJAX 复选框表单提交

BootStrap Modal + JS/AJAX Checkbox Form Submission

本文关键字：AJAX 复选框 表单提交 JS Modal BootStrap      更新时间：2023-09-26

我花了将近一整天的时间试图自己解决这个问题，但我仍然是 AJAX/JS 的新手并且失败了，所以我将不胜感激任何指示。

我有一个复选框列表，这些复选框都在模式（引导程序）中，都具有相同的名称。我希望用户单击相关复选框并提交而不重定向页面。我一直在尝试通过JS和AJAX来做到这一点，但显然我缺少一些东西。

BS 模态内部的形式如下。

<form method="POST" id="hmis105">
<div class="checkbox">
    <label><input type="checkbox" name="reporting[]" value="80">Leishmaniasis</label>
</div>
<div class="checkbox">
    <label><input type="checkbox" name="reporting[]" value="81">Lymphatic Filariasis (hydrocele)</label>
</div>
<div class="checkbox">
    <label><input type="checkbox" name="reporting[]" value="82">Lymphatic Filariasis (Lympoedema)</label>
</div>
<div class="checkbox">
    <label><input type="checkbox" name="reporting[]" value="83">Urinary Schistosomiasis</label>
</div>
<input type="hidden" name="ConsultationID" value="{$ConsultationID}" />
<button class="btn btn-primary" id="btnSubmit">Save</button>

我已经尝试了很多Javascript的方法，但这是我现在尝试使用的方法。 

$(document).ready(function () {
$("#btnSubmit").click(function(){
    var hmis = new Array();
    $('input[name="reporting[]"]:checked').each(function() {
        hmis.push(this.value);
    });
var ConsultationID = $(this).attr('ConsultationID');
    $.ajax({
        url: "ajax/ajax_add_reporting_hmis105.php",
        type: "POST",
        datatype: "json",
        data: {hmis : hmis, ConsultationID : ConsultationID},
    });
});

}）;

最后这是 ajax 文件。我省略了 php 开始标签和数据库连接信息。$db只是创建一个新的数据库连接

foreach ($_POST['hmis'] as $report) {
    $now = date('Y-m-d H:i:s');
    $data = array(
        'consultationId' => $_POST['ConsultationID'],
        'diseaseId' => $report,
        'EntryTime' => $now
        );
    $reported = $db->insertRow("database", "table", $data);
}

老实说，在这一点上，我正在用头撞墙，我正在重新阅读只会让我更加困惑的东西>:(谢谢你的时间！

在服务器端，POST 参数hmis只是一个字符串。要从中提取数据，您需要使用json_decode：

foreach (json_decode($_POST['hmis']) as $report) {
   // ...
相关文章：