javascript - 如何使用 jquery 在 html 上显示 ajax 列表响应？

Question

所以我目前有一个搜索框，用户可以搜索经理。当经理被搜索和选择时，他们可以选择通过一个按钮显示直接下属员工，该按钮触发一个 Javascript 函数，该函数将 Ajax 帖子发送到后端以查询数据库。收到成功响应后，我想显示一个包含员工一般信息的表格（例如名字、姓氏、职位等）。我们以前使用 Jquery 在加载时提取数据，但我想知道是否有是一种从 Ajax 响应中提取和显示此数据并将其显示在页面上而不刷新的方法吗？另一个障碍似乎是响应采用列表方式，因此它不会向许多员工返回；可变响应。如果更有效，我们也使用 Thymeleaf 模板，但我没有

标签： javascriptjqueryhtmlajaxthymeleaf

Answer 1

为了在您的 HTML 页面中设置 Ajax 响应，请执行以下操作：-

1.) 使用您的 HTML 元素的 id，然后附加来自您的 ajax Success 函数的响应。

假设有一个文本框，您要在其中设置响应。

<input type="text" id="inputText" >

2.) 现在，在您的 ajax 成功响应中，获取此元素的 id，然后像这样附加响应：- -

$.ajax({
      url: //your url,
      success(data){
           $('#inputText').val(""); //clear the text box on each call so that it won't append the data on every request
           $('#inputText').val(data); //get the text-box id and append the response
      },
      error(data){
       console.log(JSON.stringify(data));
       }
});