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\" οnclick=\"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); 
    } 


评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值