Question

I have ModalPopupExtender that contains a UserControl that basically consists of a GridView and a HiddenField, both on an UpdatePanel. The HiddenField stores the number of the selected row. This way I avoid postbacks when selecting rows.

The ModalPopupExtender contains also some buttons that I want to disable when none of the GridView’s rows are selected. Therefore following javascript is executed in the pageLoad() method:

function trackSelection()
{
    var hf = $get('<%= SXGVSavedTemplates.ClientID %>'+ '_hfSelected');

        if(hf != null)
        {
            hf.onpropertychange = function()
            {
                var btnOk = $get('<%= btnLoadTemplateOK.ClientID %>');
                var btnDelete = $get('<%= btnLoadTemplateDelete.ClientID %>');
                var hfSelected = $get('<%= SXGVSavedTemplates.ClientID %>'+ '_hfSelected');

                var disabled = (hfSelected.value == "");
                if(btnOk != null)
                {
                    btnOk.disabled = disabled;
                }
                if(btnDelete != null)
                {
                    btnDelete.disabled = disabled;
                } 
            }
        }
}

Now this works perfectly fine. When the ModalPopup is shown the buttons are disabled. As soon as I select any of the rows the buttons become enabled. This is great. But the problem is that the UserControl with the GridView disappears! What is more when I resize the browser window it appears back again.
Note that for some reasons (don’t ask why) a CTP version of the Ajax Control Toolkit library is used in the project. Could this be the issue?

I would appreciate any suggestions.

Answer 1

I have found a solution. Apparently the browser does not redraw the grid for some reason. Thus I forced it do do so. Therefore I modified the script adding what follows:

var grid = $get('<%= SXGVSavedTemplates.ClientID %>'+'_gv');
if(grid != null)
{
    grid.className = grid.className;
}

This did the job.