你想要的效果是,表格的每一行后面有个“添加”按钮,点击按钮后,会自动复制当前行,添加到当前行的后面,这个效果吧?
假设,我们有这样一个table表格:
<table id="table"><tr>
<td>内容1</td>
<td>
<button class="addtr">添加</button>
<button class="deltr">删除</button>
</td>
<tr>
</table>
用jquery来实现“添加”和“删除”的功能:
下面这个是添加:
$("#table").on("click","button.addtr",function(){var $tr=$(this).parents("tr")
$tr.append($tr.clone())
})
下面是删除:
$("#table").on("click","button.deltr",function(){var $tr=$(this).parents("tr")
$tr.remove()
})
可以参考这里,有完整的在线实例演示:
query实例:表格里点击按钮后添加一行,新添加的行附带删除按钮
datatable如果想转换成JSON类型的数据,是需要处理的。直接用微软提供的JavaScriptSerializer类直接序列化,会报错。
所以这里需要贴上两个方法,专门用来转换datatable的
#region DataTable转换为JSON/// <summary>
/// DataTable生成JSON
/// </summary>
/// <param name="dt"></param>
/// <returns></returns>
public static string CreateJSON(DataTable dt)
{
Dictionary<string, object> dit = new Dictionary<string, object>()
List<Dictionary<string, string>> list = DateTableConverter(dt)
if (list != null)
{
dit[dt.TableName] = DateTableConverter(dt)
return new JavaScriptSerializer().Serialize(dit)
}
else
{
return ""
}
}
/// <summary>
/// 将DataTable数据转化为字典类型
/// </summary>
/// <param name="dt"></param>
/// <returns></returns>
public static List<Dictionary<string, string>> DateTableConverter(DataTable dt)
{
List<Dictionary<string, string>> list = new List<Dictionary<string, string>>()
string cloName = string.Empty
foreach (DataRow dr in dt.Rows)
{
Dictionary<string, string> cloumn = new Dictionary<string, string>()
foreach (DataColumn dc in dt.Columns)
{
cloName = dc.ColumnName
cloumn.Add(cloName, dr[cloName].ToString())
}
list.Add(cloumn)
}
return list
}
#endregion
2.调用代码如下
DataTable table = new DataTable("Table1")DataColumn col1 = new DataColumn("ID", typeof(string))
DataColumn col2 = new DataColumn("Name", typeof(string))
table.Columns.Add(col1)
table.Columns.Add(col2)
DataRow row1 = table.NewRow()
row1["ID"] = "1"
row1["Name"] = "a"
table.Rows.Add(row1)
DataRow row2 = table.NewRow()
row2["ID"] = "2"
row2["Name"] = "b"
table.Rows.Add(row2)
string json = CreateJSON(table)
3.json结果如下
{"Table1":[{"ID":"1","Name":"a"},{"ID":"2","Name":"b"}]}4.数组中每一个元素,都是一行数据。只要循环遍历,然后将结果添加入你已经创建好的table中就可以了。还有疑问,继续追问吧。我先去吃饭了。
欢迎分享,转载请注明来源:内存溢出
评论列表(0条)