Add docs

docs/dropdown/examples/table.md

@@ -0,0 +1,76 @@
+<table class="layui-hide" id="ID-dropdown-demo-table"></table>
+
+<script type="text/html" id="ID-dropdown-demo-table-tool">
+  <a class="layui-btn layui-btn-xs layui-btn-primary" lay-event="edit">编辑</a>
+  <a class="layui-btn layui-btn-xs" lay-event="more">更多 <i class="layui-icon layui-icon-down"></i></a>
+</script>
+
+<script>
+layui.use(function(){
+  var table = layui.table;
+  var dropdown = layui.dropdown;
+  
+  // dropdown 在表格中的应用
+  table.render({
+    elem: '#ID-dropdown-demo-table',
+    url: '{{d.root}}/static/json/table/demo5.json',
+    title: '用户数据表',
+    cols: [[
+      {type: 'checkbox', fixed: 'left'},
+      {field:'id', title:'ID', width:80, fixed: 'left', unresize: true, sort: true},
+      {field:'username', title:'用户名', width:120, edit: 'text'},
+      {field:'email', title:'邮箱', minWidth:150},
+      {fixed: 'right', title:'操作', toolbar: '#ID-dropdown-demo-table-tool', width:150}
+    ]],
+    limits: [3],
+    page: true
+  });
+
+  // 行工具事件
+  table.on('tool(ID-dropdown-demo-table)', function(obj){
+    var that = this;
+    var data = obj.data;
+      
+    if(obj.event === 'edit'){
+      layer.prompt({
+        formType: 2,
+        value: data.email
+      }, function(value, index){
+        obj.update({
+          email: value
+        });
+        layer.close(index);
+      });
+    } else if(obj.event === 'more'){
+      // 更多下拉菜单
+      dropdown.render({
+        elem: that,
+        show: true, // 外部事件触发即显示
+        data: [{
+          title: 'item 1',
+          id: 'aaa'
+        }, {
+          title: 'item 2',
+          id: 'bbb'
+        }, {
+          title: '删除',
+          id: 'del'
+        }],
+        click: function(data, othis){
+          //根据 id 做出不同操作
+          if(data.id === 'del'){
+            layer.confirm('真的删除行么', function(index){
+              obj.del();
+              layer.close(index);
+            });
+          } else {
+            layer.msg('得到表格下拉菜单 id：'+ data.id);
+          }
+        },
+        align: 'right', // 右对齐弹出
+        style: 'box-shadow: 1px 1px 10px rgb(0 0 0 / 12%);' //设置额外样式
+      }) 
+    }
+  });
+});
+</script>