如何在 .append 输入字段上显示来自 DB 的数据

Question

我有一个按钮，可以创建一个新的输入字段和一个默认字段

<div class="container1">
   <button class="add_form_field">Add Title</button>
   <div class="form-group label-floating">
      <input type="text" id="title_name">
   </div>
</div>

这是创建新输入字段的 jquery。

var max_fields      = 10;
var wrapper         = $(".container1"); 
var add_button      = $(".add_form_field"); 

var x = 1; 
$(add_button).click(function(e){ 
    e.preventDefault();
    if(x < max_fields){ 
        x++; 
        $(wrapper).append('<div><input type="text" id="title_name"/><a href="#" class="delete">Delete</a></div>'); //add input box
    }
else
{
alert('You Reached the limits')
}
});

$(wrapper).on("click",".delete", function(e){ 
    e.preventDefault(); $(this).parent('div').remove(); x--;
});

我有 ajax 调用根据登录的用户从我的数据库中获取标题名称。

$.ajax({
        url:'../ajax/getprofile.php',
        type:'POST',
        data:{userid:user},
        dataType:'JSON',
        success: function(result){
        $('#title_name').val(result.title_name);
        }
});

当我使用console.log(result) 查看返回的数据时，我的 ajax 请求只返回了一个数据..

我只是没有在我之前的问题中包含其他数据，因为这些数据只返回一个数据.. 我只有 title_name 有问题

此代码仅适用于默认输入字段..就像我的数据库中的数据只显示在默认输入字段上而不是附加输入字段上..

说我的用户 ID 为 10001，我的数据库看起来像这样 tbl_title

id    |   name
10001 | sample
10001 | test

我想要实现的是，当我从 ajax 发出请求并返回请求的值时，它将显示在我的输入字段上。由于我的 id 类似于 tbl_title (id)，它应该在输入字段。但不幸的是，只有第一个数据只显示在默认输入字段上，我想做的是，如果数据大于 1，它也会显示在附加的输入字段上。但我不知道这是如何工作的。 .

b4 我只有一个正在返回的数据，所以我更新了我的 mysql 以返回所有具有相似 id 的数据，所以现在我得到了 array1 和 array2 array1 在图片上，而 array2 类似于图片但唯一的区别是他们的title_name..那么我应该怎么做才能在我的输入字段的数组上显示我的两个title_name

Answer 1

每个输入的 id 都是相同的。所以 jQuery 在这一行中占据了第一个位置：

$('#title_name').val(result.title_name);

这就是为什么只有第一个输入有效...

尝试像这样改变它：

$(wrapper).append('<div><input type="text" id="input_' + x + '"/> ...

和：

$('#input' + x ).val(result.title_name);

可能不完全正确，但朝着正确的方向推进 ;) id 是问题所在。