0

I have a problem with multiple buttons with this same id. When i click one of buttons, it works only for id=1 (When I enter something in the text field and press any button, in each case only the record with id = 1 will be updated). How to solve this problem?

div id="ShowPrace">
<?php
try {
  $stmt = $pdo->prepare("SELECT * FROM prace");
  $stmt->execute(array());
  $count = $stmt->rowCount();
  while($row = $stmt->fetch(PDO::FETCH_ASSOC)){

?>

  <textarea class="form-control" name="id" rows="1" id="id"><?php echo $ind; ?></textarea>
  <div class="form-group">
    <label for="img">Link do obrazka:</label>
    <textarea class="form-control" name="link" rows="1" id="link"><?php echo $row['img']; ?></textarea>

  </div>
  <div class="form-group">
    <label for="title">Tytuł:</label>
    <textarea class="form-control" name="title" rows="1" id="title"><?php echo $row['title']; ?></textarea>
  </div>
  <div class="form-group">
    <label for="opis">Opis:</label>
    <textarea class="form-control" name="opis" rows="1" id="opis"><?php echo $row['opis']; ?></textarea>
  </div>
  <div class="form-group">
    <button type="submit" id="poprawa" name="poprawa" class="btn btn-primary"> Popraw</button>
</div>
  <?php
    }

  } catch (\Exception $e) {
      echo "Wystąpił nieoczekiwany błąd!";
  }
  ?>

And JS:

("#poprawa").click(function(){

var link = $("#link").val().trim();
var title = $("#title").val().trim();
var opis = $("#opis").val().trim();
var id = $("#id").val().trim();

$.ajax({
  url: 'update_prace.php',
  type: 'POST',
  data: {link:link, title:title, opis:opis, id:id},
  success: function(response){
    if(response == 0){
      alert("error");
    }
    else{
      alert("Poprawione!");
      location.reload();
    }
  }
});

});

Mysma
  • 9
  • 1
  • 5
  • 4
    Multiple button should NEVER have the same id. In fact, mutiple html element should never have the same Id. Change the ids so that they are unique. – Liora Haydont Feb 22 '18 at 22:05

2 Answers2

2

IDs are unique and cannot be repeated. You should use a class in your DOM instead and change your selector accordingly

HTML:

<button type="submit" name="poprawa" class="btn btn-primary poprawa"> Popraw</button>

JS: 

$(".poprawa").click(function(){

For instance.

Anthony L
  • 2,159
  • 13
  • 25
2

You have to differenciate ids because an id is unique.

You can do something like :

<?php    
    ...
    $i=0;
    while($row = $stmt->fetch(PDO::FETCH_ASSOC)) {
?>
...
<textarea class="form-control" name="id" rows="1" id="id-"<?php $i ?>>
...
<?php
    }
    $i++;    
    } catch (\Exception $e) {
       echo "Wystąpił nieoczekiwany błąd!";
    }
?>

$i allowed to change ids for each loop.

Royce
  • 1,557
  • 5
  • 19
  • 44
  • Okay, but then, how to capture each of these buttons in JS? If, for example, I intercept $("#poprawa-1").click.... It's not working. – Mysma Feb 22 '18 at 22:43
  • You capture them all by using a .class selector instead. – IncredibleHat Feb 22 '18 at 22:49
  • @IncredibleHat When i capture by using a class selector js code for every button return id=1 and when i for example try to capture button with id=2 or id=3, js code too return me id=1. – Mysma Feb 23 '18 at 09:58