PDA

View Full Version : Ext Js 4.1 menu item mouse hover does not render properly..



studymania
27 Jun 2012, 3:42 PM
here is my code and mouse hover on menu item does not render properly.


var tree = Ext.create('Ext.tree.Panel', {

title: title,
renderTo: 'tree-div',
collapsible: true,
useArrows: true,
rootVisible: false,
height : '300',
store: treeStore,
selModel: {
selType: 'cellmodel'
},
plugins: [cellEditing],
columns: [{
xtype: 'treecolumn',
text: 'Tasks',
dataIndex: 'treenode'
},{
text: 'Date1',
xtype: 'datecolumn',
align: 'center',
dataIndex: 'date1'
},{
text: 'Date2',
xtype: 'datecolumn',
align: 'center',
dataIndex: 'Date2'
}
],
viewConfig: {
stripeRows: true,
listeners: {
itemcontextmenu: function(view, rec, node, index, e) {
e.stopEvent();
addTaskMenu.showAt(e.getXY());
return false;
}
}
}
});

var addTaskMenu = Ext.create('Ext.menu.Menu', {
items: [
{
iconCls: 'icon-add',
text: 'Add Task',
handler: function(widget, event) {
addTask(widget,event);
}
}
]
});


http://www.sencha.com/forum/image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAJkAAAApCAIAAACp9ByYAAAJf0lEQVR4nO2b21PbVh7HnXbaPnT6B/RVb33fp/0TdvZlZ7azl9nZbpLZbbeXdMlm07S5Z0lTsiRNSdhAm2xzgxAuBoxlG2KM7zcdCd9xbMsYsME3GSFLsiXZyT6IKIqNaYaUhFJ95zMa8Tvnd5jRZw7WyEJlmC29SB4p2baotqIEI7bMwxeePXv2vODG58+P41KlWq8AJTsym7mU5KkeR9x5AABSyQ4LAGCTXfvEpciePXsMGKHHiorLHRgAQL1eb6VzA5d6tAAjuQaX7gStxth7gLmHKLxAADOKsZ4EI7nkOK5Wq22os9Hlq6++qgN5rScjdzmbYuAAG8vymVVhWeEFklkVYlleG2B9KUZ0yTAMz/P1ev0HXRKvvfaa1ruscS7IXWp8THSZz5QEhZdCdIXX+FnRJUmSLMsKgtC8NZ9yqUcLb7zxxoRradQal7u8hzCLRWGJUHg5LBaFQWR9X+ZyOYqiqtVqrVZr7RIjdGjhzTffHLfPD5vCjS4JQeElcu+xy8XFRYIgNtyaTzblK6+88vrrr7/11ltvv/32O++80+AyVRQUXiKSy0QikcvlyuUyz/MtXeqxIoxkNa7FkZnoXR3S4DJZEJ4FCIKesbhlftzVfipILiORSCaTWVtbq1arDXdAjS7HHakRU6Qfdje4xPOCCARB0jmeFx5kSXfSOzqrvuvtu+O5ve/k7ywxR2S5JJ/T0CIVm9M8bcPGZ5m2y5BcBoPBpaWl1dXVTV2iBdi7Mu6YH54O9U04G1zGc3w8x0MQJB3jORJZCGmDGk2obzx0ZzRwe8j//W306jXXxVueW9YYmFsm5F2t2Hz0+efvDiSXPp9vYWGhVCpVKpWG258ml/b5IWPwjsbe4PJBln+Q5SEIWj/mSM88Muq/Mez/n3leZ0sbTUv6yYVxbXLotv9qx/QXXaYv27898evf/ErccGL7hjSMSnu0VVE+tPnKuwnJJYZh8/PzBEH8gEutd7mVy+gKH13hIQgSj95USO37fth/zZUxWTJTQ7Fb18Jd1+a+uRPrVSf7bwa6T+r/0Tl1yhhxS12taDUq1RsmtKrvbppdsiz7wy4H7wf6mlxGlnkIgiLLfGSZD6ZXD136YGC2x75035iGe0IXLqMd6thdbWq4O3j+PHb8erjrv0jH4fH3v5m+gi7kpcYNaTUq1RsmiD9uvubuQ+4ymUw+l8tQhocgKJThQxneHvcO+r6beDBwf0nbE7p4EWu/Av4jLvc12n7U+uFR24ffBb/+0vTZ0fEDo9ik1LghDaPyW6GGYvP5z4dnclkiMiUiQxTThfziciaZxCMBP2KzmRpcBtNPrvIHZ/7Uj/WM4wPfR7ovgH93oR1XwUVxuc6Z02ctB48Y933lOtztPXt04kCH/jIEQcE03wr5aKtzeUV+/PkgubTZTAE/ksQjy5lkIb9IFNOiwRKRUYkOHj58KAgCy7LFYjGZTKIo2uASgiD/Eidy03n7FnplKH7zkq99IHrjUVN6QceR6X3dSPtxbdsv//YLeW8z8tFW5/KKVN982V2G5BJF0WQyWSwWmx/9qPReRu9l9B4adq9pHcToTHrQMHdb7Wp26VvkRK7bb3zn6bwR6T6HfdEXu76xy/t7uz3/Pjbx6ZHhM/LeZhpG5X9jGyrN8zdfeTchubwz6h4yRMfMadhZ0nkog5cxIKyIyh0R3BHBFeadwYrNR5k8OZ05PgI3PvfBFjiJm66739jO9PjOn8eOH3N9etL+z69Mx0SLXe5Tp82fHL7/l3O2g12OU4eG3z893invVdgakku1DtFbEyYkZw+UXeGqe07wRGsiKndUcEcF1xzvDFdsAcqE5HTW+EjTMzyQ4iQmw/YLMycu2I9/6+88bNnfNv1eu7lNdHnGcuCA7vcHdX/sQc4egz/9+O7+O06NvFdha8hcAoMVn0HyjgDtDnOeuZo3Whd51n2JJDlkfh0XXui1Xj+h++SK5+wV0P4v43tHjPt6QUevt+OQ4c9tuj90uU52mo/tvfnu8bFz1tiK1KiwRZKc9J3XiA7RWeMmJGcLUM5wxTXHi7vRHRVUzkjdGak7wjV7kLP4aKMnD5vxYRjIXaoxxhqrepKcxGTY+7XxzOeaD7qcp3vRr87ZDh2Z2vuZ4b0vLQevets7zV/sv/XuwYEPBxGTvEtha1hj1VFs/bvoYRjAZtzoyVtmaXuAc4RqznBdZN2lM1J3hHiLj572FmAzPqJ76j7Wk2DUs6zlQdWJcy6cc+GcGy9q/cYOw/GDI/vOTB267Dx92Xmyy3Hikv3EUe0ne2/8tm3g732uMUc853rcorAFnDhnflAdnWU9CXp9X8IobManPQXLLO0I8pJIZ7iusoXrItYgb5qlpzwFjRkfgp9ySZKkL8VofOyg7N2tMV+232M/pbn0mfrjI2MfHdUc+Hzs47ahv37Uv79t4Ow1i1GNLb/8d59+4gwCRuNj/QtP3t0a0qIaEz7lLphQ2urnbcG6hMoarIlY/JwJLU+68xMz+KAWgO1/pzKVSj169Gi7f8tuCgBgUAs0MwmDOz+NUmZ/1RIUJJ52idGT7rxGcblTAwC4J7nEyo0up/w1kclZTg/oCWdBPTPfr8UUlzswAIB+LaY2zU84C3qEnsS4KV9NQqXDBBEY5bReesxBDJlSfVqf4nIHBgDQr/UPTy+M2wnYw+gAr0drEiodKojAgJvw0OMOYti02A8HFZc7MACAe7qQ2rQ44SB0HtoAuElUkFBNIuXHUHr3qtaeHZuZH9KHFJc7MACAIX1ofCYF23MG9+oUUp5CaAlVrzH7mJWeqUyPYeEqHOse9Ssud2AAAN1jgatwrMew0DOV6TWuyPRlVZwsLMtSFEUQRDqdVlzuwAAAMpkMQRAURbEsyz2dp1xWq1WGYUiSLBQKz/cfn0q2K4VCgSRJhmGq1epmLjmOq1QqNE2vrq4WCoV0Oo3jeDQaDQQCGIYBALxKXmAAABiGBQKBaDSK43g6nRZF0jRdqVS4pjS6rFarLMvSNE2SJEEQ2Ww2nU6nUikcxxOJRDwej8fjMSXbHPE6JxIJHMdTqVQ6nc5mswRBiCJZlm3elBu4FHVWKhWGYSiKIkmyVCoVi8V8Pp/L5bLZbDabXVGyzRGvcy6Xy+fzxWKxVCqRJElRFMMwlUplQ5Ebu5R0sizLMEy5XKYoam1tbW1t7SV+7P8MI15ziqLK5TLDMCzLbiKypUvJqChV9CqFUbLNkV9t8fqLLjaRxXHc/wGRWpijeMZZTgAAAABJRU5ErkJggg==

would you please help? not sure how to stop css inheritance for ext componet.36602

studymania
28 Jun 2012, 10:51 AM
any help would greatly appreciated.

scottmartin
28 Jun 2012, 3:45 PM
This displays fine:




itemcontextmenu: function(view, node, htmlItem, index, e, eOpts ) {
e.stopEvent();
var treeMenu = Ext.create('Ext.menu.Menu',{
items: [
{
iconCls: 'icon-add',
text: 'Refresh',
handler: function() {
}
}
]
});
treeMenu.showAt(e.xy);
}


Scott.