如何编辑表格HTML?

时间:2014-04-30 00:29:56

标签: javascript jquery

我正在构建一个包含表格的页面,可以添加,编辑和删除。我有添加和删除功能,但没有编辑或保存。任何人都能说出这些功能有什么问题吗?

每当我点击编辑按钮时,它都会删除该行(选中它将删除或编辑的复选框)。

这是我的代码:

<table id="packageTable">
            <thead>
               <tr>
                   <th>Select</th>
                   <th>Make</th>  
                   <th>Model</th>
                   <th>SKU#</th>
                   <th>Price</th>
                </tr>
              </thead>
                <tbody>

               </tbody>      
        </table>
       rowNew = 1;
       removeRow = -1;          
       function tableColumn(){
           row = rowNew;
           if (removeRow >0){
               editList();
           }else{
               var make = $("#make").val();
               var modal = $("#model").val();
               var sNumber = $("#sNumber").val();
               var mPrice = $("#mPrice").val();

               var newCol = "<tr id = 'newCol" + row +"'>" +
                      "<td><input type = 'checkbox'>"+ "</td>" +
                       "<td id\"mChoice" + row + "\">"+ make + "</td>" +
                       "<td id\"m0Choice" + row + "\">" + modal +"</td>" +
                       "<td id\"skChoice" + row +"\">" + sNumber +"</td>"+
                       "<td id\"prChoice" + row +"\">" + mPrice +"</td>" +
                       "<td><button onclick ='eRow(" + row + ")'>Edit</button>" +
                       "<td><button onclick ='delete(" + row + ")'>Delete</button>" +
                       "</tr>";
                       $("#packageTable").append(newCol);
                       rowNew++;
                    $("#make").val("");
                    $("#model").val("");
                    $("#sNumber").val("");
                    $("#mPrice").val("");


             }
       }
       function eRow(row) {
           $("#make").val($('#mChoice'+row).html());
           $("#model").val($('#m0Choice'+row).html());
           $("#sNumber").val($('#skChoice'+row).html());
           $("#mPrice").val($('#prChoice'+row).html()); 
           remove = row;
      }

      function editsSave(){
          $('"#mChoice' + removeRow).html($('#make').val());
          $('"#m0Choice' + removeRow).html($('#model').val());
          $('"#sNumber1' + removeRow).html($('#sNumber').val());
          $('"#mPrice' + removeRow).html($('#mPrice').val());
          remove = -1;
      }

0 个答案:

没有答案