Question

我在extJS上有以下EditorGridPanel：

Ext.onReady(function () {
  var myData = [[ '<SPAN STYLE=\"text-align:Left;font-family:Segoe UI;font-style:normal;font-weight:normal;font-size:12;color:#000000;\"><P STYLE=\"font-family:Arial;font-size:16;margin:0 0 0 0;\"><SPAN><SPAN>HTML </SPAN></SPAN><SPAN STYLE=\"font-weight:bold;color:#FF0000;\"><SPAN>FORMAT</SPAN></SPAN><SPAN><SPAN> TEST<BR />TEST</SPAN></SPAN></P></SPAN>', "lisa@simpsons.com", "555-111-1224"],
                [ 'Bart', "bart@simpsons.com", "555-222-1234"],
                [ 'Homer', "home@simpsons.com", "555-222-1244"],
                [ 'Marge', "marge@simpsons.com", "555-222-1254"]];

  var store = new Ext.data.SimpleStore({
    fields:[ {
      name: 'name'
    },
    {
      name: 'email'
    },
    {
      name: 'phone'
    }],
    data: myData
  });
  var grid = new Ext.grid.EditorGridPanel({
    renderTo: 'grid-container',
    columns:[ {
      header: 'Name',
      dataIndex: 'name', 
        width:200
    }
    ],
    store: store,
    frame: true,
    height: 240,
    width: 500,
      enableColumnMove :false,
            stripeRows: true,
            enableHdMenu: false,
            border: true,
            autoScroll:true,
            clicksToEdit: true,
    title: 'HTML in Grid Cell',
    iconCls: 'icon-grid',
      sm: new Ext.grid.RowSelectionModel({
      singleSelect: true
    })
  });

    grid.on({
        celldblclick: function() {alert(1);}
        });
});

问题是，当gridCell包含HTML数据（这是我的情况）当你用html双击单元格时，网格不会触发事件celldblclick。

在我的应用程序中，我需要在网格中显示那种html。

如何解决这个问题？无论如何将事件从html冒泡到网格？

由于

Answer 1

似乎你的结构深处的dom树有一些限制。我认为将html放入网格并不是一个好主意 - 如果你可以统一它的结构 - 可能模板会更有用。

尝试使用此代替HTML：

 "<div ondblclick=\"alert('1!')\">1<div ondblclick=\"alert('2!')\">2<div ondblclick=\"alert('3!')\">3<div ondblclick=\"alert('4!')\">4</div>3</div>2</div>1</div>"

事件继承在此HTML中运行良好，但在EXt示例中只能工作2级。

注意：如果您尝试

 grid.on('rowdblclick', function(eventGrid, rowIndex, e) {
     console.log('double click');
 }, this);

你不会遇到问题（但显然，你可以用这种方式只对行进行dblclick）

如果单元格包含HTML extjs 3.4.0，则不会触发celldblclick

1 个答案: