我想在已经绑定数据的包各种添加一行未绑定的单元格，请问要使用什么方法才能实现？ - ITeye问答

问答首页 → Web前端技术

0 1

我想在已经绑定数据的包各种添加一行未绑定的单元格，请问要使用什么方法才能实现？5

我想在已经绑定数据的包各种添加一行未绑定的单元格，请问要使用什么方法才能实现？

2013年4月23日 16:54

小面加蛋
3
0 0 30

3个答案按时间排序按投票排序

0 0

采纳的答案

当然不是，还可以从设计器里面创建，不过通过代码也不是很复杂啦，使用Spread.Net添加一个未绑定的行：http://www.cnblogs.com/shup/archive/2013/04/23/3038154.html

2013年4月23日 17:09

你值得拥有
0
0 0 13

添加评论

0 0

我去，看标签才知道是什么问题，问题里咋不说明呢，不好意思，闪

2013年4月23日 18:24

yunzhu
426
0 1 27

1条评论

0 0

“包各种”是指“表格中”吗？

通过DOM操作实现。

给你一个完整的例子：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>用DOM动态控制表格</title>
</head>
<body>
<script language="javascript">
	counter = 1;
	// 插入数据
	function insertData()
	{
		var oStudentsTable = document.getElementById("students");
		var oTrHang = oStudentsTable.insertRow(oStudentsTable.rows.length); //插入一行
		var aText = new Array();
		aText[0] = document.createTextNode("王" + (counter++));
		aText[1] = document.createTextNode("B072");
		aText[2] = document.createTextNode("女");
		aText[3] = document.createTextNode("1025");
		aText[4] = document.createTextNode("13663616963");
		for(var i=0; i<aText.length; i++)
		{
			var oTd = oTrHang.insertCell(i); //插入一个单元格
			oTd.appendChild(aText[i]);
		}
	}
	// 编辑单元格数据
	function editData()
	{
		var oTable = document.getElementById("students");
		oTable.rows[1].cells[0].innerHTML += "Chf";
	}
	//添加删除数据的列
	function insertDeleteCell()
	{
		var oTable = document.getElementById("students");
		var oTh = oTable.rows[0].insertCell(oTable.rows[0].cells.length);
		oTh.innerHTML = "<font style='font-weight: bold;'>操作</font>";
		for(var i=1; i<oTable.rows.length; i++)
		{
			var oTd = oTable.rows[i].insertCell(oTable.rows[i].cells.length);
			oTd.innerHTML = "<a href='#' onclick='myDeleteRow(this)'>Delete</a>";
		}
	}
	//添加拥有一个输入框的列
	function insertInputCell() {
		var oTable = document.getElementById("students");
		var oTh = oTable.rows[0].insertCell(oTable.rows[0].cells.length);
		oTh.innerHTML = "<font style='font-weight: bold;'>输入</font>";
		for(var i=1; i<oTable.rows.length; i++)
		{
			var oTd = oTable.rows[i].insertCell(oTable.rows[i].cells.length);
			oTd.innerHTML = "<input type=\"text\" style=\"background:#C0F2F3;margin-left:8px;width:10px;height:10px;\" />"
		}
	}
	//删除行
	function myDeleteRow(theDel)
	{
	    theDel.parentNode.parentNode.parentNode.removeChild(theDel.parentNode.parentNode);
	}
	//删除所有行
	function deleteAllRows()
	{
		var studentsTable = document.getElementById("students");
		while(studentsTable.rows.length > 1)
		{
			studentsTable.deleteRow(studentsTable.rows.length - 1);
		}
	}
	//对表格的行进行排序
	function sortByBirthday()
	{
		var studentsTable = document.getElementById("students");
		// 获取所有学生数据行
		/**
		var studentsRowsData = new Array();
		for(var i=1; i<studentsTable.rows.length; i++)
		{
			// 以这种方式获取表格的所有行，但是通过deleteRow方法删除表格的行，会导致获取的行成为空行<tr></tr>
			// studentsRowsData[i-1] = studentsTable.rows[i];
		}
		**/
		var studentsRows = new Array();
		for(var i=1; i<studentsTable.rows.length; i++)
		{
			studentsRows[i-1] = studentsTable.rows[i];
		}
		
		// ---------- 排序 Begin ----------
		for(var i=0; i<studentsRows.length-1; i++)
		{
			for(var j=i+1; j<studentsRows.length; j++)
			{
				var iBirth = Number(studentsRows[i].cells[3].firstChild.nodeValue);
				var jBirth = Number(studentsRows[j].cells[3].firstChild.nodeValue);
				if(iBirth > jBirth)
				{
					var temp = studentsRows[i];
					studentsRows[i] = studentsRows[j];
					studentsRows[j] = temp;
				}
			}
		}
		
		// ---------- 排序 End ----------
		
		/**
		// 删除表格中的所有学生数据行，保留行首
		while(studentsTable.rows.length > 1)
		{
			studentsTable.deleteRow(studentsTable.rows.length - 1);
		}
		**/
		
		var studentsSortedTable = document.getElementById("students_sorted");
		// 先清空存放排序后学生信息的表格
		while(studentsSortedTable.rows.length > 1)
		{
			studentsSortedTable.deleteRow(studentsSortedTable.rows.length - 1);
		}
		for(var i=0; i<studentsRows.length; i++)
		{
			var newRow = studentsSortedTable.insertRow(studentsSortedTable.rows.length);
			var sortedCells = studentsRows[i].cells;
			for(var j=0; j<sortedCells.length; j++)
			{
				var newCell = newRow.insertCell(newRow.cells.length);
				newCell.innerHTML = sortedCells[j].innerHTML;
			}
		}
		studentsSortedTable.style.display = "inline";
	}
</script>
	<h3>用DOM动态控制表格</h3>
	<input type="button" onclick="insertData()" value="插入一行数据" />
	<input type="button" onclick="editData()" value="修改单元格数据" />
	<input type="button" onclick="insertDeleteCell()" value="动态添加删除列" />
	<input type="button" onclick="insertInputCell()" value="动态添加输入框列" />
	<input type="button" onclick="deleteAllRows()" value="删除所有行保留行首" />
	<input type="button" onclick="sortByBirthday()" value="按生日进行排序" />
	<p></p>
	
	<table id="students" border="1">
	  <caption>
		<h3>学生列表</h3>
	  </caption>
	  <tr>
		<th scope="col">姓名</th>
		<th scope="col">学号</th>
		<th scope="col">性别</th>
		<th scope="col">生日</th>
		<th scope="col">联系方式</th>
	  </tr>
	  <tr>
		<td>陈</td>
		<td>B073</td>
		<td>男</td>
		<td>1126</td>
		<td>15915554615</td>
	  </tr>
	  <tr>
		<td>王</td>
		<td>B071</td>
		<td>女</td>
		<td>0304</td>
		<td>13054115694</td>
	  </tr>
	  <tr>
		<td>曹</td>
		<td>B070</td>
		<td>男</td>
		<td>0815</td>
		<td>1381377894</td>
	  </tr>
	  <tr>
		<td>郑</td>
		<td>B078</td>
		<td>男</td>
		<td>1019</td>
		<td>1322377896</td>
	  </tr>
	</table>
	<p></p>
	<table id="students_sorted" border="1" style="display:none">
	  <caption>
		<h3>排序后的学生列表</h3>
	  </caption>
	  <tr>
		<th scope="col">姓名</th>
		<th scope="col">学号</th>
		<th scope="col">性别</th>
		<th scope="col">生日</th>
		<th scope="col">联系方式</th>
	  </tr>
	</table>
</body>
</html>

2013年4月23日 17:08

yunzhu
426
0 1 27

添加评论

相关推荐

报表工具FineReport填报时，如何实现多个单元格绑定一个字段？: 将每一行数据都填入到一张数据表中，本来要想将所有科目都填报入库，则需要添加多个内置SQL，会非常影响填报效率，今天我来告诉大家可以在一个内置SQL中为单个数据表字段绑定多个单元格，即单元格组。

C#实现改变DataGrid某一行和单元格颜色的方法: 主要介绍了C#实现改变DataGrid某一行和单元格颜色的方法,主要涉及DataGrid控件的添加与使用、数据源的绑定、单元格与行的获取等操作。需要的朋友可以参考下

gridview 实现一个单元格显示绑定的后台数据里的多个超链接: 使用gridview进行数据绑定后，有时需要实现一个单元格有多个超链接的情况，而且每一行的超链接个数不同内容也不同，且超链接的内容需要根据后台绑定的动态数据确定。本代码中的代码就是为了解决该问题而做的，在Demo...

第7章数据绑定控件: 实例201 查看GridView当前行绑定的商品详细信息 319 实例202 GridView复选框绑定列设置商品是否上架 320 实例203 使用主题来设置GridView控件的外观 322 7.3 GridView控件72般绝技 323 实例204 实现搜索GridView...

c#DataGridView数据绑定示例多列混合排序: c#DataGridView数据绑定示例多列混合排序，C#新建DataColumn类时Type类型参数的生成方式，获取当前编辑单元格的内容，以及当前编辑的单元格在哪一行哪一列。

Delphi / XE10 StringGrid 实现合并单元格效果显示: 在StringGrid控件中实现显示Excel形式的合并单元格效果，也可以用AdvStringGrid，XLGRID等第三方控件，不过要破解比较麻烦。原理是通过重载 OnDrawCell 事件procedure TForm1.SGDrawCell(Sender: TObject; ACol, ...

silverlight DataGrid 行内添加明细行明细表: 在datagrid中某行的单元格中增加一个datagrid，实现明细表及合并单元格绑定方法

Vue Elenent实现表格相同数据列合并: （同一个表格，但是每一行，固定一列的数据都相同，即可使用合并单元格，做到了既美观，也清晰。） template： Js: data(){ return{ orderdata:null,// 后端将数据查询出来后，绑定到orderdata里

DevExpress中GridControl的属性设置及动态绑定数据和全选取消全选: DevExpress中GridControl的属性设置（只读，得到当前选定记录某字段的值）及动态绑定数据和全选/取消全选功能。

DataGridView控件使用大全(转+中文对应): 4.1.3 在新行中的数据输入(Data Entry in the New Row) 22 4.1.3.1 显示新行 22 4.1.3.2 为生成的新行添加默认值 22 4.1.3.4 在新行中输入数据 23 4.1.3.5 自定义新行的可视化效果 23 4.1.3.6 新行的排序 24 4.1.3.7...

合并单元格: 实际上在GridView在数据绑定的过程中是逐行实现的。是从GridView最上面的一行（页眉或上分页行）到最下面的一行（页脚或下分页行）逐行建造的。在建造每一行的过程中，又分为两步：创建行和绑定行两个步骤。

Asp.net 高级编程学习经验: 13.关于在Gridview中的单元格中实现用“...”代替超长字符串 14.数据控件中数据强制换行显示 15.关于隐藏Gridview中的某一列数据 16.通过checkbox实现全选和反选的功能 17.关于数据突出显示 18.使用xml作为数据源的...

GridView使用集合: 一、表头表尾 1、自定义多行表头，列合并，行合并 ...2、GridView添加记录，在GridView表脚添加控件，用添加记录 3、更新所有记录，GridView直接绑定控件，然后更新九、主键索引根据主键多条记录删除，单条记录删除。

滴答表格企业版3.8.3: 5.绑定字段一个绑定对象支持添加多个绑定字段对象,绑定字段支持设置绑定目标单元格或目标列,支持空绑定,序列绑定,支持格式设置,支持绑定值等等,最大限度的适应字段格式多样性的变化; 6.绑定分组格式对象用于设置...

Excel VBA实用技巧大全附书源码: 04046引用输入了任何内容的最后一行单元格（多列情况之一） 04047引用输入了公式或值的最后一行单元格（多列情况之二） 04048引用输入了任何内容的最后一列单元格（单行情况之一） 04049引用输入了公式或值的最后一...

咖啡智能报表控件 2.0.zip: （下载报表地址、表格数据、报表绑定数据、单元格变量数据、单元格字段数据、操作报表方法等），在XML中的方法可以实现对本地报表的操作。报表本身的数据通过HTTP协议上传到服务器上，数据可以是单元格数据、变量...

滴答表格企业版3.8.2: 绑定字段一个绑定对象支持添加多个绑定字段对象,绑定字段支持设置绑定目标单元格或目标列,支持空绑定,序列绑定,支持格式设置,支持绑定值等等,最大限度的适应字段格式多样性的变化; 6.绑定分组格式对象用于设置...

DevExpress VCL Full Products V44 (完整源码) 第一包（共2包）: 它使您无需书写一行代码就可以创建可完全定制的具有丰富函数的数据访问窗口，因此，可以使您更有效地编写其应用程序，同时该应用程序也具有更加灵活的性能。分层显示数据—使用ExpressVerticalGrid，您可以无限制地...

ASP.NET GridView 实现课程表显示(动态合并单元格)实现步骤: 但是，课程表的显示可不是这么简单，它需要将普通记录继续加工，需要根据记录中具体的数据来确定数据需要显示在哪一行、哪一列，而且需要根据课程开始时间和结束时间动态合并单元格，最后才是数据的显示。...

devexpress表格控件gridcontrol图片列，按钮列，时间列等特殊列的实现: 项目中经常会在表格中插入按钮列，图片列，表格列一些非文本的特殊列。如何在devexpress表格控件gridcontrol中实现呢？以下列举一个实现添加图片列，按钮列，时间列，按钮列,开关列的示例。

Ask-but

我的问答 FAQ | 勋章

相关推荐

已解决问题

未解决问题

排行榜

查看全部排名>>

Global site tag (gtag.js) - Google Analytics