zoukankan      html  css  js  c++  java
  • jquery table

    View Code
     1     <table border=1 id="table6">   
     2     <tbody id="tbody6">   
     3         <tr class="template  repeat">   
     4         <td class="content">模板1</td>
     5             <td  class="content">这里是模板 by yanleigs Email:landgis@126.com</td>   
     6             <td><button class="del">模板,不要删除</button></td>   
     7         </tr>   
     8         <tr class="repeat">   
     9         <td class="content">模板1</td>
    10             <td class="content">这行原来就有</td>   
    11             <td><button type_id="1" class="del">删除</button>|<button type_id="这是自定义属性" id="tedit">编辑</button></td>   
    12         </tr>   
    13        
    14        
    15         <tr class="repeat" id="lastid">   
    16         <td class="content">模板1</td>
    17             <td  id="urlid" class="content">这行原来就有</td>   
    18             <td><button type_id="2" class="del">删除</button>|<button type_id="这是自定义属性" id="tedit">编辑</button></td>   
    19         </tr>   
    20     </tbody>   
    21     <tfoot>   
    22         <tr>   
    23             <td> </td>   
    24              <td> </td>   
    25             <td><button id="add6">添加</button></td>   
    26         </tr>   
    27     </tfoot>   
    28 </table>  
    View Code
     1   <table id="table1" width='100%' border='1' cellpadding='1' cellspacing='1' align="center" style="margin-top: 8px;height:35px;">
     2                <tr style="height:25px;">
     3                 <th align="left">
     4                     名字
     5                 </th>
     6                 <th align="left">
     7                     年龄
     8                 </th>                
     9                 <th align="left">
    10                     路径
    11                 </th>
    12                 <th align="center">
    13                  操作
    14                 </th>
    15                 
    16             </tr>
    17         @foreach (var item in Model)
    18         { 
    19             <tr>
    20              <td>@item.Name</td>
    21              <td>@item.Age</td>
    22              <td>@item.HrefURL</td>
    23              <td>
    24               <a href="javascript:void(0)" onclick="edit(@item.id)"  title="新开页面进行编辑">
    25                   编辑
    26                     </a>
    27                     <a href="#" id="Delete"  title="删除">
    28                     删除
    29                     </a>
    30 
    31              </td>
    32             </tr>
    33         }
    34     </table>
    View Code
      <script type="text/javascript">
            $(document).ready(function () {
                $("#tbody6 .del").click(function (e) {
    
                    var guid = $(this).attr("type_id");
                    var tr = $(this).parents("tr");
                    var index = $("#table6 tr").index(tr); //查找tr 在table 的索引
                    $.messager.confirm("消息", "是否确定删除第【" + index + "】行的数据?", function (e) {
                        if (e) {
                            if (index == 0) {
                                alert("模板不能删除。"); return false;
                            }
                            tr.remove();
                        }
                    });
    
                    alert(guid);
    
    
    
                    //   $(this).parents(".repeat").remove();
                });
    
                //table1 begin
                $("#table1 #Delete").click(function () {
                    var tr = $(this).parents("tr");
                    $.messager.confirm("提示信息", "是否确定删除第【" + tr.index() + "】行的数据?", function (r) {
                        if (r) {
                            tr.remove();
                        }
                        
                    });
    
                });
                //end
    
    
    
                $("#add6").click(function () {
                    $("#tbody6>tr:last")
                                    .clone(true) //拷贝。包括事件
                                    .removeClass("template") //删除样式
                                    .addClass("repeat") //添加样式
                                    .find(".content") //查找
                                    .text("请增行11") //文本赋值
                                    .end() //查找 .content 然后恢恢复到选择所有段落的状态
                                    .find(".del").text("删除").attr("type_id", "8")
                                    .end()
                                    .find("#urlid").text("111").attr("type_id", 9).end()
    
                    //  .add("<button type_id='这是自定义属性' id='tedit'>编辑</button>")
                                    .appendTo($("#tbody6")) //最后添加到 tbody6上
    
    
    
                });
    
    
    
                $("#tbody6 #tedit").click(function () {
                    var tr = $(this).parents("tr");
                    var index = $("#table6 tr").index(tr);
    
                    alert(index);
                    var v = $(this).attr("type_id"); //自定义数量可以设置为数据库的编号
                    alert(v);
                });
    
            });
    
            //保存 。修改刷新一次就可以了
            function deletes(id)
            {
                $.messager.confirm("删除提示", "是否确定删除?", function (r) {
                    if (r) {
                        $.ajax({
                            type: "POST",
                            url: "/Home/Delete",
                            data: { id: id },
                            success: function (msg) {
                                // $.messager.alert("消息", msg.Message, "info");
    
    
                                //                            if (msg.IsSuccess) {
                                //                                history.go(0);
                                //                            }
                            }
                        });
    
                    }
                });
    
    
             
            }
    
    
            function edit(id) {
                $.ajax({
                    type: "POST",
                    url: "/Home/EditUser",
                    data: { id: id },
                    success: function (msg) {
                        $("#txtName").val(msg.Name);
                        $("#txtAge").val(msg.Age);
                        $("#txtURL").val(msg.URL);
                        $("#txtid").val(id);
                    }
                });
    
                $("#divUser").show().dialog({
                    modal: true,
                    autoOpen: false,
                    title: "编辑",
                     500,
                    height: 300,
                    autoOpen: false,
                    buttons: [{ //begin 01
                        text: "保存",
                        iconCls: "icon-ok",
                        handler: function () {
                            $.ajax({
                                type: "POST",
                                url: "/Home/SaveUser",
                                data: id,
                                success: function (msg) {
                                    $.messager.alert("消息", msg.Message, "info");
                                    if (msg.IsSuccess) {
                                        $("#divUser").show().dialog("close");
                                    }
                                }
                            });
    
                        }
                    }, //分割 
                    {
                    text: "取消",
                    iconCls: "icon-cancel",
                    handler: function () {
                        $.messager.confirm("确认消息", "是否确定关闭?", function (r) {
                            if (r)
                                $("#divUser").show().dialog("close");
                        });
                    }
    
                }]//end 01
            });
            }
    
        </script>
  • 相关阅读:
    poj 2528 Mayor's posters (线段树+离散化)
    poj 1201 Intervals (差分约束)
    hdu 4109 Instrction Arrangement (差分约束)
    poj 1195 Mobile phones (二维 树状数组)
    poj 2983 Is the Information Reliable? (差分约束)
    树状数组 讲解
    poj 2828 Buy Tickets (线段树)
    hdu 1166 敌兵布阵 (树状数组)
    Ubuntu网络配置
    Button控制窗体变量(开关控制灯的状态)
  • 原文地址:https://www.cnblogs.com/chenxiao/p/2491389.html
Copyright © 2011-2022 走看看