Question

我正在尝试建立朋友请求系统。我有注册用户，这些用户使用添加按钮进行回显，每个用户都有一个在用户创建帐户时自动创建的表单。我的问题是如何提交每张表格？使用我现在提供的用户添加按钮时，即使添加按钮是针对4或5用户，它也只会提交数据库中第一个用户的表单。

的index.php

<div class="users_b">
     <?php
     include 'db.php';

        $sq = "select * from alert_users_account";
        $query = mysqli_query($con,$sq);
        while($row = mysqli_fetch_assoc($query)){

     ?>
     <div class="user_dis_p" id="user<?php echo $row['id']?>">
     <div id="user_img"><a href="alert_profile.php?id=<?php echo $row['id']?>"><img src="alert<?php echo $row['photo']; ?>">
     </a></div> <div id="user_fs">
     <a href="alert_profile.php?id=<?php echo $row['id']?>">
     <?php  echo $row['firstname']." "." "." "." ".$row['surname'];?></a><form id="upload_file_f">
     <input type="text" name="friend_id" id="friend_id" value="<?php echo $row['id']?>" readonly>
     <input type="submit" value="submit">
    </form>
</div>
</div>

<script>
$(document).ready(function(e){
$("#upload_file_f").on("submit",function(e){
e.preventDefault();

$.ajax({
   type: "post",
   url:"request.php",
   data:new FormData(this),
   contentType:false,
   processData:false,
   cache:false,
   success: function(data){
   $("#msg").html(data);
   }

});

});

});
</script>

Answer 1

如果你有

<form id="upload_file_f"  ...

<form id="upload_file_f"  .... '

和

$("#upload_file_f").on("submit", ....

嗯，你不能期望表格有效，因为ID应该是唯一的。您必须拥有一个真正独特的表单ID，或者使用类或jquery选择器等，而不是重新使用Id。

 $("form").on( "submit", ....

   //// $(this) within the on callback refers to the match of the selector that was clicked.

如果你查看表单回调，那么ID就没有依赖性。

 <form class="myfrom" ....

并且

$(".myform").on("submit",function(e){
    e.preventDefault();

    $.ajax({
       type: "post",
       url:"request.php",
       data:new FormData(this),
       contentType:false,
       processData:false,
       cache:false,
       success: function(data){
        $("#msg").html(data);
       }

    });
});

应该可以正常工作。接近依赖的唯一部分是这个

$("#msg").html(data);

同样这可能是一个类（.msg），例如你只需做这样的事情

$(".myform").on("submit",function(e){
    e.preventDefault();

    var that = $(this); //ajax scope placeholder

    $.ajax({
       type: "post",
       url:"request.php",
       data:new FormData(this),
       contentType:false,
       processData:false,
       cache:false,
       success: function(data){
            that.find(".msg").html(data);
       }

    });
});

Answer 2

问题是您的表单都具有相同的ID：

使用<form class="upload_file_f">

然后在下面：

<script>
$(document).ready(function(e){
$(".upload_file_f").on("submit",function(e){
e.preventDefault();

$.ajax({
   type: "post",
   url:"request.php",
   data:new FormData(this),
   contentType:false,
   processData:false,
   cache:false,
   success: function(data){
   $("#msg").html(data);
   }

});

});

});
</script>

更简单的解决方案是创建一个函数并使用按钮调用它：

<button onclick="add_friend(<?php echo $friend_id; ?>)" />

和javascript：

<script>
function add_friend(friend_id) {

    $.ajax({
        type: "post",
        url:"request.php",
        data: {
            id: friend_id
        },
        contentType:false,
        processData:false,
        cache:false,
        success: function(data){
            $("#msg").html(data);
        }

    });

});
</script>

如何从多种形式提交每个表格

2 个答案: