Loop the onchange select option-CodePudding

I would like to put the onchange function of select option in the loop. Particularly a for loop for me to change the id of the select tag with an incremental variable. The select tag in HTML is also in the loop with the id that is changing through an incremented PHP variable

$(function() {
  var row = document.getElementById("comments").textContent;
  var text = 1;
  
  for (var i = 1; i <= row; i  ) {
    $('#part').html(text).change(function() {
      var display = $('#part').html(text).find(":selected").val();
      $('#resone').val(display);
    })
    text  ;
  }
})

  Item Name Price Qty Total
  <td>Discount</td>
</tr>

<?php
  $sql = "SELECT * FROM order_item WHERE order_id = {$edit['order_id']}";
  $rs = mysqli_query($con, $sql);

  $count = 1; 
  $counts = mysqli_num_rows($rs);
  
  while ($row = mysqli_fetch_assoc($rs)) 
  { ?>
    <div id="comments" hidden>
      <?php echo $counts; ?>
    </div>
    <tr>
      <td><input type="text" readonly="readonly" id="resone"></td>
      <td>
        <?php echo ucfirst(getProductNameFromId($con, $row['product_id']));?>
      </td>
      <td>
        <?php echo $row['rate']; ?>
      </td>
      <td>
        <?php echo $row['quantity']; ?>
      </td>
      <td>
        <?php echo $row['total']; ?>
      </td>

      <td id="as">
        <select name="artist_1" id="part<?php echo $count; ?>">
          <option value="" disabled selected>Select Category</option>
          <option value="1">lawa</option>
          <option value="2">laaswa</option>
        </select>
      </td>
    </tr>
    <?php
    $count  ;
  } ?>
</table>

CodePudding user response：

        <?php
 $gategory = $_GET["gategory"];

 $sql = "SELECT * FROM order_item WHERE order_id = {$edit['order_id']}";
  $rs = mysqli_query($con, $sql);

  $count = 1; 
  $counts = mysqli_num_rows($rs);
  
  while ($row = mysqli_fetch_assoc($rs)) 
  { ?>
    <div id="comments" hidden>
      <?php echo $counts; ?>
    </div>
    <tr>
      <td><input type="text" readonly="readonly" id="resone"></td>
      <td>
        <?php echo ucfirst(getProductNameFromId($con, $row['product_id']));?>
      </td>
      <td>
        <?php echo $row['rate']; ?>
      </td>
      <td>
        <?php echo $row['quantity']; ?>
      </td>
      <td>
        <?php echo $row['total']; ?>
      </td>

      <td id="as">
        <select name="artist_1" id="part<?php echo $count; ?>">
          <option value="" disabled selected>Select Category</option>
          <option value="1">lawa</option>
          <option value="2">laaswa</option>
        </select>
      </td>
    </tr>
    <?php
    $count  ;
  } ?>
</table>

<script>
$(document).ready(function () {
    $(".category").on('change', function(){
      var value = $('select[name=artist_1] option').filter(':selected').val()
      window.location.href="index.php?gategory=" value;
});

</script>

CodePudding user response：

Be careful when you did a loop with html inside: the id must be unique. That's why javascript doesn't works