js根据数据库数据动态画table

本文介绍了一种使用Ajax从服务器获取模块列表,并动态填充到HTML表格的方法。通过JavaScript代码实现了表格的动态更新,使得用户界面能够实时反映后端数据的变化。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

要显示的table:

<table rules=rows border="1" id="table">
     <tr>
	 <td>模块名称</td>
	 <td>状态</td> 		
     </tr>	
</table>


对应的画表代码:

  var mLength;
  function init(){  
	  	$.ajax({
			 url:"modules/getAllModules.action",
			 type : 'POST',
			 dataType : 'json',
			 success : function(data) {
	 			var len = data.modulesList.length;
	 			mLength = len;
	 			for(var i=0;i<len;i++)
	 			{
	 		 		$("#table").append("<tr ><td colspan='2'>" +
	 		 				"<input type='hidden' id='"+(i+1)+
	 		 				"' value='"+(i+1)+"' name='mId'>" +
	 		 				"<label for='s"+(i+1)+"'>" + 
	 		 				(data.modulesList[i].mname) +
	 		 		 		"&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;" +
	 		 		 		"<input type='checkbox' id='s"+(i+1)+
	 		 		 		"' name='parentId'/></label></td></tr>");
	 			}
			 }
		 });
  }   



亮点就是append();

 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值