Services
Support
Store
©2015 Intersoft Solutions. All rights reserved.

WebGrid Showing Hiding Causes JavaScript Errors

40 replies. Last post: October 1, 2010 8:37 AM by A Yousif
Tags :
  • (None)
Create New
  • New Discussion
  • New Question
  • New Product Feedback
Post Reply
A YousifMember
Posted: July 16, 2010 10:41 AM

We have some pages where we need to show or hide an editable grid based on a combo box selection of some type.  The show/hide seems to work fine, on my test page, the first time, but after that it causes a javascript error to come up per the attached flash video.

Note the value of v6ba86 is:

<TD style="WIDTH: 138px" class="GridHeader ctl00ContentPrismGridViewTest-Header" type="Column" sortOrder="Ascending" isSorted="True" isGrouped="False" dataBound="True" colName="percentFulfillment"></TD>

We use update panels to do the updates.  Our markup code is as follows:

    <asp:UpdatePanel ID="upButtons" runat="server" RenderMode="Inline" ChildrenAsTriggers="true" UpdateMode="Always">
        <ContentTemplate>
            <PRISM:PrismButton ID="btnShow" runat="server" Text="Show" OnClick="btn_Click" />
            <PRISM:PrismButton ID="btnHide" runat="server" Text="Hide" OnClick="btn_Click" />
        </ContentTemplate>
    </asp:UpdatePanel>

    <asp:UpdatePanel ID="upContracStepsMain" runat="server" RenderMode="Inline" ChildrenAsTriggers="false" UpdateMode="Conditional">
        <ContentTemplate>
            <PRISM:PrismPanel ID="PrismPanelMenu" runat="server" Width="400px">
                <PRISM:PrismMenuControl ID="MenuTest" runat="server" 
                    MenuArea="Contract_Edit_Steps" 
                    OnMenuItemClicked="MenuItemClicked" 
                    LoadMenuInSession="true" 
                    LinkedGridId="PrismGridViewTest" />
            </PRISM:PrismPanel>
            <asp:UpdatePanel ID="upTestGrid" runat="server" RenderMode="Inline" ChildrenAsTriggers="false" UpdateMode="Conditional">
                <ContentTemplate>
                    <PRISM:PrismPanel ID="PrismPanelContainer" runat="server" Width="400px">
                        <PRISM:PrismGridViewEdit ID="PrismGridViewTest" runat="server"
                            DisableForcedPageRedirect="true" 
                            Width="100%"
                            MenuArea="Contract_Edit_Steps"
                            OnAddRow="AddRow" 
                            OnUpdateRow="UpdateRow"
                            LinkedMenuControlId="MenuTest"
                            EnableRowContextMenu="false"
                            Height="230px">
                        </PRISM:PrismGridViewEdit>
                    </PRISM:PrismPanel>
                </ContentTemplate>
                <Triggers>
                    <asp:AsyncPostBackTrigger EventName="MenuItemClicked" ControlID="MenuTest" />
                    <asp:AsyncPostBackTrigger EventName="Click" ControlID="btnHide" />
                    <asp:AsyncPostBackTrigger EventName="Click" ControlID="btnShow" />
                </Triggers>
            </asp:UpdatePanel>
        </ContentTemplate>
    </asp:UpdatePanel>

Note that PrismGridViewEdit is our custom control deriving from WebGrid and PrismMenuControl derives from WebMenuBar.

How we hide/show is, after the partial-page post back is done, we register our client-side calls that show/hide with the ajax script manager which executes the grid's and menu's respective Show() and Hide() functions.

The grid client side function is simple: 

    function ShowOrHideGrid(gridId, bShow)
    {
        // get the grid object and make sure it's valid
        oGrid = HaveGrid(gridId);
        if (!jsg_PrismUtility.IsVo(oGrid))
        {
            return false;
        }

        if (bShow)
        {
            oGrid.Show();
        }
        else
        {
            oGrid.Hide();
        }

        return true;
    }

The menu bar client-side is simple too:

    function ShowOrHideMenu(menuId, bShow)
    {
        var oMenuBar = ISGetObject(menuId + menuBarIdSuffix);

        if (!jsg_PrismUtility.IsVo(oMenuBar))
        {
            return false;
        }

        if (bShow)
        {
            oMenuBar.Show();
        }
        else
        {
            oMenuBar.Hide();
        }

        return true;
    }
How to reload datagrid with checked rows
Using DataPresenter along with ClientUI MVVM frame...
All times are GMT -5. The time now is 3:30 AM.
Previous Next