Question

我通过ajax为表中的每一行返回一个表单。我这样做是为了能够在每一行中插入特定于学生ID 的记录。这是表单在由ajax返回时的外观：

问题表单返回后我尝试为第一个学生插入分数 Ralph T. Hensley 我得到了正确的id学生。但是当我试图为剩下的学生插入一个分数时，我得到{{1>} Ralph T. Hensley ，这是id

我正确地显示了每个学生的不同ID，但似乎每当我点击“保存”按钮时，它只会返回结果集中第一个学生的ID。我的代码结构如下。

这就是我通过ajax返回表单的方式。

7

这是我的剧本：

$output .= '<tbody>'; if (mysqli_num_rows($result) > 0) { while ($row = mysqli_fetch_array($result)) { # code... // unseen fields values that will be send $output .= '<form action="#" method="post" class="st_score_form">'; $output .= '<tr>'; $output .= '<td> <input type="number" class="student_set" name="student_id" value="'.$row['student_id'].'"> </td>'; $output .= '<td style="display:none;"> <input type="text" class="subject_set" name="subject" value="'.$subject_id.'"> </td>'; $output .= '<td style="display:none;"> <input type="number" class="class_set" name="class_id" value="'.$class_id.'"></td>'; $output .= '<td style="display:none;"><input type="text" name="term" value="'.$term.'"></td>'; $output .= '<td>'.$row["first_name"]." ".substr($row["middle_name"], 0, 1).". ".$row["surname"].'</td>'; $output .= '<td><input type="number" class="score_set" min="59" max="100" name="score" class="form-control" required="required"></td>'; $output .= '<td><input type="submit" name="savebtn" value="Save" class="btn btn-info form-control savebtn"></td>'; $output .= '</tr>'; // -- end of unseen fields $output .= '</form>'; } $output .= '</tbody>';

我愿意提供反馈和建议，让我了解如何运作。感谢!!!

Answer 1

JS函数中的Scope是Button。表示关键字this是klicked Button的DOM元素。

现在，您可以使用您要搜索的student_id开始搜索输入字段的DOM（起点是您的按钮）。

$(this)
    .parents('tr').first()          // go up the HTML structure to the next TR.
    .find('[name="student_id"]').first()   // find the input with the name `student_id`

Answer 2

首先为所有输入设置相同的id是不好的做法（id在整个页面中必须是唯一的）

在您的代码中，您在此处获取了错误的值var student = $('.student_set').val();：

你应该得到身份：

$(this).parents('tr').find('.student_set').val();

也适用于其他领域。

发表一个工作片段：

$(function() {
  $(".savebtn").on("click", function(e) {
    alert($(this).parents('tr').find(".student_set").val());
  });
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>

  <tr>
    <form>
      <td>
        <input type="number" class="student_set" name="student_id1" value="1">
      </td>
      <td><input type="number" class="score_set" min="59" max="100" name="score" class="form-control" required="required"></td>
      <td><input type="submit" name="savebtn" value="Save" class="btn btn-info form-control savebtn"></td>
    </form>
  </tr>
  <tr>
    <form>
      <td>
        <input type="number" class="student_set" name="student_id2" value="2">
      </td>
      <td><input type="number" class="score_set" min="59" max="100" name="score" class="form-control" required="required"></td>
      <td><input type="submit" name="savebtn" value="Save" class="btn btn-info form-control savebtn"></td>
    </form>
  </tr>
</table>

表单返回ajax没有发送正确的id

2 个答案: