使用 JavaScript 将 ajax 的结果附加到文本区域

Question

如何将 ajax 的结果附加到文本区域？我正在使用代码点火器。我想将控制器中的值附加到 textarea。

这是在我的控制器中传递的查询结果，将附加到我的文本区域中：

checkup_diagnosis: [2]
  0: Object
     diagnosis: "Java"
  1: Object
     diagnosis: "Scala"

现在我希望将这两个值插入到我的文本区域中。这是我尝试过的，#modaldiagnosis 是我的 textarea 的 ID：

function view_profile(check_up_date,check_up_id) {
 $.ajax({
    url: siteurl+"search_records/view_profbtn",
    type: "POST",
    data: {check_up_id:check_up_id, check_up_date:check_up_date},
    dataType: "JSON",
    success: function(data){
        for(i=0;i<data.length;i++) {
             $('#modaldiagnosis').append(data['checkup_diagnosis'][i]['diagnosis']);  
        }
    }
  });
}

Answer 1

您可以使用.val() 来设置 textarea 元素的内容。要附加到现有值，您可以这样做：

var md = $("#modaldiagnosis")
md.val(md.val() + valueToAppendHere)

但是，在循环中重复更新同一个 DOM 元素并不是一个好主意。最好使用循环创建一个要追加的字符串，然后更新一次 DOM 元素，在循环之后。

此外，您可能希望在每个值之间添加换行符或逗号或其他内容。这是一种方法：

var data = {
  checkup_diagnosis: [
    { diagnosis: "Java" },
    { diagnosis: "Scala" }
  ]
}

$("button").click(function() {     // button with click handler for demo purposes only

  var newData = data['checkup_diagnosis']        // take the input array,
    .map(function(v) { return v['diagnosis'] })  // map it to get the required values,
    .join(", ")                                  // join the result with commas
  var md = $('#modaldiagnosis')
  md.val(md.val() + newData)
  
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<textarea id="modaldiagnosis"></textarea>
<button>Test</button>

显然，当我在演示中使用按钮单击时，您会得到一些 Ajax 代码。您可以在演示中看到数据被添加到文本区域中已有内容的末尾 - 测试是否已经存在值并添加额外的逗号（或您想要的任何其他格式）作为练习留给读者...

Answer 2

我相信你会需要

for(i=0; i<data['checkup_diagnosis'].length; i++) {
    $('#modaldiagnosis').append(data['checkup_diagnosis'][i]['diagnosis']);  
}