Question

我有一个表，如果条件满足，如果条件为假，则希望用户在其中填写数据。如果条件为假，则输入字段被禁用。
我有一个带有Submit属性的输入标签在每一行中。我将onClick（）提交给下面的ajax函数。
这里的错误是只有第一个提交按预期工作，其余所有按钮均不起作用。
谁能帮我吗？

    <table> 
     <?php for($i=0; $i < $count; $i++){ ?>
       <tr>
        <td><?php echo $student_name[$i]; ?>
        <input type='hidden' id='student_id' value='<?php echo $student_id[$i]; ?>'>
        <input type='hidden' id='class_id' value='<?php echo $class_id; ?>'>
        <input type='hidden' id='phase' value='<?php echo $phase; ?>'>
        </td>

        <td>
          <?php if($studnet_p1_a1[$i] != 0){ ?>
            <input type="text" style="width:70px" name='a1' id='a1<?php echo $i; ?>' class="form-control mb" value="<?php echo $studnet_p1_a1[$i]; ?>" disabled>
          <?php }else{ ?>
            <input type="text" style="width:70px" name='a1' id='a1<?php echo $i; ?>' class="form-control mb" placeholder='08.01' >
          <?php } ?>
        </td>
        <td>
          <?php if($studnet_p1_a2[$i] != 0){ ?>
            <input type="text" style="width:70px" name='a2' id='a2<?php echo $i; ?>' class="form-control mb" value="<?php echo $studnet_p1_a2[$i]; ?>" disabled>
          <?php }else{ ?>
            <input type="text" style="width:70px" name='a2' id='a2<?php echo $i; ?>' class="form-control mb" placeholder='11' >
          <?php } ?>
        </td>
        <td><input type="submit" name="submit" onclick="ajax($(this));return false;" id="<?php echo $i?>" style="width:70px" class="button form-control mb" class="btn btn-success" value="Submit"></td>
      </tr>
     <?php endfor; ?>
    </table>

    <script>

    function ajax($this) {
      var a1 = $("input#a1").val();
      var a2 = $("input#a2").val();

      var student_id = $("input#student_id").val();
      var class_id = $("input#class_id").val();
      var phase = $("input#phase").val();
      var datastring = 'a1=' + a1 + '&a2=' + a2 + '&student_id=' + student_id + '&class_id=' + class_id + '&phase=' + phase;

      $.ajax({
            type: "POST",
            url: "score_process.php",
            data: datastring,
            success: function(){              
            }
      });
     }

     </script>

Answer 1

请检查以下代码并尝试：

<table> 
     <?php for($i=0; $i < $count; $i++){ ?>
       <tr>
        <td><?php echo $student_name[$i]; ?>
        <input type='hidden' class='student_id' value='<?php echo $student_id[$i]; ?>'>
        <input type='hidden' class='class_id' value='<?php echo $class_id; ?>'>
        <input type='hidden' class='phase' value='<?php echo $phase; ?>'>
        </td>

        <td>
          <?php if($studnet_p1_a1[$i] != 0){ ?>
            <input type="text" style="width:70px" name='a1' class="form-control mb a1" value="<?php echo $studnet_p1_a1[$i]; ?>" disabled>
          <?php }else{ ?>
            <input type="text" style="width:70px" name='a1' class="form-control mb a1" placeholder='08.01' >
          <?php } ?>
        </td>
        <td>
          <?php if($studnet_p1_a2[$i] != 0){ ?>
            <input type="text" style="width:70px" name='a2' class="form-control mb a2" value="<?php echo $studnet_p1_a2[$i]; ?>" disabled>
          <?php }else{ ?>
            <input type="text" style="width:70px" name='a2' class="form-control mb a2" placeholder='11' >
          <?php } ?>
        </td>
        <td><input type="submit" name="submit" style="width:70px" class="button form-control mb submit_btn" class="btn btn-success" value="Submit"></td>
      </tr>
     <?php endfor; ?>
    </table>

    <script>
        $(document).ready(function () {
            $('body').on('click', '.submit_btn', function(e){
                var a1 = $(this).closest('tr').find('.a1').val();
                var a2 = $(this).closest('tr').find('.a2').val();
                var a3 = $(this).closest('tr').find('.a3').val();
                var a4 = $(this).closest('tr').find('.a4').val();
                var a5 = $(this).closest('tr').find('.a5').val();
                var bmi = $(this).closest('tr').find('.student_id').val();
                var student_id = $(this).closest('tr').find('.student_id').val();
                var class_id = $(this).closest('tr').find('.class_id').val();
                var phase = $(this).closest('tr').find('.phase').val();
                var datastring = 'a1=' + a1 + '&a2=' + a2 + '&a3=' + a3 + '&a4=' + a4 + '&a5=' + a5 + '&bmi=' + bmi + '&student_id=' + student_id + '&class_id=' + class_id + '&phase=' + phase;

                $.ajax({
                    type: "POST",
                    url: "score_process.php",
                    data: datastring,
                    success: function(){              
                    }
                });
            });
        });

     </script>

Answer 2

您没有使用<form>，请尝试使用具有onclick属性的<input>更改为<button>，而不使用return语句，然后删除type="submit"。

$studnet_p1_a2[$i]应该是student而不是studnet？

还考虑使用Angular，React，Vue.js之类的框架。它们比裸PHP更可扩展。

如何为表格中的多个按钮设置AJAX调用

2 个答案: