Question
· Mar 29, 2018

Problem with <a href="#"> on the %ZEN.Component.combobox

For the browser to not update the screen and direct you to top after the onchange event of the combobox, just remove href="#" from the piece:
html[html.length] '<tr id="item_'+n+'_'+this.index+'" class="comboboxItem" onmousedown="zenPage.getComponent('+this.index+').itemMouseDown(event,'+n+');" onmouseup="zenPage.getComponent('+this.index+').itemMouseUp(event,'+n+');"><td width="100%"><a href="#">'+text+'<\/a><\/td><\/tr>';


Of course to do this you'll have to customize the %ZEN.Component.combobox component and inherit it from %ZEN.Component.abstractComboBox.

This solved my problem with long pages and scroll.

Discussion (1)1
Log in or sign up to continue

Another slightly more lightweight approach:

Class DC.Demo.combobox Extends %ZEN.Component.combobox [ System = 3 ]
{

Parameter NAMESPACE = "http://community.intersystems.com/demo";

/// Notification that this component is about to become modal.
ClientMethod onStartModalHandler(zindex) [ Language = javascript ]
{
    this.invokeSuper('onStartModalHandler',arguments);
    this.fixLinks(this.getDropDownDiv());
}

/// Look for all children of specified element, and change links with href="#" to also have onclick = "return false;"
ClientMethod fixLinks(element) [ Language = javascript ]
{
    for (var i = 0; i < element.children.length; i++) {
        this.fixLinks(element.children[i]);
    }
    if (element.getAttribute("href") == "#") {
        element.onclick = function() { return false; };
    }
}

}