Can I bind data to controls in the window?

[Warren]

Hello,

I need to show a RadWindow through javascript and what I need on there are two dropdown controls that are binded. The first the user will select a company and the second will list contacts for that company that was selected. Can I do this binding update all on the window without any postback or at least keeping the radwindow modal?

Thanks,

Warren

[Marin Bratanov]

Hello Warren,

How exactly this can/will be done depends a lot on the setup you have. Nevertheless, here are a few scenarios and my suggestions for them:

• the ContentTemplate is used (see the difference with a full page here: http://demos.telerik.com/aspnet-ajax/window/examples/contenttemplatevsnavigateurl/defaultcs.aspx). In this case, you can use the OnClientShow event of the control to bind your dropdowns via JavaScript. In case you need to take their data from th server - see how to use AJAX in this setup here: http://www.telerik.com/help/aspnet-ajax/window-ajaxifying.html. You can initiate the needed request in the OnClientShow event. Note that if you bind these dropdowns in the initial Page_Load, they will show up databound in the RadWindow already, because their markup is already present in the page. The AJAX approach will be also useful if the dropdowns need to be related, so postbacks are contained within the ContentTemplate.
• the NavigateUrl is used - bind the dropdowns in the initial Page_Load of the content page and set the RadWindow's ReloadOnShow property to true. It will cause it to append a random querystring value to the URL and so the content page will always be requested via the GET verb.

I hope this explains the options and helps you choose the approach most suitable for you.


Regards,

Marin Bratanov
Telerik

 

 

[Warren]

Thanks for the info. I had actually added in the controls and then placed a couple SQLDataSource controls in there for them. It all works this way but the window flashes when it does a postback. I set the VisibleOnPageLoad to True because the window was hiding on the postback. Then I set t to False when I am done. I guess I am still doing it wrong because it flashes on me which is not acceptable for what I am using it for.

Warren

[Shinu]

Hi Warren,

Please have a look into the sample code snippet which works fine at my end.

ASPX:

<telerik:RadAjaxManager ID="RadAjaxManager1" runat="server">
    <AjaxSettings>
        <telerik:AjaxSetting AjaxControlID="radwinBindControls">
            <UpdatedControls>
                <telerik:AjaxUpdatedControl ControlID="raddroplistCountry" />
                <telerik:AjaxUpdatedControl ControlID="raddroplistCity" />
            </UpdatedControls>
        </telerik:AjaxSetting>
    </AjaxSettings>
</telerik:RadAjaxManager>
<telerik:RadButton ID="radbtnOpenWin" runat="server" AutoPostBack="false" Text="Open Window"
    OnClientClicked="OpenWindow">
</telerik:RadButton>
<telerik:RadWindow ID="radwinBindControls" runat="server">
    <ContentTemplate>
        <telerik:RadDropDownList ID="raddroplistCountry" runat="server" DataSourceID="SqlDataSource1" DataTextField="ProductID" DataValueField="OrderID" DefaultMessage="Select" AutoPostBack="true" OnSelectedIndexChanged="raddroplistCountry_SelectedIndexChanged">
        </telerik:RadDropDownList>
        <telerik:RadDropDownList ID="raddroplistCity" runat="server" DefaultMessage="Select">
        </telerik:RadDropDownList>
    </ContentTemplate>
</telerik:RadWindow>

JavaScript:

function OpenWindow(sender, args) {
    var win = $find("<%=radwinBindControls.ClientID %>");
    win.show();
}

C#:

protected void raddroplistCountry_SelectedIndexChanged(object sender, Telerik.Web.UI.DropDownListEventArgs e)
{
    SqlConnection connection = new SqlConnection(ConfigurationManager.ConnectionStrings["ConnectionString"].ConnectionString);
    SqlDataAdapter adapter = new SqlDataAdapter("SELECT * FROM Orders WHERE OrderID=@OrderID", connection);
    adapter.SelectCommand.Parameters.AddWithValue("@OrderID", e.Value);
    DataTable dt = new DataTable();
    adapter.Fill(dt);
    raddroplistCity.DataTextField = "CustomerID";
    raddroplistCity.DataValueField = "OrderID";
    raddroplistCity.DataSource = dt;
    raddroplistCity.DataBind();
}

Let me know if you have any concern.
Thanks,
Shinu.

[Warren]

Thanks for the example. So does the RadAjaxManager handle everything? It looks like you added it with the ID of the controls added in the UpdatedControls list to handle. I will give this a try and post my results.

Warren

[Shinu]

Hi Warren,

Use RadAjaxManager to configure the necessary AJAX settings to specify the AJAX initiators and updated controls. The AJAX initiator performs the AJAX request to update the respectively set controls. So by ajaxifying the controls there will be one partial postback happen and the controls inside the UpdateControl only have the postback, and there will be no flickering of RadWindow.  Please have a look into this help documenation for more information about RadAjaxManager.

Thanks,
Shinu.