在 jQuery 成功事件上填充 html 表 [英] Populate html table on jQuery success event

查看:24
本文介绍了在 jQuery 成功事件上填充 html 表的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

这是我的问题.

我有这个 html 表格:

I have this html table:

<table class="flexme" id="table" border="1">
  <thead>
    <tr>
      <th width="100">Usuario</th>
      <th width="100">Nombre</th>
      <th width="100">Apellido</th>
      <th width="100">Cedula/Rif</th>
      <th width="140">Direccion</th>
      <th width="100">E-mail</th>
      <th width="100">Telefono1</th>
      <th width="100">Telefono2</th>
      <th width="100">Status</th>
      <th width="150">Acci&oacute;n</th>
    </tr>
  </thead>
  <tbody>
    <tr id="test">
      <td></td>
    </tr>
   </tbody>
</table>

我有这个ajax请求:

and I have this ajax request:

$.ajax({ 
   type    : "POST",
   url     : "service.php",
   dataType: "json",
   data: {
       action:"search",
       type: 'users',
       parameter: parameter,
       parameterContent: parameterContent,
   },           
   success:function(data) {
       $('#searchResults').show();
       var len = data.length;
       for (var i = 0; i< len; i++) {
       var username  = data[i].username;
       var name  = data[i].uname;
       var lastname  = data[i].lastname;

   }
})

使用 JSON 提供的信息填充 html 表的正确方法是什么?我一直在尝试但没有成功.我已经用 append() html() 进行了测试,但根本没有成功,有人可以指出我正确的方向吗?

What is the correct way to populate the html table with the info that comes via JSON? I have been trying with no success. I have done tests with append() html() but no success at all, can someone please point me into the right direction?

我想要的是获取通过 JSON 获得的信息并使用此信息动态填充表.

What I want is to take the info that comes via JSON and populate the table dynamically with this info.

推荐答案

你可以试试这个:

    var table = $("#table tbody");
    $.each(data, function(idx, elem){
        table.append("<tr><td>"+elem.username+"</td><td>"+elem.name+"</td>   <td>"+elem.lastname+"</td></tr>");
    });

可以在此处找到更多信息:http://api.jquery.com/jQuery.each/

More information can be found here: http://api.jquery.com/jQuery.each/

这篇关于在 jQuery 成功事件上填充 html 表的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆