Question

我有一些嵌入php循环的表单，并且它已经通过getelementbyid由javascript处理，每当我提交时，它只会在循环中提交第一个表单项。下面是我的PHP

$qsel = "SELECT * FROM sellbusiness ORDER BY sn DESC LIMIT 2";
$results = mysqli_query($conn,$qsel) or die(mysqli_error());  
$num_rows = mysqli_num_rows($results);
              while($rows=mysqli_fetch_array($results)){
                $status = $rows['status'];
                $usern = $rows['username'];
                $video = $rows['video'];
            ?>

<input type="text" id="usercomment" value=" " name="comment"  placeholder="Enter your comment" class="form-control" />
<input type="hidden" name="postcode" id="postcode" value="<?php echo $postcodez; ?>"  class="form-control" />
<input type="hidden" name="username" id="username" value="<?php echo $usern; ?>"  class="form-control" />
<input type="hidden" name="commentor" id="commentor" value="<?php echo $username; ?>"  class="form-control" />
<span class="input-group-btn">
<button type="button" id="submit" onclick="myComment()" class="btn btn-primary btn-xs pull-right " >Post Comment!!!!</button>

<?php } ?>

以下是我的ajax

<script type="text/javascript">

function myComment() {
var usercomment= document.getElementById("usercomment").value;
var commentor= document.getElementById("commentor").value;
var postcode = document.getElementById("postcode").value;
var username = document.getElementById("username").value;
// Returns successful data submission message when the entered information is stored in database.
var dataString = 'usercomment1=' + usercomment + '&commentor1=' + commentor + '&postcode1=' + postcode + '&username1=' + username ;

// AJAX code to submit form.
$.ajax({
type: "POST",
url: "commenthandler.php",
data: dataString,
cache: false,
success: function(html) {
alert(html);
}
});

return false;
}
</script>

Answer 1

哇，有一些很多的错误，特别是从编程的角度来看。你没有正确使用jQuery提供的框架，就像你正在借用它的AJAX功能，但你坚持使用困难的传统JavaScript来做其他事情。 jQuery最擅长的一点就是选择元素。使用（错误地）getElementById()，而不是将输入字段的值串起来，使用jQuery函数.serialize()来编码表单中的整个数据。如果您这样做，则无需在输入字段中添加不必要的id。

我会尽力帮助你，让你有一些有用的东西。

$(document).ready(function() {
    $("#submit").click(function() {
        // AJAX code to submit form.
        $.ajax({
            type: "POST",
            url: "commenthandler.php",
            data: $("form").serialize(),
            cache: false,
            success: function(html) {
                alert(html);
            }
        });
    });
});

您可以从onclick中删除<button>属性，因为jQuery能够将函数绑定到按钮的单击。您可以继续在PHP中使用$_POST['usercomment']，$_POST['postcode']等。但是，重要的是要意识到，即使你可以很好地使用jQuery，getElementById()也不会返回单个元素，它会返回一个数组元素。这就是为什么这不起作用的原因：

var usercomment= document.getElementById("usercomment").value;
var commentor= document.getElementById("commentor").value;

您没有指定具有ID usercomment的元素来获取值。如果您要使用getElementById()来表示某些内容，则必须指定要使用的数组元素，如下所示。

var usercomment = document.getElementById("usercomment")[0].value;
var commentor = document.getElementById("commentor")[0].value;

您的样本中还缺少结束<span>标记。

Answer 2

尝试类似

的内容

function myComment(e) {
var elementparent=e.target.parentElement;
var usercomment= elementparent.getElementById("usercomment").value;
var commentor= elementparent.getElementById("commentor").value;
var postcode = elementparent.getElementById("postcode").value;
var username = elementparent.getElementById("username").value;
var dataString = 'usercomment1=' + usercomment + '&commentor1=' + commentor + '&postcode1=' + postcode + '&username1=' + username ;

// AJAX code to submit form.
$.ajax({
type: "POST",
url: "commenthandler.php",
data: dataString,
cache: false,
success: function(html) {
alert(html);
}
});

return false;
    }

getelementbyid只能在php循环中使用第一个id

2 个答案: