0

我无法将不同的变量传递给我的 javascript 函数。开始:

我有基本构建数据行的 PHP 代码。我想要做的是通过 AJAX 调用分别保存每一行。这是我到目前为止所拥有的。发生的事情是第一行工作正常,但所有后续行都没有(javascript变量是第一行的变量)。

前端 PHP 代码

 <?php 
  $result = mysql_query("SELECT * FROM scoresheet WHERE matchup_id = '$matchupid' AND   team_id = '$teama' AND status = '1' "); 
  $num_rows = mysql_num_rows($result);
  if ( mysql_num_rows($result) == 0 ) { echo "<div style='float:left;clear:both;'>Nothing found</div>"; } else {
while($row = mysql_fetch_array($result)) 
{
echo "  <form name='input'>";    
echo "  <div class='tablecell'>".$row['full_name']."</div>";
echo "  <div class='tablecell'>".$row['scoresheet_id']."</div>";
echo "  <input type='hidden' id='scoresheet_id' name='scoresheet_id' value='".$row['scoresheet_id']."'></input>";
echo "  <div class='labelAnswer'><input class='standardscore' type='textfield' id='presenta' name='presenta' value='".$row['present']."'></input></div>";
echo "  <div class='labelAnswer'><input class='standardscore' type='textfield' id='sparea' name='sparea' value='".$row['spare']."'></input></div>";
echo "  <div class='labelAnswer'><input class='standardscore' type='textfield' id='goaliea' name='goaliea' value='".$row['goalie']."'></input></div>";
echo "  <div class='labelAnswer'><input class='standardscore' type='textfield' id='goalsa' name='goalsa' value='".$row['goals']."'></input></div>";
echo "  <div class='labelAnswer'><input class='standardscore' type='textfield' id='assistsa' name='assistsa' value='".$row['assists']."'></input></div>";
echo "  <div class='labelAnswer'><input class='standardscore' type='textfield' id='yellowa' name='yellowa' value='".$row['yellow']."'></input></div>";
echo "  <div class='labelAnswer'><input class='standardscore' type='textfield' id='reda' name='reda' value='".$row['red']."'></input></div>";
echo "  <input type='button' class='btnInput'  style='float:left;margin-top:-2px;' onClick='updatescore()' value='Save'></input>";
}    
}
?>

JAVASCRIPT代码

function updatescore() {
    var presenta = document.getElementById('presenta').value;
    var sparea = document.getElementById('sparea').value;
    var goaliea = document.getElementById('goaliea').value;
    var scoresheet_id = document.getElementById('scoresheet_id').value;

    if (window.XMLHttpRequest) {
        xmlhttp = new XMLHttpRequest();
    }
    xmlhttp.onreadystatechange = function () {
        if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
            document.getElementById("txtuser").innerHTML = xmlhttp.responseText;
        }
    }
    xmlhttp.open("GET", "testajax-x.php?presenta="+presenta+"&sparea="+sparea+"&goaliea="+goaliea+"&scoresheet_id="+scoresheet_id, true);
    xmlhttp.send();
}
4

1 回答 1

0

好吧,您的问题是您将回显出一堆具有相同 ID 的表单为了使其正常工作,每个输入项都必须有自己的 ID。

您的 javascript 行:

var presenta = document.getElementById('presenta').value;
var sparea = document.getElementById('sparea').value;
var goaliea = document.getElementById('goaliea').value;
var scoresheet_id = document.getElementById('scoresheet_id').value;

会自动选择他们遇到的那些 id 的第一个元素。所以你需要在每次循环迭代时使增量 id 像 presenta1、presenta2 等。然后您需要在对updatescore().

你可以尝试这样的事情:

$i=1;
while($row = mysql_fetch_array($result)) 
{
echo "  <form name='input'>";    
echo "  <div class='tablecell'>".$row['full_name']."</div>";
echo "  <div class='tablecell'>".$row['scoresheet_id']."</div>";
echo "  <input type='hidden' id='scoresheet_id' name='scoresheet_id' value='".$row['scoresheet_id']."'></input>";
echo "  <div class='labelAnswer'><input class='standardscore' type='textfield' id='presenta{$i}' name='presenta' value='".$row['present']."'></input></div>";
echo "  <div class='labelAnswer'><input class='standardscore' type='textfield' id='sparea{$i}' name='sparea' value='".$row['spare']."'></input></div>";
echo "  <div class='labelAnswer'><input class='standardscore' type='textfield' id='goaliea{$i}' name='goaliea' value='".$row['goalie']."'></input></div>";
echo "  <div class='labelAnswer'><input class='standardscore' type='textfield' id='goalsa{$i}' name='goalsa' value='".$row['goals']."'></input></div>";
echo "  <div class='labelAnswer'><input class='standardscore' type='textfield' id='assistsa{$i}' name='assistsa' value='".$row['assists']."'></input></div>";
echo "  <div class='labelAnswer'><input class='standardscore' type='textfield' id='yellowa{$i}' name='yellowa' value='".$row['yellow']."'></input></div>";
echo "  <div class='labelAnswer'><input class='standardscore' type='textfield' id='reda{$i}' name='reda' value='".$row['red']."'></input></div>";
echo "  <input type='button' class='btnInput'  style='float:left;margin-top:-2px;' onClick='updatescore({$i})' value='Save'></input>";
$i++;
}

请注意,您需要修改您的 javascript 以将增量值添加到getElementById选择器,例如:

function updatescore(id) {
    var presenta = document.getElementById('present'+id).value;
    // and so on.

最后,您需要将行 id 值添加到 ajax 调用,以便您知道要更新数据库中的哪一行。

使用数据库中的行 ID(如果您在该表上有一个自动增量值)甚至可能比$i我显示的增量变量更好,因为这将为您提供一种直接的方法来将每个 HTML 行绑定到通过 javascript 进行 AJAX 调用。

于 2012-09-06T15:03:20.407 回答