JS动态新增删除table中的行

//这个方法就是根据元素ID获取所有的属性

function findObj(theObj, theDoc) {

var p, i, foundObj;

if (!theDoc) theDoc = document;

if ((p = theObj.indexOf("?")) > 0 && parent.frames.length) {

theDoc = parent.frames[theObj.substring(p + 1)].document;

theObj = theObj.substring(0, p);

}

if (!(foundObj = theDoc[theObj]) && theDoc.all)

foundObj = theDoc.all[theObj];

for (i = 0; !foundObj && i < theDoc.forms.length; i++)

foundObj = theDoc.forms[i][theObj];

for (i = 0; !foundObj && theDoc.layers && i < theDoc.layers.length; i++)

foundObj = findObj(theObj, theDoc.layers[i].document);

if (!foundObj && document.getElementById)

foundObj = document.getElementById(theObj);

return foundObj;

}

//新增行，因为本功能后台保存存在较大的个性化，所以每行每列都是直接拼的字符串出来的。

//比较特殊的就是会在新增时自动给出每一行的rowID，同时删除按钮也是直接写死了删除当前行的id。

function AddRow(name)

{

var signFrame = findObj(name, document);

//添加行

var newTR = signFrame.insertRow(signFrame.rows.length);

var rowID = signFrame.rows.length-2;//增加在table后面，总行数减2便可以了。

newTR.id = "Rowid["+rowID+"]";

//添加列:

var newNameTD = newTR.insertCell(0);//按编号为每一列添加元素

//添加列

newNameTD.innerHTML = " <select name=\"NEEDTYPE["+rowID+"]\"><option value=\"0\">--请选择--</option> @{ if (personNeedType != null && personNeedType.Count > 0) { foreach (ListDown model in personNeedType) { <option value=\"@(model.DicId)\">
@(model.DicValue) </option>}} }</select> ";

//添加列:

var newNameTD = newTR.insertCell(1);

//添加列

newNameTD.innerHTML = " <input type=\"text\" name=\"CDMINS["+rowID+"]\" size=\"12\" class=\"required number textInput\"> ";

//添加列:

var newNameTD = newTR.insertCell(2);//以下添加的是下拉框，其实也没什么区别

//添加列内容

newNameTD.innerHTML = " <select name=\"CDMINENUM["+rowID+"]\"> @{ foreach (string name in Enum.GetNames(typeof(CD)))

{ <option value=\"@((int)Enum.Parse(typeof(CD), name))\">@name</option>} }</select>";

//添加列:成单MAX

var newEmailTD = newTR.insertCell(3);

//添加列内容

newEmailTD.innerHTML = " <input type=\"text\" name=\"CDMAXS["+rowID+"]\" size=\"12\" class=\"required number textInput\"> ";

//添加列:

var newTelTD = newTR.insertCell(4);

//添加列内容

newTelTD.innerHTML = " <select name=\"CDMAXENUM["+rowID+"]\"> @{ foreach (string name in Enum.GetNames(typeof(CD)))

{ <option value=\"@((int)Enum.Parse(typeof(CD), name))\">@name</option>} }</select>";

//添加列:

var newMobileTD = newTR.insertCell(5);

//添加列内容

newMobileTD.innerHTML = " <input type=\"text\" name=\"FDS["+rowID+"]\" size=\"12\" class=\"required number textInput\"> ";

//添加列:

var newMobileTD = newTR.insertCell(6);

//添加列内容

newMobileTD.innerHTML = " <select name=\"FDENUM["+rowID+"]\"> @{ foreach (string name in Enum.GetNames(typeof(FDGZ))) { <option value=\"@((int)Enum.Parse(typeof(FDGZ), name))\">@name</option> }} </select>";

//添加列:范围

var newCompanyTD = newTR.insertCell(7);

//添加列内容

newCompanyTD.innerHTML = " <select name=\"FDFW["+rowID+"]\"> @{ foreach (string name in Enum.GetNames(typeof(FW))) { <option value=\"@((int)Enum.Parse(typeof(FW), name))\">@name</option> } } </select>";

//添加列:删除按钮

var newDeleteTD = newTR.insertCell(8);

//添加列内容 删除函数的参数都是写死的

newDeleteTD.innerHTML = " <input class=\"btn btn-primary size-S radius\" type=\"button\" onclick=\"DelRow('table1','Rowid["+rowID+"]')\" value=\"删除\"></td>";

}

//删除指定行

function DelRow(name,rowid) {

var signFrame = findObj(name,document);

var signItem = findObj(rowid,document);

//获取将要删除的行的Index

var rowIndex = signItem.rowIndex;

//删除指定Index的行

signFrame.deleteRow(rowIndex);

}