Question

我正在尝试提交一个表单，该表单在while循环中显示来自我的数据库的图像。我使用ajax所以它不会刷新页面并松开我的位置，我有一个表单在提交时更新数据库中的日期时间但是当表单提交时它只显示来自while循环的最新id ..

这是getFeed.php

//Display feed with form
$sql = "SELECT * FROM images ORDER BY id desc";
$result = $conn->query($sql);
if ($result->num_rows > 0) {
echo '<div id="mainCont">';
while($row = $result->fetch_assoc()) {
    $path = $row['path'];
    $user = $row['user'];
    $id = $row['id'];

    echo '<img id="pic" src="/mobile/uploads/'.$path.'"/>';
    echo '<div id="userCont">';
    echo '<div id="user">@'.$user.'</div>';
    echo '<div id="com"><img src="../img/com.png"/>0</div>';
    echo '<form method="post" data-ajax="false">';
    echo '<input name="id" data-ajax="false" id="id" type="text" value="'.$id.'" />';
    echo '<input type="image" style="height:35px;top:4px;" id="bump" src="../img/bump.png" id="searchForm" onclick="SubmitForm();" value="Send" />';
    echo ' </form>';


    echo '</div>';
    }
echo '</div>';

这是index.php中的ajax调用

<script type="text/javascript">
//Calling Feed
repeatAjax();
function repeatAjax(){
  $.ajax({    
    type: "GET",
    url: "getFeed.php",             
    dataType: "html",                  
    success: function(response){                    
        $("#response").html(response); 

        },
    });
};

//Submit Form
function SubmitForm() {
    event.preventDefault();
    var name = $('#id').val();
    console.log(name);
    $.post("bump.php", {name: name},
    function(data) {

    });
}
</script>

我在数据库中有3个帖子，其id为100,101,102。当提交表单时，无论提交哪个表单，日志都只显示102 ..

Answer 1

您可以使用

echo '<input name="id" data-ajax="false" id="field_'.$id.'" type="text" value="'.$id.'" />';
echo '<input type="image" style="height:35px;top:4px;" id="bump" src="../img/bump.png" id="searchForm" onclick="SubmitForm('.$id.');" value="Send" />';

和提交

//Submit Form
function SubmitForm(id) {
    event.preventDefault();
    var name = $('#field_'+id).val();
    console.log(name);
    // your code
}

Answer 2

你应该给你的输入字段类，并按类名称而不是id

调用secific字段

Answer 3

id在HTML中是唯一的。您应该使用class代替id。

例如：

HTML：

<input type="text" id="input0" class="id" name="id0" />
<input type="text" id="input1" class="id" name="id1" />

JS：

var name0 = $("#input0").val(); // by id
var name1 = $(".id")[1].val(); // by class

Ajax表单提交不会从while循环发布表单字段值

3 个答案: