表单在一个while循环中提交php，jquery

Question

正如你所看到的，我想在一段时间内创建多个表单和按钮。问题是，当我想从我的数组提交一行我想执行此特定的窗体，而不是另一个。

即使我把按钮标签放在窗体中，我有问题。我想设置一个唯一的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; 
} 

Answer 1

正如其他人上述建议，它的灵活使用类，而不是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> 
} 

的jQuery：

$(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"); 
    }); 
}); 

Answer 2

您使用的是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'); 
     } 
    }); 
});