[Solved] Inserting rows to parent grid from popup window grid rows

[mohad ebrahim]

Hello,

We are evaluating telerik asp.net ajax components for one of our clients specially the rad grid control. Im stuck in a scenario and need your expert advice and recommendation on how to solve the issue.

Scenerio: (selecting records from popup window grid and adding to parent window grid )

I have a main page (parent page) on which there is a Rad control grid that display set of records. What im trying to do is to open a popup window from this main page and display another rad grid in the popup window. From this popup window grid I want to select one or more records (grid rows through checkbox),  add it to the main grid and close the popup window. How best this can be achieved using telerik ajax functionality. Kindly advice

And also datasource is not bound to the datasource. I'm using a list collection as datasource for the parent and in popup grid.


Regards,

Ebrahim.

[Shinu]

Hello Mohad,

You could achieve the functionality by using grid in RadWindow and passing the selected rows keyvalues to parent page. Then adding the corresponding items to the datasource of parent page grid.

Parent Page:
aspx:

<telerik:RadAjaxManager ID="RadAjaxManager1" runat="server" OnAjaxRequest="RadAjaxManager1_AjaxRequest">
    <AjaxSettings>
        <telerik:AjaxSetting AjaxControlID="RadAjaxManager1">
            <UpdatedControls>
                <telerik:AjaxUpdatedControl ControlID="RadGrid1" />
            </UpdatedControls>
        </telerik:AjaxSetting>
    </AjaxSettings>
</telerik:RadAjaxManager>

<telerik:RadGrid ID="RadGrid1" runat="server" DataSourceID="SqlDataSource1" GridLines="None">
        <MasterTableView AutoGenerateColumns="False" EditMode="InPlace" TableLayout="Fixed">
          . . .
        </MasterTableView>
</telerik:RadGrid>
<telerik:RadWindow ID="RadWindow1" runat="server" OnClientClose="OnClientClose" NavigateUrl="~/Window/grid/window.aspx"
    OpenerElementID="Button1">
</telerik:RadWindow>
<input id="Button1" type="button" value="open window" />

javascript:

<script type="text/javascript">
    function OnClientClose(sender, args) {
        if (args.get_argument() != null) {
            alert(args.get_argument());
            var ajaxManager = $find("<%= RadAjaxManager1.ClientID %>");
            ajaxManager.ajaxRequest(args.get_argument());
        }
    }
</script>

cs:

    protected void RadAjaxManager1_AjaxRequest(object sender, AjaxRequestEventArgs e)
    {
        string str = e.Argument.ToString();
    }

The 'str' contains the datakeyvalues of selected rows. In the AjaxRequest event, extract the arguments (keyvalues) and access the corresponding row in list collection. Then add the row to list collection of grid in parent page, and rebind the grid using Rebind() method.

Window Page:
aspx:

<telerik:RadGrid ID="RadGrid1" runat="server" DataSourceID="SqlDataSource1" GridLines="None">
        <MasterTableView AutoGenerateColumns="False" ClientDataKeyNames="CustomerID">
          . . .
        </MasterTableView>
</telerik:RadGrid>
<input id="Button1" type="button" value="close window" onclick="closeWin();" />

javscript:

<script type="text/javascript">
    function closeWin() {
        var grid = $find("<%= RadGrid1.ClientID %>");
        var count = grid.MasterTableView.get_selectedItems().length;
        var myArray = new Array();
        for (var i = 0; i < count; i++) {
            var row = grid.MasterTableView.get_selectedItems()[i];
            myArray[i] = row.getDataKeyValue("CustomerID"); // add value to array
        }
        var oWnd = GetRadWindow();  // Get access to radwindow
        oWnd.close(myArray); // close window and pass argument
    }
    function GetRadWindow() {
        var oWindow = null;
        if (window.radWindow)
            oWindow = window.radWindow;
        else if (window.frameElement.radWindow)
            oWindow = window.frameElement.radWindow;
        return oWindow;
    }
</script>

The code above shows accessing the selected items and adding the corresponding CustomerID to array in order to pass to parent page.

-Shinu.

[mohad ebrahim]

Hi shinu,

Thanks for the excellent reply and detail solution for the problem. We are happy.

I have another query,

1. How can I hide status bar, title bar of radWindow object ?

2. Once i destroy the radWindow object (through 'DestroyOnClose=true") how to create instance and show the window without refreshing the parent window?

Regards,

Mohad.

[Shinu]

Hello Mohad,

You can set the VisibleStatusbar and VisibleTitlebar properties of RadWindow to "False" in order to hide statusbar and title bar.

Also you can hide the Status bar and Title bar from client code. Attach OnClientShow() event and try the following client side code.

JavaScript:

    function OnClientShow(sender, args) {
        sender.set_visibleTitlebar(false);
        sender.set_visibleStatusbar(false);
    }

And, when we set OpenerElementID for opening the window, postback is not occurred.

-Shinu.