Pages

Monday, December 21, 2009

ASP.NET AJAX Control Toolkit Hidden ComboBox Issue

The AJAX ComboBox control that is included in the September 2009 Release of the ASP.NET AJAX Control Toolkit has a problem whenever the control is hidden when the page is initially rendered. The button for the ComboBox control appears as a 1x1 pixel button and the DropDown list is only 1 or 2 pixels high.

The following is a javascript function I wrote that will correct these issues if it is called right after the ComboBox is made visible.

// Resets the ComboBox indicated by the id argument

// that was hidden when the
// page was initially rendered. This method should

// be called right after the
// hidden ComboBox is made visible. This function

// will correct control sizing
// issues that occur when a ComboBox is not visible

// when the page is initially
// rendered.
//
// Parameters:
// id: Name of the ComboBox control to reset.
// --------------------------------------------------

function ResetComboBox(id) { 

    // Get ComboBox 
    var Combo = Sys.Application.findComponent(id);  

    // Get Button Style 
    var ButtonStyle = Combo.get_buttonControl().style;  

    // Reset Button Image 
    ButtonStyle.height = Combo.get_textBoxControl().offsetHeight + 'px'
    ButtonStyle.width = ButtonStyle.height;

    // Reset Options List 
    var OptionListStyle = Combo.get_optionListControl().style; 
    Combo._optionListHeight = null
    Combo._optionListWidth = null
    OptionListStyle.display = 'block';
}

NOTE: I have only tested this with the September 2009 Release of the ASP.NET AJAX Control Toolkit.

2 comments:

  1. Thank you.. your code has helped me solving my problem :) Thanks again.

    ReplyDelete
  2. Microsoft has informed me that this issue (ComboBox problems when container is hidden at page load [AjaxControlToolkit: 25295]) has been resolved in the June 2012 Release of the Ajax Control Toolkit (http://ajaxcontroltoolkit.codeplex.com/releases/view/90063).

    ReplyDelete