从 php-foreach-loop 获取数据到 ajax

Question

我已经为这个问题寻找了很长时间的解决方案，但找不到任何解决方案。

我从数据库中获取数据以在我的网站上显示一些项目。对于每个项目，我可以单击笔符号来编辑项目名称。我想发送每个 ajax 请求的日期，但总是获取第一个项目的数据。例如，如果我尝试编辑第二个项目“test”的名称，我会得到第一个项目“blubb”的数据

我尝试过的： - 使用的类不是 Id´s Call Ajax function from PHP foreach with form - 用过 $this Get Ajax variable from the PHP foreach loops

我的代码看起来像这样（简化）：

< script type = "text/javascript" >
  $(document).ready(function() {
    $(".submit").click(function() {

//here are the problems, i only get the value of the first project
      var new_project_name = $('.new_project_name').val(); 
      var old_project_name = $('.old_project_name').val();


      $.ajax({
        type: "POST",
        url: "php/edit/edit.php",
        data: {
          old_project_name: old_project_name,
          new_project_name: new_project_name,
          name: name
        },

      }).

      done(function(response) {
        blabla

      });
    });
  }); < /script>

<?php foreach($db->query('SELECT * FROM portfolio ORDER BY position, id desc') as $row) { $name = $row['name']; ?>

<div class="rename">
  <table width="400" border="0" cellspacing="1" cellpadding="2">
    <tr>
      <td>Projektname:</td>
    </tr>
    <tr>
      <td>
        <input type="text" class="new_project_name" value="<?php echo $name;?>">
      </td>
      <input type="text" class="old_project_name" value="<?php echo $name;?>" hidden>
    </tr>
    <tr>
      <td>
        <input class="submit" type="submit" value="Umbenennen">
      </td>
    </tr>
  </table>
</div>

<?php } ?>

感谢您的帮助。

Answer 1

您可以将项目的 id 传递给 ajax 并更新新值。为此，您只需要传递元素的 id。

HTML

  <input type="text" class="new_project_name" value="<?php echo $name;?>" rel="<?php echo $id; ?>">

jQuery

​​>

 $(document).ready(function() {
    $(".submit").click(function() {
      var parentObj = $(this).closest('.rename');
      var id = parentObj.find(' .new_project_name').attr('rel');
      var project_name = parentObj.find(' .new_project_name').val();


      $.ajax({
        type: "POST",
        url: "php/edit/edit.php",
        data: {
          project_name : project_name ,
          id:id
        },

      }).

      done(function(response) {
        blabla

      });
    });
  });

查看 Fiddle 并检查控制台

http://jsfiddle.net/hoja/2caukhvo/11/