event handling - Hide/Show UI elements by MouseOut/MouseOver client handlers -
the goal mutually replace 2 elements each-other mouseout/mouseover events. elements label , listbox. there ui arrangement in implementation works acceptably in chrome, fails in ie(9). problem occurs during selection listbox per browsers ignor dropped down area part of listbox, triggers mouseout handler , hides listbox.
is there solution forcing browsers consider listbox dropped down area?
app.createlistbox() .setid('listbox'); app.createlabel('item1') .setid('label') .addmouseoverhandler(app.createclienthandler() .foreventsource().setvisible(false) .fortargets(app.getelementbyid('listbox')).setvisible(true)); app.getelementbyid('listbox') .additem('item1') .additem('item2') .setvisible(false) .addmouseouthandler(app.createclienthandler() .foreventsource().setvisible(false) .fortargets(app.getelementbyid('label')).setvisible(true));
many thanks
there possible workaround using server handler hide listbox. tests behaves quite (if not better ) - can test here
function doget() { var app = uiapp.createapplication().setstyleattribute('padding','100px'); var p = app.createverticalpanel(); var serverhandler = app.createserverhandler('handler').addcallbackelement(p) var listbox = app.createlistbox() .setid('listbox').setname('listbox').addchangehandler(serverhandler); var label = app.createlabel('item1').setid('label') .addmouseoverhandler(app.createclienthandler() .foreventsource().setvisible(false) .fortargets(listbox).setvisible(true)); listbox.additem('item1').additem('item2').additem('item3').additem('item4') .setvisible(false) p.add(listbox).add(label) app.add(p) return app } function handler(e){ var app = uiapp.getactiveapplication(); var listbox = app.getelementbyid('listbox') var label = app.getelementbyid('label') listbox.setvisible(false) label.setvisible(true).settext(e.parameter.listbox) return app }
Comments
Post a Comment