Opened 9 years ago

Closed 9 years ago

#11660 closed defect (wontfix)

OnmouseEnter/Leave ComboBox bug

Reported by: zladivliba Owned by: sjmiles
Priority: blocker Milestone: tbd
Component: Events Version: 1.5
Keywords: Cc:
Blocked By: Blocking:

Description

Hi guys !

I found a real nasty bug using onmouseEnter/Leave (and onmouseover) inside a widget. Here's how to reproduce :

  • define these events for a div
  • adding Comboboxes or FilteringSelect? inside this div

Now when the user mouse pointer will onmouseOver the comboBox/FilteringSelect, the onMouseLeave event will fire on.

That means : while your pointer *is still inside the div*, where the events were defined orignally, the onmouseLeave will fire.

This should not happen when the mouse pointer is still inside the original div.

Here's a widget that will show you the problem :

<div class="F1" dojoAttachEvent="onmouseenter:ShowOptions, onmouseleave:HideOptions">

<div class="F1"> </div> <div class="F1 " dojoAttachPoint="Options" style="display:none">

<div class="F1 " dojoAttachPoint="Description"> Description

</div> <div class="F1" dojoAttachPoint="SelectItem?"></div> <div class="F4 " dojoAttachPoint="Add"></div>

</div>

</div>

========================================================

dojo.provide("de.Ts");

dojo.require("dijit._Widget"); dojo.require("dijit._Templated"); dojo.require("dojox.data.JsonRestStore?"); dojo.require("dojox.data.QueryReadStore?"); dojo.require("dijit.form.FilteringSelect?"); dojo.require("dijit.form.ComboBox?"); dojo.require("dijit.InlineEditBox?"); dojo.require("dijit.form.Textarea"); dojo.require("dojo.date"); dojo.require("dijit.form.Button"); dojo.require("dojo.fx");

dojo.declare("de.Ts",

[dijit._Widget,dijit._Templated], {

widgetsInTemplate:true, Mode:"Stopped", StartDate:"", Intval:"", EditTimer:null, ItemsStore:null, Store:null, DescriptionStore:null, State:"Closed", ItemsSelect:null, DescriptionBox:null,

templatePath: dojo.moduleUrl("dgets","templates/Timesheet.html"),

postMixInProperties: function(){

this.ItemsStore? = new dojox.data.QueryReadStore?({ url: "/te/teee"

});

this.DescriptionStore? = new dojox.data.QueryReadStore?({

url: "/te/t"

});

this.Store = new dojox.data.JsonRestStore?({

target:"/t", idAttribute:"id"

});

},

postCreate: function(){

this.ItemsSelect? = new dijit.form.FilteringSelect?({

store: this.ItemsStore?, searchAttr:"name", autoComplete:true, highlightMatch:"all", labelType:"html", required:false, onFocus: function(data){

this.State = "Opened"; console.log(this.State);

}, onBlur: function(data){

this.State = "Closed"; console.log(this.State);

}

}).placeAt(this.SelectItem?);

this.DescriptionBox? = new dijit.form.ComboBox?({

store: this.DescriptionStore?, searchAttr:"name", autoComplete:true, hasDownArrow:false

}).placeAt(this.Description, "last");

Create the button to add the timesheet

new dijit.form.Button({

label: "Add timesheet", onClick: dojo.hitch(this, function() {

this.AddTS();

})

}).placeAt(this.Add);

},

ShowOptions?: function(){

console.log('show');

dojo.fx.wipeIn({

node: this.Options, duration: 500

}).play();

},

HideOptions?: function(event){

console.log(event.target);

console.log("hide");

dojo.fx.wipeOut({

node: this.Options, duration: 500

}).play();

}

);

Change History (1)

comment:1 Changed 9 years ago by bill

Resolution: wontfix
Status: newclosed

This is expected behavior because the ComboBox? popup is attached to <body>.

However, if you change your code so that _onBlur() calls HideOptions?, and _onShow() calls showOptions() (rather than using onmousenter, onmouseleave at all), then it will do what you want. Don't forget your this.inherited() calls.

Note: See TracTickets for help on using tickets.