搜索
查看: 721|回复: 3

[behavior] listview中,点击单元格怎么返回单元格值?

[复制链接]

11

主题

51

帖子

369

积分

新手入门

积分
369
发表于 2018-8-9 23:57:15 | 显示全部楼层 |阅读模式
如题。想做出这种效果:当点击某个单元格时,返回这个单元格的内容,而不是整行的内容。
比如:点击第一行第一列返回9,点击第二行第二列返回aa

  1. import win.ui;
  2. /*DSG{{*/
  3. var winform = win.form(text="HTMLayout 无边框窗体";right=759;bottom=469;parent=...)
  4. winform.add()
  5. /*}}*/

  6. import web.layout;
  7. import web.layout.behavior.windowCommand;//导入behavior:windowCommand;
  8. var wbLayout = web.layout( winform );//在窗体上创建HTMLayout对象

  9. import web.layout.behavior.sortableGrid;

  10. wbLayout.html = /**  
  11. <html>
  12. <head>
  13. <style>

  14. html
  15. {
  16.   background-color: white white cornsilk cornsilk;
  17. }

  18. table
  19. {
  20.   //background: linen;
  21.   overflow:auto;
  22.   width:*;
  23.   height:*;
  24.   behavior:sortableGrid column-resizer;
  25.   border:1px solid rosybrown;
  26. }

  27. @media print {
  28.     table {overflow:none; }
  29. }

  30. table th
  31. {
  32.   height:1.3em;
  33.   background-color: rosybrown;
  34.   color:white;
  35. }

  36. table th:checked[order=down]  
  37. {
  38.   foreground-image: url(stock:arrow-down);
  39.   foreground-repeat: no-repeat;   
  40.   foreground-position-top: 50%;   
  41.   foreground-position-right: 5px;   
  42. }

  43. table th:checked[order=up]
  44. {
  45.   foreground-image: url(stock:arrow-up);
  46.   foreground-repeat: no-repeat;   
  47.   foreground-position-top: 50%;   
  48.   foreground-position-right: 5px;   
  49. }

  50. table th:nth-child(1)
  51. {
  52.   width:1*;
  53. }
  54. table th:nth-child(2)
  55. {
  56.   width:2*;
  57. }

  58. table td
  59. {
  60.   border:1px solid rosybrown;
  61.   white-space:nowrap;
  62.   height:1.3em;
  63.   overflow:hidden;
  64.   text-overflow:ellipsis;
  65. }

  66. table tr:current
  67. {
  68.   background-color: peachpuff;
  69. }

  70. </style>
  71. </head>
  72. <body>

  73. <p>Sortable grid sample. Click on column header will reorder table.</p>

  74. <table fixedrows="1" fixedlayout>
  75. <tr><th>num</th><th>str</th></tr>
  76. <tr><td>9</td><td>dd</td></tr>
  77. <tr><td>5</td><td>aa</td></tr>
  78. <tr><td>12</td><td>cc</td></tr>
  79. <tr><td>7</td><td>bb</td></tr>
  80. </table>
  81. </body>
  82. </html>

  83. **/

  84. import console

  85. var ele=wbLayout.$1("table")

  86. wbLayout.onTableRowClick = function (ltTarget,ltOwner,rowIndex,behaviorParams) {
  87.         console.log(ltTarget.innerText)
  88. }


  89. winform.show();
  90. win.loopMessage();
复制代码
回复

使用道具 举报

11

主题

51

帖子

369

积分

新手入门

积分
369
 楼主| 发表于 2018-8-9 23:59:24 | 显示全部楼层
现在是只能返回整行的内容,返回点击的某个单元格内容,该怎么实现?
回复

使用道具 举报

12

主题

57

帖子

422

积分

二级会员

Rank: 3Rank: 3

积分
422
发表于 2018-8-10 12:57:49 | 显示全部楼层
创建一个名叫cellClick的behavior,在css中设置td的behavior。


  1. import win.ui;
  2. /*DSG{{*/
  3. var winform = win.form(text="HTMLayout 无边框窗体";right=759;bottom=469;parent=...)
  4. winform.add()
  5. /*}}*/

  6. import web.layout;
  7. import web.layout.behavior.windowCommand;//导入behavior:windowCommand;
  8. var wbLayout = web.layout( winform );//在窗体上创建HTMLayout对象
  9. namespace web.layout.behavior.cellClick{           
  10.         onMouseUp = function (ltTarget,ltOwner,x,y,mouseParams) {
  11.                 ..console.log(ltTarget.innerText)
  12.                 return true;
  13.         }
  14. }

  15. import web.layout.behavior.sortableGrid;

  16. wbLayout.html = /**  
  17. <html>
  18. <head>
  19. <style>

  20. html
  21. {
  22.   background-color: white white cornsilk cornsilk;
  23. }

  24. table
  25. {
  26.   //background: linen;
  27.   overflow:auto;
  28.   width:*;
  29.   height:*;
  30.   behavior:sortableGrid column-resizer;
  31.   border:1px solid rosybrown;
  32. }

  33. @media print {
  34.     table {overflow:none; }
  35. }

  36. table th
  37. {
  38.   height:1.3em;
  39.   background-color: rosybrown;
  40.   color:white;
  41. }

  42. table th:checked[order=down]  
  43. {
  44.   foreground-image: url(stock:arrow-down);
  45.   foreground-repeat: no-repeat;   
  46.   foreground-position-top: 50%;   
  47.   foreground-position-right: 5px;   
  48. }

  49. table th:checked[order=up]
  50. {
  51.   foreground-image: url(stock:arrow-up);
  52.   foreground-repeat: no-repeat;   
  53.   foreground-position-top: 50%;   
  54.   foreground-position-right: 5px;   
  55. }

  56. table th:nth-child(1)
  57. {
  58.   width:1*;
  59. }
  60. table th:nth-child(2)
  61. {
  62.   width:2*;
  63. }

  64. table td
  65. {
  66.     behavior:~cellClick;
  67.   border:1px solid rosybrown;
  68.   white-space:nowrap;
  69.   height:1.3em;
  70.   overflow:hidden;
  71.   text-overflow:ellipsis;
  72. }

  73. table tr:current
  74. {
  75.   background-color: peachpuff;
  76. }

  77. </style>
  78. </head>
  79. <body>

  80. <p>Sortable grid sample. Click on column header will reorder table.</p>

  81. <table fixedrows="1" fixedlayout>
  82. <tr><th>num</th><th>str</th></tr>
  83. <tr><td>9</td><td>dd</td></tr>
  84. <tr><td>5</td><td>aa</td></tr>
  85. <tr><td>12</td><td>cc</td></tr>
  86. <tr><td>7</td><td>bb</td></tr>
  87. </table>
  88. </body>
  89. </html>

  90. **/

  91. import console

  92. var ele=wbLayout.$1("table")

  93. wbLayout.onTableRowClick = function (ltTarget,ltOwner,rowIndex,behaviorParams) {
  94.         console.log(ltTarget.innerText)
  95. }


  96. winform.show();
  97. win.loopMessage();
复制代码

点评

同意: 5.0 真棒: 5.0
同意: 5 真棒: 5
very good!大吉大利,今晚吃鸡  发表于 2018-8-10 16:52
回复

使用道具 举报

您需要登录后才可以回帖 登录 | 注册会员

本版积分规则

手机版|未经许可严禁引用或转载本站文章|站长邮箱|aardio.com|aardio官方社区 ( 皖ICP备09012014号 )

GMT+8, 2018-10-22 05:49 , Processed in 0.078125 second(s), 23 queries .

Powered by Discuz! X3.4

© 2001-2017 Comsenz Inc.

快速回复 返回顶部 返回列表