表格动态加，删除行 单元格元素添加点击事件

id区别不同的点击按钮（区别计算按钮点击  通过时间差异）  区别删除按钮 用parent追踪

，name提交数据到后台

前台

                                     <div class="span12">

                                                    <button  type="button" class=" act-add">

                                                        <i class="icon-plus"></i>添加款项交付

                                                    </button>

                                                    <table id="viewtable"

                                                        class="table table-striped table-bordered table-hover">

                                                        <thead>

                                                            <tr>

                                                                <th>合同付款名称</th>

                                                                <th>付款时间</th>

                                                                <th>付款金额（百分比）</th>

                                                                <th>付款金额</th>

                                                                <th>付款备注</th>

                                                                <th>操作</th>

                                                            </tr>

                                                        </thead>

                                                        <tbody>

                                                        </tbody>

                                                    </table>

                                                </div>

jquery

 var template = function() {/*   

                 <tr>

                 <td>   

                     <input type="text" name="contractPayName" value=" ">

                     

                 </td>

               <td width=20>

                 <label class="control-label" for="contractPayDate"></label>

                 <div class="input-append date form_date" data-link-field="contractPayDate" data-link-format="yyyy-mm-dd">

                 <input type="text"  readonly="readonly"  style="width:100px;" />

                 <span class="add-on"><i class="icon-remove"></i></span>

                 <span class="add-on"><i class="icon-calendar"></i></span>

                 <input type="hidden" class="hide-cal" id="contractPayDate" name="contractPayDate" style="width:100px;" value=""/>

             </div>                               

                 </td>   

                 <td ><input type="text"  id="@@Percent" name="contractPayPercent" style="width: 90px;" value=""></td>              

                 <td ><input type="text"  id="@@Amount" name="contractPayAmount" style="width: 90px;" value="">

                 <button id="@@calculatePrice" type="button" class="btn btn-mini btn-purple" title="计算产品总价">计算</button>

                 

                 </td>

                <td width=60><input type="text" name="contractPayRemark" style="width: 90px;" value=" "></td>

                 

                 <td>

                     <button class="btn btn-mini btn-danger act-del">

                         <i class="icon-trash" ></i>

                     </button>

                 </td>

                 

                 </tr>

             */};

   

             template = (template+'').slice(15,-4);

                 $(".act-add").click(function(){

                     

                     var contractPayAmountId= "aa"+(new Date()).getTime();

                     var contractPayPercentId="bb"+(new Date()).getTime();

                     var calculatePriceId = "cc"+(new Date()).getTime();

                     

                     var templatenew = template.replace("@@Amount", contractPayAmountId);

                     templatenew = templatenew.replace("@@Percent",contractPayPercentId);

                     templatenew = templatenew.replace("@@calculatePrice",calculatePriceId);

                     

                     var t = $(templatenew);

                     t.find(".form_date").datetimepicker({

                        language: "zh-CN",

                        format: "yyyy-mm-dd",

                        weekStart: 1,

                        todayBtn:  1,

                        autoclose: 1,

                        todayHighlight: 1,

                        startView: 2,

                        minView: 2,

                        forceParse: 0,

                       });

                     $("#viewtable tbody").append(t);

                     //

                 

                     

                     //计算本次付款

                     function calculatePrice() {

                         //合同付款总价

                         var contractQuote=Number($('#contractQuote').val());

                             

                         // 比例

                            var contractPayAmount = "";

                            var contr
4000
actPayPercent = Number($('#' + contractPayPercentId).val());

                            if (contractPayPercent && contractPayPercent > 0) {

                                contractPayAmount = (contractPayPercent / 100) * contractQuote;

                                contractPayAmount = contractPayAmount.toFixed(2);

                            }

                                                               

                            // 填充产品实际款项交付

                            $("#" + contractPayAmountId).val(contractPayAmount);

                     }

                                   

                         // 为计算按钮添加click事件

                         $('#'+calculatePriceId).click(calculatePrice);

                         

                         // 百分比变更后自动计算

                         $('#contractQuote,#'+contractPayPercentId).change(calculatePrice);

                     

                  

                      

                     return false;

                 });

                 

                 $("#viewtable").delegate(".act-del", "click", function(){

                     

                     var cid = $(this).parents("tr").eq(0).find(":hidden").val();

                                  $(this).parents("tr").eq(0).remove();

                     

                     return false;

                 });