表单提交在一段时间循环PHP，jquery - form submit in a while loop php, jquery

如您所见，我想在一段时间内创建多个表单和按钮。问题是当我想从我的数组中提交一行时，我想执行这个特定表单而不是另一个。

即使我把按钮标签放在我有问题的表单中。我认为要设置一个唯一的id来形成标签，例如id="form_submit_change_status<?php echo $row['id_user']; ?>"。但问题是我必须对javascript代码进行哪些更改。对不起我的英语，我希望了解我的问题...

while($row = $result->fetch_array() ){
<form name="form_submit_change_status" id="form_submit_change_status" action="">
<input type="text" class="user_id" id="user_id" name="user_id" value="<?php echo $row['id_user']; ?>" />
<input type="text" name="is_enabled" value="<?php echo $row['is_enabled']; ?>" />
</form>
<button type="submit" id="submit_change_status" class="btn btn-warning btn-xs" value="<?php echo $row['is_enabled']; ?>">Change status</button>
}

$(document).ready(function(){
$('#submit_change_status').click(function(){
var formData = $("#form_submit_change_status").serializeArray();
var userId = $("#user_id").val();
alert(userId);
var URL = $("#form_submit_change_status").attr("action");
var URL = "change_status_user.php";
$.post(URL,
formData,
function(data, textStatus, jqXHR)
{
//  alert("Data: " + data + "'nStatus: " + textStatus);  
}).fail(function(jqXHR, textStatus, errorThrown) 
{
});
var varChangeStatus = $('#is_enabled'+userId).val();
if(varChangeStatus=="true"){
$('#is_enabled'+userId).html('false');
}else{
$('#is_enabled'+userId).html('true');
}
});
});
</script>

// change_status_user.php
$DBConnection = new DBConnection();
if (isset($_POST['is_enabled'])) {
$id = $_POST['user_id'];
$status = $_POST['is_enabled'];
if($status=="true")
$status = "false";
else
$status = "true";
$sql = "UPDATE users SET is_enabled = '$status' WHERE id_user = $id";
$res = $DBConnection->db_connection->query($sql);
echo $sql;
}

正如其他人上面建议的那样，使用类而不是 ID 是灵活的，因为它们必须是唯一的。类还有助于对元素进行分组，以便以后更方便地访问。

HTML（PHP）：

while($row = $result->fetch_array() ){
<form name="form_submit_change_status" class="form_submit_change_status" action="">
    <input type="text" class="user_id" name="user_id" value="<?php echo $row['id_user']; ?>" />
    <input type="text" class="is_enabled" name="is_enabled" value="<?php echo $row['is_enabled']; ?>" />
    <button type="button" class="btn btn-warning btn-xs" value="<?php echo $row['is_enabled']; ?>">Change status</button>
</form>
}

j查询：

$(function(){
    $('.btn.btn-warning').click(function(e) {
        e.preventDefault();
        var $form = $(this).closest(".form_submit_change_status");
        var formData =  $form.serializeArray();
        var userId =  $form.find(".user_id").val();
        alert(userId);
        //var URL =  $form.attr("action");
        var URL = "change_status_user.php";
        $.post(URL, formData)
        .done(function(data) {
            //success
        }).
        fail(function(jqXHR, textStatus, errorThrown) {
            //failure    
        });
        var $isStatus = $form.find(".is_enabled");
        var varChangeStatus = $isStatus.val();
        $isStatus.val(varChangeStatus=="true" ? "false" : "true");
    });
});

您使用while循环来创建 HTML 元素，但每次都使用相同的 ID 属性。ID 必须是唯一的;但是，类不会。

试试这个：

PHP/HTML：

while($row = $result->fetch_array() ){
  <form name="form_submit_change_status" class="form_submit_change_status" action="">
    <input type="text" class="user_id" name="user_id" value="<?php echo $row['id_user']; ?>" />
    <input type="text" class="is_enabled" name="is_enabled" value="<?php echo $row['is_enabled']; ?>" />
    <button type="submit" class="btn btn-warning btn-xs" value="<?php echo $row['is_enabled']; ?>">Change status</button>
</form>
}

.JS：

$(document).ready(function() {
    $('.submit_change_status').click(function(e) {
        e.preventDefault();
        var $form = $(this).closest(".form_submit_change_status");
        var formData = $form.serializeArray();
        var userId = $form.find(".user_id").val();
        alert(userId);
     // var URL = $form.attr("action");
        var URL = "change_status_user.php";
        $.post(URL,
            formData,
            function(data, textStatus, jqXHR) {
                //  alert("Data: " + data + "'nStatus: " + textStatus);  
            }).fail(function(jqXHR, textStatus, errorThrown) {});
        var $isEnabled = $form.find('.is_enabled');
        var varChangeStatus = $isEnabled.val();
        if (varChangeStatus == "true") {
            $isEnabled.html('false');
        } else {
            $isEnabled.html('true');
        }
    });
});